@aceshooting/lyra-ui 23.0.0 → 24.1.0

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

@@ -1,8 +1,8 @@
-import{__decorate}from"tslib";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{ref}from"lit/directives/ref.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{hostAriaLabel,srOnly}from"../../../internal/a11y.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{MAX_NATIVE_PLAYBACK_RATE,MIN_NATIVE_PLAYBACK_RATE,NATIVE_MEDIA_RELAY_EVENTS,NativeMediaController,canExitFullscreen,canRequestFullscreen,canRequestPictureInPicture,safeNativeMediaSource}from"../../../internal/media-controller.js";import{finiteRange}from"../../../internal/numbers.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{readResponseText,resolveOwnerFetchTarget}from"../../../internal/resource-loader.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{styles}from"./video.styles.js";import{LYRA_DEFAULT_avPlayerPosition,LYRA_DEFAULT_pause,LYRA_DEFAULT_play,LYRA_DEFAULT_playbackPosition,LYRA_DEFAULT_videoCaptions,LYRA_DEFAULT_videoCaptionsOff,LYRA_DEFAULT_videoEnterFullscreen,LYRA_DEFAULT_videoExitFullscreen,LYRA_DEFAULT_videoExitPictureInPicture,LYRA_DEFAULT_videoMute,LYRA_DEFAULT_videoPictureInPicture,LYRA_DEFAULT_videoPlaybackSpeed,LYRA_DEFAULT_videoPlayerLabel,LYRA_DEFAULT_videoUnmute,LYRA_DEFAULT_videoVolume}from"../../../internal/default-strings.generated.js";const MAX_THUMBNAIL_BYTES=256*1024,MAX_THUMBNAIL_CUES=2e3,PLAYBACK_RATES=[.5,.75,1,1.25,1.5,2];function safeControls(value){return value==="none"||value==="full"?value:"standard"}function safePreload(value){return value==="auto"||value==="none"?value:"metadata"}function parseVttTime(source){const parts=source.trim().split(":").map(Number);if(parts.length<2||parts.length>3||parts.some(part=>!Number.isFinite(part)))return null;const seconds=parts.length===3?parts[0]*3600+parts[1]*60+parts[2]:parts[0]*60+parts[1];return seconds>=0?seconds:null}function parseThumbnailUrl(source,baseUrl,URLCtor){const trimmed=source.trim();if(!trimmed)return null;try{const resolved=new URLCtor(trimmed,baseUrl),sprite=/^#xywh=(\d+),(\d+),(\d+),(\d+)$/u.exec(resolved.hash);resolved.hash="";const src=safeMediaSrc(resolved.href,URLCtor);if(!src)return null;if(!sprite)return{src};const[x,y,width,height]=sprite.slice(1).map(Number);return!Number.isFinite(x)||!Number.isFinite(y)||!Number.isFinite(width)||!Number.isFinite(height)||width<=0||height<=0?null:{src,x,y,width,height}}catch{return null}}function parseThumbnailVtt(source,sourceUrl,URLCtor){const cues=[],normalized=source.replace(/^\uFEFF/u,"").replaceAll(`\r
+import{__decorate}from"tslib";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{ref}from"lit/directives/ref.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{hostAriaLabel,srOnly}from"../../../internal/a11y.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{formatMediaTime}from"../media-time.js";import{MAX_NATIVE_PLAYBACK_RATE,MIN_NATIVE_PLAYBACK_RATE,NATIVE_MEDIA_RELAY_EVENTS,NativeMediaController,canExitFullscreen,canRequestFullscreen,canRequestPictureInPicture,safeNativeMediaSource}from"../../../internal/media-controller.js";import{finiteRange}from"../../../internal/numbers.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{readResponseText,resolveOwnerFetchTarget}from"../../../internal/resource-loader.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{styles}from"./video.styles.js";import{LYRA_DEFAULT_avPlayerPosition,LYRA_DEFAULT_pause,LYRA_DEFAULT_play,LYRA_DEFAULT_playbackPosition,LYRA_DEFAULT_videoCaptions,LYRA_DEFAULT_videoCaptionsOff,LYRA_DEFAULT_videoEnterFullscreen,LYRA_DEFAULT_videoExitFullscreen,LYRA_DEFAULT_videoExitPictureInPicture,LYRA_DEFAULT_videoMute,LYRA_DEFAULT_videoPictureInPicture,LYRA_DEFAULT_videoPlaybackSpeed,LYRA_DEFAULT_videoPlayerLabel,LYRA_DEFAULT_videoUnmute,LYRA_DEFAULT_videoVolume}from"../../../internal/default-strings.generated.js";const MAX_THUMBNAIL_BYTES=256*1024,MAX_THUMBNAIL_CUES=2e3,PLAYBACK_RATES=[.5,.75,1,1.25,1.5,2];function safeControls(value){return value==="none"||value==="full"?value:"standard"}function safePreload(value){return value==="auto"||value==="none"?value:"metadata"}function parseVttTime(source){const parts=source.trim().split(":").map(Number);if(parts.length<2||parts.length>3||parts.some(part=>!Number.isFinite(part)))return null;const seconds=parts.length===3?parts[0]*3600+parts[1]*60+parts[2]:parts[0]*60+parts[1];return seconds>=0?seconds:null}function parseThumbnailUrl(source,baseUrl,URLCtor){const trimmed=source.trim();if(!trimmed)return null;try{const resolved=new URLCtor(trimmed,baseUrl),sprite=/^#xywh=(\d+),(\d+),(\d+),(\d+)$/u.exec(resolved.hash);resolved.hash="";const src=safeMediaSrc(resolved.href,URLCtor);if(!src)return null;if(!sprite)return{src};const[x,y,width,height]=sprite.slice(1).map(Number);return!Number.isFinite(x)||!Number.isFinite(y)||!Number.isFinite(width)||!Number.isFinite(height)||width<=0||height<=0?null:{src,x,y,width,height}}catch{return null}}function parseThumbnailVtt(source,sourceUrl,URLCtor){const cues=[],normalized=source.replace(/^\uFEFF/u,"").replaceAll(`\r
 `,`
 `).replaceAll("\r",`
 `);for(const block of normalized.split(/\n{2,}/u)){if(cues.length>=MAX_THUMBNAIL_CUES)break;const lines=block.split(`
-`).map(line=>line.trim()).filter(Boolean),timingIndex=lines.findIndex(line=>line.includes("-->"));if(timingIndex<0||!lines[timingIndex+1])continue;const match=/^(\S+)\s+-->\s+(\S+)/u.exec(lines[timingIndex]);if(!match)continue;const start=parseVttTime(match[1]),end=parseVttTime(match[2]),thumbnail=parseThumbnailUrl(lines[timingIndex+1],sourceUrl,URLCtor);start===null||end===null||end<=start||!thumbnail||cues.push({start,end,...thumbnail})}return cues}function textTracks(media){const result=[];if(!media)return result;for(let index=0;index<media.textTracks.length;index+=1){const track=media.textTracks[index];track&&result.push(track)}return result}function formatTime(seconds,locale){const total=Math.floor(finiteRange(seconds,0,0)),hours=Math.floor(total/3600),minutes=Math.floor(total%3600/60),remaining=total%60,regular=getNumberFormat(locale,{maximumFractionDigits:0,useGrouping:!1}),padded=getNumberFormat(locale,{maximumFractionDigits:0,minimumIntegerDigits:2,useGrouping:!1});return hours>0?`${regular.format(hours)}:${padded.format(minutes)}:${padded.format(remaining)}`:`${regular.format(minutes)}:${padded.format(remaining)}`}function unsupportedPromise(host,message){const DOMExceptionConstructor=host.ownerDocument.defaultView?.DOMException??DOMException;return Promise.reject(new DOMExceptionConstructor(message,"NotSupportedError"))}class LyraVideo extends LyraElement{constructor(){super(...arguments),this.autoplay=!1,this.autoplayMuted=!1,this.autoplayOnVisible=!1,this.controls="standard",this.currentTime=0,this.duration=0,this.iconLibrary="system",this.loop=!1,this.muted=!1,this.playing=!1,this.poster="",this.preload="metadata",this.src="",this.thumbnails="",this.title="",this.volume=1,this.playbackRate=1,this.posterVisible=!0,this.captionText="",this.captionTracks=[],this.fullscreen=!1,this.pictureInPicture=!1,this.thumbnailCues=[],this.thumbnailPosition=50,this.mediaController=new NativeMediaController(this,{relayEvents:NATIVE_MEDIA_RELAY_EVENTS.filter(type=>type!=="timeupdate"),onEvent:event=>this.onNativeMediaEvent(event)}),this.pendingNativeEcho={timeupdate:!1,muted:!1},this.thumbnailGeneration=0,this.visibilityPaused=!1,this.captionListeners=[],this.onControlFocus=event=>{relayNativeEvent(this,event)},this.onControlBlur=event=>{relayNativeEvent(this,event)},this.mediaRef=element=>{const video=element?.localName==="video"?element:void 0;this.mediaController.attach(video),video&&(this.mediaController.volume=finiteRange(this.volume,1,0,1),this.autoplayMuted&&!this.muted?this.forceAutoplayMuted():this.mediaController.muted=this.muted,this.mediaController.playbackRate=this.playbackRate)},this.onSourceSlotChange=()=>this.syncSources(),this.onTimelineInput=event=>{const input=event.currentTarget;this.seek(Number(input.value))},this.onVolumeInput=event=>{this.setVolume(Number(event.currentTarget.value))},this.onRateChange=event=>{this.setPlaybackRate(Number(event.currentTarget.value))},this.onPosterPlay=()=>{this.play().catch(()=>{})},this.onFullscreenButton=()=>{(this.fullscreen?this.exitFullscreen():this.requestFullscreen()).catch(()=>{})},this.onFullscreenChange=()=>{this.fullscreen=this.ownerDocument.fullscreenElement===this.wrapperEl},this.onPictureInPictureChange=()=>{const documentRef=this.ownerDocument;this.pictureInPicture=documentRef.pictureInPictureElement===this.videoEl},this.togglePictureInPicture=()=>{const video=this.videoEl,documentRef=this.ownerDocument;if(!video||!canRequestPictureInPicture(video))return;(documentRef.pictureInPictureElement===video?documentRef.exitPictureInPicture?.():video.requestPictureInPicture().then(()=>{}))?.catch(()=>{})},this.onCaptionChange=event=>{const selected=Number(event.currentTarget.value);this.captionTracks.forEach(({track},index)=>{track.mode=index===selected?"hidden":"disabled"}),this.syncActiveCaption()},this.onTimelinePointerMove=event=>{const rect=event.currentTarget.getBoundingClientRect();if(rect.width<=0||this.duration<=0){this.activeThumbnail=void 0;return}const ratio=finiteRange((event.clientX-rect.left)/rect.width,0,0,1),time=ratio*this.duration;this.activeThumbnail=this.thumbnailCues.find(cue=>time>=cue.start&&time<cue.end),this.thumbnailPosition=ratio*100},this.onTimelinePointerLeave=()=>{this.activeThumbnail=void 0}}static{this.defaultStrings={...super.defaultStrings,avPlayerPosition:LYRA_DEFAULT_avPlayerPosition,pause:LYRA_DEFAULT_pause,play:LYRA_DEFAULT_play,playbackPosition:LYRA_DEFAULT_playbackPosition,videoCaptions:LYRA_DEFAULT_videoCaptions,videoCaptionsOff:LYRA_DEFAULT_videoCaptionsOff,videoEnterFullscreen:LYRA_DEFAULT_videoEnterFullscreen,videoExitFullscreen:LYRA_DEFAULT_videoExitFullscreen,videoExitPictureInPicture:LYRA_DEFAULT_videoExitPictureInPicture,videoMute:LYRA_DEFAULT_videoMute,videoPictureInPicture:LYRA_DEFAULT_videoPictureInPicture,videoPlaybackSpeed:LYRA_DEFAULT_videoPlaybackSpeed,videoPlayerLabel:LYRA_DEFAULT_videoPlayerLabel,videoUnmute:LYRA_DEFAULT_videoUnmute,videoVolume:LYRA_DEFAULT_videoVolume}}static{this.styles=[LyraElement.styles,styles,srOnly]}static get observedAttributes(){return[...new Set([...super.observedAttributes,"currenttime","current-time"])]}attributeChangedCallback(name,oldValue,newValue){if(name==="currenttime"||name==="current-time"){oldValue!==newValue&&(this.currentTime=finiteRange(Number(newValue??0),0,0));return}super.attributeChangedCallback(name,oldValue,newValue)}get videoEl(){const media=this.mediaController.element;return media?.localName==="video"?media:void 0}get playControl(){return this.renderRoot.querySelector('[part="poster-play-button"], [data-control="play"]')}focus(options){this.playControl?.focus(options)}blur(){this.playControl?.blur()}click(){this.playControl?.click()}connectedCallback(){super.connectedCallback(),this.mediaController.reconnect(),this.ownerDocument.addEventListener("fullscreenchange",this.onFullscreenChange),this.ownerDocument.addEventListener("enterpictureinpicture",this.onPictureInPictureChange,!0),this.ownerDocument.addEventListener("leavepictureinpicture",this.onPictureInPictureChange,!0),this.hasUpdated&&(this.scheduleAfterUpdate(()=>this.bindCaptionTracks(),"video-caption-reconnect"),this.scheduleAfterUpdate(()=>this.configureVisibilityObserver(),"video-visibility-reconnect"),this.thumbnails&&this.scheduleAfterUpdate(()=>{this.loadThumbnails()},"video-thumbnails-reconnect"))}firstUpdated(changed){super.firstUpdated(changed),this.syncSources(),this.configureVisibilityObserver(),this.loadThumbnails()}disconnectedCallback(){this.mediaController.disconnect(),this.thumbnailGeneration+=1,this.thumbnailAbort?.abort(),this.thumbnailAbort=void 0,this.intersectionObserver?.disconnect(),this.intersectionObserver=void 0,this.unbindCaptionTracks(),this.captionTracks.length&&(this.captionTracks=[]),this.captionText&&(this.captionText=""),this.activeThumbnail&&(this.activeThumbnail=void 0),this.playing&&(this.playing=!1),this.fullscreen&&(this.fullscreen=!1),this.pictureInPicture&&(this.pictureInPicture=!1),this.ownerDocument.removeEventListener("fullscreenchange",this.onFullscreenChange),this.ownerDocument.removeEventListener("enterpictureinpicture",this.onPictureInPictureChange,!0),this.ownerDocument.removeEventListener("leavepictureinpicture",this.onPictureInPictureChange,!0),super.disconnectedCallback()}willUpdate(changed){if(super.willUpdate(changed),changed.has("controls")&&(this.controls=safeControls(this.controls)),changed.has("preload")&&(this.preload=safePreload(this.preload)),changed.has("volume")){const next=finiteRange(this.volume,this.mediaController.volume,0,1);Object.is(next,this.volume)||(this.volume=next),this.mediaController.volume=next}if(changed.has("muted")&&(this.mediaController.muted=this.muted),changed.has("autoplayMuted")&&this.autoplayMuted&&this.forceAutoplayMuted(),changed.has("currentTime")){const max=this.mediaController.duration>0?this.mediaController.duration:Number.POSITIVE_INFINITY,next=finiteRange(this.currentTime,0,0,max);Object.is(next,this.currentTime)||(this.currentTime=next),this.mediaController.currentTime=next}if(changed.has("duration")){const next=finiteRange(this.duration,0,0);Object.is(next,this.duration)||(this.duration=next)}changed.has("src")&&(this.visibilityPaused=!1,this.posterVisible=!0,this.hasUpdated&&(this.playing=!1,this.duration=0,this.currentTime=0,this.scheduleAfterUpdate(()=>this.syncSources(),"video-sources"))),changed.has("thumbnails")&&this.hasUpdated&&this.scheduleAfterUpdate(()=>{this.loadThumbnails()},"video-thumbnails"),changed.has("autoplayOnVisible")&&this.hasUpdated&&this.scheduleAfterUpdate(()=>this.configureVisibilityObserver(),"video-visibility")}forceAutoplayMuted(){this.pendingNativeEcho.muted=!0,this.mediaController.muted=!0}sourceSignature(){const nodes=[...this.children].filter(child=>child.localName==="source"||child.localName==="track").map(child=>({tag:child.localName,src:child.getAttribute("src"),type:child.getAttribute("type"),media:child.getAttribute("media"),kind:child.getAttribute("kind"),srclang:child.getAttribute("srclang"),label:child.getAttribute("label"),default:child.hasAttribute("default")}));return JSON.stringify({src:this.src,nodes})}syncSources(force=!1){if(!this.videoEl)return;const signature=this.sourceSignature();!force&&signature===this.lastSourceSignature||(this.lastSourceSignature=signature,this.visibilityPaused=!1,this.unbindCaptionTracks(),this.captionTracks.length&&(this.captionTracks=[]),this.captionText&&(this.captionText=""),this.mediaController.setSources({src:this.src,nodes:this.children}),this.mediaController.currentTime=this.currentTime)}getVideoElement(){return this.videoEl}getState(){const video=this.videoEl;return{playing:!!(video&&!video.paused&&!video.ended),currentTime:this.mediaController.currentTime,duration:this.mediaController.duration,volume:this.mediaController.volume,muted:this.mediaController.muted,playbackRate:this.mediaController.playbackRate}}play(){return this.mediaController.play()}pause(){this.visibilityPaused=!1,this.mediaController.pause()}load(){this.visibilityPaused=!1,this.currentTime=0,this.syncSources(!0)}seek(time){const max=this.mediaController.duration>0?this.mediaController.duration:Number.POSITIVE_INFINITY,next=finiteRange(time,0,0,max);this.mediaController.currentTime=next,this.currentTime=this.mediaController.currentTime,this.pendingNativeEcho.timeupdate=!0,this.dispatchHostTimeupdate()}dispatchHostTimeupdate(){const EventConstructor=this.ownerDocument.defaultView?.Event??Event;this.dispatchEvent(new EventConstructor("timeupdate"))}setPlaybackRate(rate){const next=finiteRange(rate,1,MIN_NATIVE_PLAYBACK_RATE,MAX_NATIVE_PLAYBACK_RATE);this.playbackRate=next,this.mediaController.playbackRate=next}rateSelectOptions(){const rates=PLAYBACK_RATES;return rates.includes(this.playbackRate)?rates:[...rates,this.playbackRate].sort((a,b)=>a-b)}setVolume(volume){const next=finiteRange(volume,this.mediaController.volume,0,1);this.volume=next,this.mediaController.volume=next}toggleMute(){const next=!this.mediaController.muted;this.muted=next,this.mediaController.muted=next}togglePlay(){this.videoEl?.paused??!0?this.play().catch(()=>{}):this.pause()}requestFullscreen(){return canRequestFullscreen(this.wrapperEl)?this.wrapperEl.requestFullscreen():unsupportedPromise(this,"Fullscreen is unavailable for this video.")}exitFullscreen(){return canExitFullscreen(this.ownerDocument)?this.ownerDocument.exitFullscreen():unsupportedPromise(this,"Fullscreen exit is unavailable for this video.")}onNativeMediaEvent(event){if(this.videoEl)switch(event.type){case"loadedmetadata":case"durationchange":this.duration=this.mediaController.duration,this.currentTime=this.mediaController.currentTime,this.bindCaptionTracks();break;case"play":this.playing=!0,this.posterVisible=!1;break;case"pause":case"ended":this.playing=!1;break;case"error":this.playing=!1,this.duration=0,this.currentTime=0;break;case"timeupdate":this.currentTime=this.mediaController.currentTime,this.pendingNativeEcho.timeupdate?this.pendingNativeEcho.timeupdate=!1:this.dispatchHostTimeupdate();break;case"seeked":this.currentTime=this.mediaController.currentTime,this.pendingNativeEcho.timeupdate=!1;break;case"volumechange":this.volume=this.mediaController.volume,this.pendingNativeEcho.muted?this.pendingNativeEcho.muted=!1:this.muted=this.mediaController.muted;break;case"ratechange":this.playbackRate=this.mediaController.playbackRate;break}}canRenderFullscreen(){return typeof this.ownerDocument.defaultView?.HTMLElement.prototype.requestFullscreen=="function"&&this.ownerDocument.fullscreenEnabled!==!1}canRenderPictureInPicture(){const ownerWindow=this.ownerDocument.defaultView,documentRef=this.ownerDocument;return this.controls==="full"&&typeof ownerWindow?.HTMLVideoElement.prototype.requestPictureInPicture=="function"&&documentRef.pictureInPictureEnabled!==!1}pauseForVisibility(){this.visibilityPaused=!0,this.mediaController.pause()}configureVisibilityObserver(){const visibilityOwnedPause=this.visibilityPaused;this.intersectionObserver?.disconnect(),this.intersectionObserver=void 0;const ownerWindow=this.ownerDocument.defaultView,IntersectionObserverCtor=ownerWindow?.IntersectionObserver;if(!this.autoplayOnVisible||!IntersectionObserverCtor){visibilityOwnedPause&&(this.visibilityPaused=!1,this.mediaController.play().catch(()=>{}));return}this.visibilityPaused=visibilityOwnedPause;let observer;observer=new IntersectionObserverCtor(entries=>{if(!observer||!this.isConnected||this.intersectionObserver!==observer||this.ownerDocument.defaultView!==ownerWindow)return;const visible=entries[0]?.isIntersecting??!0,video=this.videoEl;if(video){if(!visible){video.paused||this.pauseForVisibility();return}this.visibilityPaused&&(this.visibilityPaused=!1,this.mediaController.play().catch(()=>{}))}}),this.intersectionObserver=observer,observer.observe(this)}unbindCaptionTracks(){for(const{track,listener}of this.captionListeners)track.removeEventListener("cuechange",listener);this.captionListeners=[]}bindCaptionTracks(){this.unbindCaptionTracks();const selectable=textTracks(this.videoEl).filter(track=>track.kind==="captions"||track.kind==="subtitles");for(const track of selectable)track.mode==="showing"&&(track.mode="hidden");this.captionTracks=selectable.map(track=>({track,label:track.label||track.language||this.localize("videoCaptions"),language:track.language}));for(const track of selectable){const listener=()=>this.syncActiveCaption();track.addEventListener("cuechange",listener),this.captionListeners.push({track,listener})}this.syncActiveCaption()}syncActiveCaption(){const lines=[];for(const{track}of this.captionTracks)if(!(track.mode!=="hidden"||!track.activeCues))for(let index=0;index<track.activeCues.length;index+=1){const cue=track.activeCues[index];cue&&typeof cue.text=="string"&&lines.push(cue.text)}this.captionText=lines.join(`
+`).map(line=>line.trim()).filter(Boolean),timingIndex=lines.findIndex(line=>line.includes("-->"));if(timingIndex<0||!lines[timingIndex+1])continue;const match=/^(\S+)\s+-->\s+(\S+)/u.exec(lines[timingIndex]);if(!match)continue;const start=parseVttTime(match[1]),end=parseVttTime(match[2]),thumbnail=parseThumbnailUrl(lines[timingIndex+1],sourceUrl,URLCtor);start===null||end===null||end<=start||!thumbnail||cues.push({start,end,...thumbnail})}return cues}function textTracks(media){const result=[];if(!media)return result;for(let index=0;index<media.textTracks.length;index+=1){const track=media.textTracks[index];track&&result.push(track)}return result}function unsupportedPromise(host,message){const DOMExceptionConstructor=host.ownerDocument.defaultView?.DOMException??DOMException;return Promise.reject(new DOMExceptionConstructor(message,"NotSupportedError"))}class LyraVideo extends LyraElement{constructor(){super(...arguments),this.autoplay=!1,this.autoplayMuted=!1,this.autoplayOnVisible=!1,this.controls="standard",this.currentTime=0,this.duration=0,this.iconLibrary="system",this.loop=!1,this.muted=!1,this.playing=!1,this.poster="",this.preload="metadata",this.src="",this.thumbnails="",this.title="",this.volume=1,this.playbackRate=1,this.posterVisible=!0,this.captionText="",this.captionTracks=[],this.fullscreen=!1,this.pictureInPicture=!1,this.thumbnailCues=[],this.thumbnailPosition=50,this.mediaController=new NativeMediaController(this,{relayEvents:NATIVE_MEDIA_RELAY_EVENTS.filter(type=>type!=="timeupdate"),onEvent:event=>this.onNativeMediaEvent(event)}),this.pendingNativeEcho={timeupdate:!1,muted:!1},this.thumbnailGeneration=0,this.visibilityPaused=!1,this.captionListeners=[],this.onControlFocus=event=>{relayNativeEvent(this,event)},this.onControlBlur=event=>{relayNativeEvent(this,event)},this.mediaRef=element=>{const video=element?.localName==="video"?element:void 0;this.mediaController.attach(video),video&&(this.mediaController.volume=finiteRange(this.volume,1,0,1),this.autoplayMuted&&!this.muted?this.forceAutoplayMuted():this.mediaController.muted=this.muted,this.mediaController.playbackRate=this.playbackRate)},this.onSourceSlotChange=()=>this.syncSources(),this.onTimelineInput=event=>{const input=event.currentTarget;this.seek(Number(input.value))},this.onVolumeInput=event=>{this.setVolume(Number(event.currentTarget.value))},this.onRateChange=event=>{this.setPlaybackRate(Number(event.currentTarget.value))},this.onPosterPlay=()=>{this.play().catch(()=>{})},this.onFullscreenButton=()=>{(this.fullscreen?this.exitFullscreen():this.requestFullscreen()).catch(()=>{})},this.onFullscreenChange=()=>{this.fullscreen=this.ownerDocument.fullscreenElement===this.wrapperEl},this.onPictureInPictureChange=()=>{const documentRef=this.ownerDocument;this.pictureInPicture=documentRef.pictureInPictureElement===this.videoEl},this.togglePictureInPicture=()=>{const video=this.videoEl,documentRef=this.ownerDocument;if(!video||!canRequestPictureInPicture(video))return;(documentRef.pictureInPictureElement===video?documentRef.exitPictureInPicture?.():video.requestPictureInPicture().then(()=>{}))?.catch(()=>{})},this.onCaptionChange=event=>{const selected=Number(event.currentTarget.value);this.captionTracks.forEach(({track},index)=>{track.mode=index===selected?"hidden":"disabled"}),this.syncActiveCaption()},this.onTimelinePointerMove=event=>{const rect=event.currentTarget.getBoundingClientRect();if(rect.width<=0||this.duration<=0){this.activeThumbnail=void 0;return}const ratio=finiteRange((event.clientX-rect.left)/rect.width,0,0,1),time=ratio*this.duration;this.activeThumbnail=this.thumbnailCues.find(cue=>time>=cue.start&&time<cue.end),this.thumbnailPosition=ratio*100},this.onTimelinePointerLeave=()=>{this.activeThumbnail=void 0}}static{this.defaultStrings={...super.defaultStrings,avPlayerPosition:LYRA_DEFAULT_avPlayerPosition,pause:LYRA_DEFAULT_pause,play:LYRA_DEFAULT_play,playbackPosition:LYRA_DEFAULT_playbackPosition,videoCaptions:LYRA_DEFAULT_videoCaptions,videoCaptionsOff:LYRA_DEFAULT_videoCaptionsOff,videoEnterFullscreen:LYRA_DEFAULT_videoEnterFullscreen,videoExitFullscreen:LYRA_DEFAULT_videoExitFullscreen,videoExitPictureInPicture:LYRA_DEFAULT_videoExitPictureInPicture,videoMute:LYRA_DEFAULT_videoMute,videoPictureInPicture:LYRA_DEFAULT_videoPictureInPicture,videoPlaybackSpeed:LYRA_DEFAULT_videoPlaybackSpeed,videoPlayerLabel:LYRA_DEFAULT_videoPlayerLabel,videoUnmute:LYRA_DEFAULT_videoUnmute,videoVolume:LYRA_DEFAULT_videoVolume}}static{this.styles=[LyraElement.styles,styles,srOnly]}static get observedAttributes(){return[...new Set([...super.observedAttributes,"currenttime","current-time"])]}attributeChangedCallback(name,oldValue,newValue){if(name==="currenttime"||name==="current-time"){oldValue!==newValue&&(this.currentTime=finiteRange(Number(newValue??0),0,0));return}super.attributeChangedCallback(name,oldValue,newValue)}get videoEl(){const media=this.mediaController.element;return media?.localName==="video"?media:void 0}get playControl(){return this.renderRoot.querySelector('[part="poster-play-button"], [data-control="play"]')}focus(options){this.playControl?.focus(options)}blur(){this.playControl?.blur()}click(){this.playControl?.click()}connectedCallback(){super.connectedCallback(),this.mediaController.reconnect(),this.ownerDocument.addEventListener("fullscreenchange",this.onFullscreenChange),this.ownerDocument.addEventListener("enterpictureinpicture",this.onPictureInPictureChange,!0),this.ownerDocument.addEventListener("leavepictureinpicture",this.onPictureInPictureChange,!0),this.hasUpdated&&(this.scheduleAfterUpdate(()=>this.bindCaptionTracks(),"video-caption-reconnect"),this.scheduleAfterUpdate(()=>this.configureVisibilityObserver(),"video-visibility-reconnect"),this.thumbnails&&this.scheduleAfterUpdate(()=>{this.loadThumbnails()},"video-thumbnails-reconnect"))}firstUpdated(changed){super.firstUpdated(changed),this.syncSources(),this.configureVisibilityObserver(),this.loadThumbnails()}disconnectedCallback(){this.mediaController.disconnect(),this.thumbnailGeneration+=1,this.thumbnailAbort?.abort(),this.thumbnailAbort=void 0,this.intersectionObserver?.disconnect(),this.intersectionObserver=void 0,this.unbindCaptionTracks(),this.captionTracks.length&&(this.captionTracks=[]),this.captionText&&(this.captionText=""),this.activeThumbnail&&(this.activeThumbnail=void 0),this.playing&&(this.playing=!1),this.fullscreen&&(this.fullscreen=!1),this.pictureInPicture&&(this.pictureInPicture=!1),this.ownerDocument.removeEventListener("fullscreenchange",this.onFullscreenChange),this.ownerDocument.removeEventListener("enterpictureinpicture",this.onPictureInPictureChange,!0),this.ownerDocument.removeEventListener("leavepictureinpicture",this.onPictureInPictureChange,!0),super.disconnectedCallback()}willUpdate(changed){if(super.willUpdate(changed),changed.has("controls")&&(this.controls=safeControls(this.controls)),changed.has("preload")&&(this.preload=safePreload(this.preload)),changed.has("volume")){const next=finiteRange(this.volume,this.mediaController.volume,0,1);Object.is(next,this.volume)||(this.volume=next),this.mediaController.volume=next}if(changed.has("muted")&&(this.mediaController.muted=this.muted),changed.has("autoplayMuted")&&this.autoplayMuted&&this.forceAutoplayMuted(),changed.has("currentTime")){const max=this.mediaController.duration>0?this.mediaController.duration:Number.POSITIVE_INFINITY,next=finiteRange(this.currentTime,0,0,max);Object.is(next,this.currentTime)||(this.currentTime=next),this.mediaController.currentTime=next}if(changed.has("duration")){const next=finiteRange(this.duration,0,0);Object.is(next,this.duration)||(this.duration=next)}changed.has("src")&&(this.visibilityPaused=!1,this.posterVisible=!0,this.hasUpdated&&(this.playing=!1,this.duration=0,this.currentTime=0,this.scheduleAfterUpdate(()=>this.syncSources(),"video-sources"))),changed.has("thumbnails")&&this.hasUpdated&&this.scheduleAfterUpdate(()=>{this.loadThumbnails()},"video-thumbnails"),changed.has("autoplayOnVisible")&&this.hasUpdated&&this.scheduleAfterUpdate(()=>this.configureVisibilityObserver(),"video-visibility")}forceAutoplayMuted(){this.pendingNativeEcho.muted=!0,this.mediaController.muted=!0}sourceSignature(){const nodes=[...this.children].filter(child=>child.localName==="source"||child.localName==="track").map(child=>({tag:child.localName,src:child.getAttribute("src"),type:child.getAttribute("type"),media:child.getAttribute("media"),kind:child.getAttribute("kind"),srclang:child.getAttribute("srclang"),label:child.getAttribute("label"),default:child.hasAttribute("default")}));return JSON.stringify({src:this.src,nodes})}syncSources(force=!1){if(!this.videoEl)return;const signature=this.sourceSignature();!force&&signature===this.lastSourceSignature||(this.lastSourceSignature=signature,this.visibilityPaused=!1,this.unbindCaptionTracks(),this.captionTracks.length&&(this.captionTracks=[]),this.captionText&&(this.captionText=""),this.mediaController.setSources({src:this.src,nodes:this.children}),this.mediaController.currentTime=this.currentTime)}getVideoElement(){return this.videoEl}getState(){const video=this.videoEl;return{playing:!!(video&&!video.paused&&!video.ended),currentTime:this.mediaController.currentTime,duration:this.mediaController.duration,volume:this.mediaController.volume,muted:this.mediaController.muted,playbackRate:this.mediaController.playbackRate}}play(){return this.mediaController.play()}pause(){this.visibilityPaused=!1,this.mediaController.pause()}load(){this.visibilityPaused=!1,this.currentTime=0,this.syncSources(!0)}seek(time){const max=this.mediaController.duration>0?this.mediaController.duration:Number.POSITIVE_INFINITY,next=finiteRange(time,0,0,max);this.mediaController.currentTime=next,this.currentTime=this.mediaController.currentTime,this.pendingNativeEcho.timeupdate=!0,this.dispatchHostTimeupdate()}dispatchHostTimeupdate(){const EventConstructor=this.ownerDocument.defaultView?.Event??Event;this.dispatchEvent(new EventConstructor("timeupdate"))}setPlaybackRate(rate){const next=finiteRange(rate,1,MIN_NATIVE_PLAYBACK_RATE,MAX_NATIVE_PLAYBACK_RATE);this.playbackRate=next,this.mediaController.playbackRate=next}rateSelectOptions(){const rates=PLAYBACK_RATES;return rates.includes(this.playbackRate)?rates:[...rates,this.playbackRate].sort((a,b)=>a-b)}setVolume(volume){const next=finiteRange(volume,this.mediaController.volume,0,1);this.volume=next,this.mediaController.volume=next}toggleMute(){const next=!this.mediaController.muted;this.muted=next,this.mediaController.muted=next}togglePlay(){this.videoEl?.paused??!0?this.play().catch(()=>{}):this.pause()}requestFullscreen(){return canRequestFullscreen(this.wrapperEl)?this.wrapperEl.requestFullscreen():unsupportedPromise(this,"Fullscreen is unavailable for this video.")}exitFullscreen(){return canExitFullscreen(this.ownerDocument)?this.ownerDocument.exitFullscreen():unsupportedPromise(this,"Fullscreen exit is unavailable for this video.")}onNativeMediaEvent(event){if(this.videoEl)switch(event.type){case"loadedmetadata":case"durationchange":this.duration=this.mediaController.duration,this.currentTime=this.mediaController.currentTime,this.bindCaptionTracks();break;case"play":this.playing=!0,this.posterVisible=!1;break;case"pause":case"ended":this.playing=!1;break;case"error":this.playing=!1,this.duration=0,this.currentTime=0;break;case"timeupdate":this.currentTime=this.mediaController.currentTime,this.pendingNativeEcho.timeupdate?this.pendingNativeEcho.timeupdate=!1:this.dispatchHostTimeupdate();break;case"seeked":this.currentTime=this.mediaController.currentTime,this.pendingNativeEcho.timeupdate=!1;break;case"volumechange":this.volume=this.mediaController.volume,this.pendingNativeEcho.muted?this.pendingNativeEcho.muted=!1:this.muted=this.mediaController.muted;break;case"ratechange":this.playbackRate=this.mediaController.playbackRate;break}}canRenderFullscreen(){return typeof this.ownerDocument.defaultView?.HTMLElement.prototype.requestFullscreen=="function"&&this.ownerDocument.fullscreenEnabled!==!1}canRenderPictureInPicture(){const ownerWindow=this.ownerDocument.defaultView,documentRef=this.ownerDocument;return this.controls==="full"&&typeof ownerWindow?.HTMLVideoElement.prototype.requestPictureInPicture=="function"&&documentRef.pictureInPictureEnabled!==!1}pauseForVisibility(){this.visibilityPaused=!0,this.mediaController.pause()}configureVisibilityObserver(){const visibilityOwnedPause=this.visibilityPaused;this.intersectionObserver?.disconnect(),this.intersectionObserver=void 0;const ownerWindow=this.ownerDocument.defaultView,IntersectionObserverCtor=ownerWindow?.IntersectionObserver;if(!this.autoplayOnVisible||!IntersectionObserverCtor){visibilityOwnedPause&&(this.visibilityPaused=!1,this.mediaController.play().catch(()=>{}));return}this.visibilityPaused=visibilityOwnedPause;let observer;observer=new IntersectionObserverCtor(entries=>{if(!observer||!this.isConnected||this.intersectionObserver!==observer||this.ownerDocument.defaultView!==ownerWindow)return;const visible=entries[0]?.isIntersecting??!0,video=this.videoEl;if(video){if(!visible){video.paused||this.pauseForVisibility();return}this.visibilityPaused&&(this.visibilityPaused=!1,this.mediaController.play().catch(()=>{}))}}),this.intersectionObserver=observer,observer.observe(this)}unbindCaptionTracks(){for(const{track,listener}of this.captionListeners)track.removeEventListener("cuechange",listener);this.captionListeners=[]}bindCaptionTracks(){this.unbindCaptionTracks();const selectable=textTracks(this.videoEl).filter(track=>track.kind==="captions"||track.kind==="subtitles");for(const track of selectable)track.mode==="showing"&&(track.mode="hidden");this.captionTracks=selectable.map(track=>({track,label:track.label||track.language||this.localize("videoCaptions"),language:track.language}));for(const track of selectable){const listener=()=>this.syncActiveCaption();track.addEventListener("cuechange",listener),this.captionListeners.push({track,listener})}this.syncActiveCaption()}syncActiveCaption(){const lines=[];for(const{track}of this.captionTracks)if(!(track.mode!=="hidden"||!track.activeCues))for(let index=0;index<track.activeCues.length;index+=1){const cue=track.activeCues[index];cue&&typeof cue.text=="string"&&lines.push(cue.text)}this.captionText=lines.join(`
 `)}async loadThumbnails(){const generation=++this.thumbnailGeneration;this.thumbnailAbort?.abort(),this.thumbnailAbort=void 0,this.thumbnailCues.length&&(this.thumbnailCues=[]),this.activeThumbnail&&(this.activeThumbnail=void 0);const fetchTarget=resolveOwnerFetchTarget(this,this.thumbnails),AbortControllerCtor=fetchTarget?.view.AbortController;if(!fetchTarget||!AbortControllerCtor)return;const controller=new AbortControllerCtor;this.thumbnailAbort=controller;try{const response=await fetchTarget.view.fetch(fetchTarget.url,{signal:controller.signal});if(generation!==this.thumbnailGeneration||!this.isConnected||this.ownerDocument.defaultView!==fetchTarget.view||!response.ok)return;const text=await readResponseText(response,MAX_THUMBNAIL_BYTES);if(generation!==this.thumbnailGeneration||!this.isConnected||this.ownerDocument.defaultView!==fetchTarget.view)return;this.thumbnailCues=parseThumbnailVtt(text,fetchTarget.url,fetchTarget.view.URL)}catch{if(generation!==this.thumbnailGeneration||!this.isConnected)return;this.thumbnailCues=[],this.activeThumbnail=void 0}finally{generation===this.thumbnailGeneration&&(this.thumbnailAbort=void 0)}}renderIcon(name,path){return html`<lr-icon library=${this.iconLibrary} name=${name} aria-hidden="true">
       <path d=${path}></path>
     </lr-icon>`}renderDecorativeIconLayer(content){return html`<span class="control-icon-layer" aria-hidden="true" inert>${content}</span>`}renderPlaySlots(){return html`
@@ -69,16 +69,16 @@ import{__decorate}from"tslib";import{html,nothing}from"lit";import{property,quer
               ?disabled=${max<=0}
               @input=${this.onTimelineInput}
             >
-            <span id="video-progress-description" class="sr-only">${this.localize("avPlayerPosition",void 0,{current:formatTime(this.currentTime,this.effectiveLocale),duration:formatTime(this.duration,this.effectiveLocale)})}</span>
+            <span id="video-progress-description" class="sr-only">${this.localize("avPlayerPosition",void 0,{current:formatMediaTime(this.currentTime,this.effectiveLocale),duration:formatMediaTime(this.duration,this.effectiveLocale)})}</span>
             <span part="timeline-track">
               <span part="timeline-indicator" style=${styleMap({"inline-size":`${progress}%`})}></span>
             </span>
             <span part="timeline-thumb" style=${styleMap({"inset-inline-start":`${progress}%`})}></span>
             ${this.renderThumbnail()}
           </div>
-          <span data-time>${formatTime(this.currentTime,this.effectiveLocale)}</span>
+          <span data-time>${formatMediaTime(this.currentTime,this.effectiveLocale)}</span>
           <span aria-hidden="true">/</span>
-          <span data-time>${formatTime(this.duration,this.effectiveLocale)}</span>
+          <span data-time>${formatMediaTime(this.duration,this.effectiveLocale)}</span>
           <span class="icon-button-stack">
             <button
               type="button"

package/dist/components/media/video-playlist/video-playlist.class.js

@@ -1,4 +1,4 @@
-import{__decorate}from"tslib";import{collectionSupport}from"../../../internal/collection-snapshot.js";import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{LyraElement}from"../../../internal/lyra-element.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{activeElementIn}from"../../../internal/active-element.js";import{MAX_NATIVE_PLAYBACK_RATE,MIN_NATIVE_PLAYBACK_RATE}from"../../../internal/media-controller.js";import{finiteRange}from"../../../internal/numbers.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{tag}from"../../../internal/prefix.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{styles}from"./video-playlist.styles.js";import{LYRA_DEFAULT_videoPlaylistLabel,LYRA_DEFAULT_videoPlaylistUntitled}from"../../../internal/default-strings.generated.js";function safeControls(value){return value==="none"||value==="standard"?value:"full"}function safeRepeat(value){return value==="one"||value==="all"?value:"none"}function sameVideos(left,right){return left.length===right.length&&left.every((video,index)=>video===right[index])}function textTracks(media){const result=[];if(!media)return result;for(let index=0;index<media.textTracks.length;index+=1){const track=media.textTracks[index];track&&result.push(track)}return result}function isSelectableTrack(track){return track.kind==="subtitles"||track.kind==="captions"||track.kind==="descriptions"}function validVolume(value){return typeof value=="number"&&Number.isFinite(value)&&value>=0&&value<=1}function validPlaybackRate(value){return typeof value=="number"&&Number.isFinite(value)&&value>=MIN_NATIVE_PLAYBACK_RATE&&value<=MAX_NATIVE_PLAYBACK_RATE}function formatDuration(seconds,locale){const total=Math.floor(finiteRange(seconds,0,0)),hours=Math.floor(total/3600),minutes=Math.floor(total%3600/60),remaining=total%60,regular=getNumberFormat(locale,{maximumFractionDigits:0,useGrouping:!1}),padded=getNumberFormat(locale,{maximumFractionDigits:0,minimumIntegerDigits:2,useGrouping:!1});return hours>0?`${regular.format(hours)}:${padded.format(minutes)}:${padded.format(remaining)}`:`${regular.format(minutes)}:${padded.format(remaining)}`}function sourceSnapshot(src,type,media){return{src,type,media}}function trackSnapshot(src,kind,srclang,label,isDefault){return{src,kind,srclang,label,default:isDefault}}class LyraVideoPlaylist extends LyraElement{constructor(){super(...arguments),this.controls="full",this.iconLibrary="system",this.withoutAutoAdvance=!1,this.repeat="none",this.items=[],this.playlistVideos=[],this.liveChildrenReady=!1,this.activeIndex=-1,this.navigationIndex=-1,this.listeners=new Map,this.lastKnownPlaying=new WeakMap,this.nativeVideos=new WeakMap,this.needsReload=new WeakSet,this.ownedVideoState=new WeakMap,this.preferences={},this.activationGeneration=0,this.reconcileGeneration=0,this.onSlotChange=()=>this.reconcileChildren(),this.onItemFocus=event=>{relayNativeEvent(this,event)},this.onItemBlur=event=>{relayNativeEvent(this,event)}}static{this.defaultStrings={...super.defaultStrings,videoPlaylistLabel:LYRA_DEFAULT_videoPlaylistLabel,videoPlaylistUntitled:LYRA_DEFAULT_videoPlaylistUntitled}}static{this.collectionSupport=collectionSupport}static{this.immutableEventDetails=Object.freeze(["lr-video-change"])}static{this.styles=[LyraElement.styles,styles]}connectedCallback(){super.connectedCallback(),this.observeChildren(),this.hasUpdated?this.scheduleAfterUpdate(()=>this.reconcileChildren(),"video-playlist-reconcile"):this.seedFirstRenderState(()=>{this.directVideos().length>0&&this.reconcileChildren()})}disconnectedCallback(){this.activationGeneration+=1,this.reconcileGeneration+=1,this.pendingPlay=void 0,this.mutationObserver?.disconnect(),this.mutationObserver=void 0;for(const video of this.playlistVideos)this.unbindVideo(video),video.hidden=!0,this.pauseAndUnload(video);super.disconnectedCallback()}willUpdate(changed){super.willUpdate(changed),changed.has("controls")&&(this.controls=safeControls(this.controls)),changed.has("repeat")&&(this.repeat=safeRepeat(this.repeat)),(changed.has("controls")||changed.has("iconLibrary"))&&this.scheduleAfterUpdate(()=>this.reconcileChildren(),"video-playlist-reconcile")}observeChildren(){this.mutationObserver?.disconnect(),this.mutationObserver=void 0;const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;MutationObserverCtor&&(this.mutationObserver=new MutationObserverCtor(()=>{this.scheduleAfterUpdate(()=>{this.reconcileChildren(),this.requestUpdate()},"video-playlist-reconcile")}),this.mutationObserver.observe(this,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["default","inert","kind","label","media","poster","src","srclang","title","type"]}))}directVideos(){const videoTag=tag("video");return[...this.children].filter(child=>child.localName===videoTag)}isEnabled(video){return!video.inert}nearestEnabledIndex(videos,preferred){if(!videos.length)return-1;const start=Math.min(Math.max(preferred,0),videos.length-1);for(let index=start;index<videos.length;index+=1)if(this.isEnabled(videos[index]))return index;for(let index=start-1;index>=0;index-=1)if(this.isEnabled(videos[index]))return index;return-1}reconcileChildren(){if(!this.isConnected)return;const previousVideos=this.playlistVideos,previousActive=this.activeVideo,previousIndex=this.activeIndex,previousNavigation=previousVideos[this.navigationIndex],navigationHadFocus=activeElementIn(this.shadowRoot)?.getAttribute("part")==="playlist-item",videos=this.directVideos();(videos.length>0||this.liveChildrenReady)&&(this.liveChildrenReady=!0);let active=previousActive&&videos.includes(previousActive)&&this.isEnabled(previousActive)?previousActive:void 0,nextIndex=active?videos.indexOf(active):this.nearestEnabledIndex(videos,previousIndex);!active&&nextIndex>=0&&(active=videos[nextIndex]),active||(nextIndex=-1);const activeChanged=active!==previousActive,outgoingWasRemoved=!!(previousActive&&!videos.includes(previousActive)),resumePlayback=activeChanged&&previousActive?outgoingWasRemoved?this.lastKnownPlaying.get(previousActive)??previousActive.getState().playing:previousActive.getState().playing:!1,outgoingPreferences=activeChanged&&previousActive?outgoingWasRemoved?this.capturePreferences(previousActive,this.nativeVideos.get(previousActive)):this.capturePreferences(previousActive):void 0;for(const video of previousVideos)videos.includes(video)||this.releaseVideo(video);for(const video of videos)this.claimVideo(video),this.bindVideo(video);activeChanged&&previousActive?(this.preferences=outgoingPreferences??{},outgoingWasRemoved||this.pauseAndUnload(previousActive),this.activationGeneration+=1):activeChanged&&(this.activationGeneration+=1),this.activeVideo=active,this.activeIndex=nextIndex,sameVideos(previousVideos,videos)||(this.playlistVideos=videos);for(const video of videos){video.controls!==this.controls&&(video.controls=this.controls),video.iconLibrary!==this.iconLibrary&&(video.iconLibrary=this.iconLibrary);const isActive=video===active;video.hidden=!isActive,isActive||this.pauseAndUnload(video)}active?(activeChanged||this.needsReload.has(active))&&this.activateVideo(active,resumePlayback,this.activationGeneration):this.pendingPlay=void 0;const keptNavigation=previousNavigation&&videos.includes(previousNavigation)&&this.isEnabled(previousNavigation)?videos.indexOf(previousNavigation):-1;this.navigationIndex=keptNavigation>=0?keptNavigation:nextIndex,navigationHadFocus&&keptNavigation<0&&this.navigationIndex>=0&&this.focusItem(this.navigationIndex),activeChanged&&previousActive&&this.emitChange(previousIndex,nextIndex,active??null),this.scheduleChildrenReady(videos)}scheduleChildrenReady(videos){const reconcileGeneration=++this.reconcileGeneration;Promise.all(videos.map(video=>video.updateComplete)).then(()=>{if(!this.isConnected||reconcileGeneration!==this.reconcileGeneration)return;for(const video of this.playlistVideos)this.rememberNativeVideo(video);for(const video of this.playlistVideos)video!==this.activeVideo&&this.pauseAndUnload(video);const active=this.activeVideo;if(!active||!this.needsReload.has(active))return;const shouldPlay=this.pendingPlay?.video===active&&this.pendingPlay.generation===this.activationGeneration;this.activateVideo(active,shouldPlay,this.activationGeneration)})}bindVideo(video){if(this.listeners.has(video))return;const listeners={ended:()=>{this.rememberNativeVideo(video),this.lastKnownPlaying.set(video,!1),this.handleCompletion(video)},error:()=>{this.rememberNativeVideo(video),this.lastKnownPlaying.set(video,!1)},loadedmetadata:()=>{this.rememberNativeVideo(video),this.handleLoadedMetadata(video)},pause:()=>{this.rememberNativeVideo(video),this.lastKnownPlaying.set(video,!1)},play:()=>{this.rememberNativeVideo(video),this.lastKnownPlaying.set(video,!0),video!==this.activeVideo&&this.pauseAndUnload(video)}};this.lastKnownPlaying.set(video,video.getState().playing),this.rememberNativeVideo(video),this.listeners.set(video,listeners),video.addEventListener("ended",listeners.ended),video.addEventListener("error",listeners.error),video.addEventListener("loadedmetadata",listeners.loadedmetadata),video.addEventListener("pause",listeners.pause),video.addEventListener("play",listeners.play)}unbindVideo(video){const listeners=this.listeners.get(video);listeners&&(video.removeEventListener("ended",listeners.ended),video.removeEventListener("error",listeners.error),video.removeEventListener("loadedmetadata",listeners.loadedmetadata),video.removeEventListener("pause",listeners.pause),video.removeEventListener("play",listeners.play),this.listeners.delete(video))}claimVideo(video){this.ownedVideoState.has(video)||this.ownedVideoState.set(video,{controls:video.controls,iconLibrary:video.iconLibrary,hidden:!!video.hidden})}releaseVideo(video){const authored=this.ownedVideoState.get(video);this.unbindVideo(video),this.pauseAndUnload(video),authored&&(video.controls=authored.controls,video.iconLibrary=authored.iconLibrary,video.hidden=authored.hidden,this.ownedVideoState.delete(video),video.isConnected&&video.load())}rememberNativeVideo(video){const native=video.getVideoElement();native&&this.nativeVideos.set(video,native)}pauseAndUnload(video){video.pause(),video.hidden=!0,this.needsReload.add(video);const native=video.getVideoElement();if(!native)return;const mediaChildren=[...native.children].filter(child=>child.localName==="source"||child.localName==="track");if(!(!native.hasAttribute("src")&&mediaChildren.length===0)){native.removeAttribute("src");for(const child of mediaChildren)child.remove();native.load()}}activateVideo(video,shouldPlay,generation){if(video.hidden=!1,!video.getVideoElement()){this.needsReload.add(video),shouldPlay&&(this.pendingPlay={video,generation});return}if(this.rememberNativeVideo(video),video.load(),this.needsReload.delete(video),this.applyPreferences(video,this.preferences),!shouldPlay){this.pendingPlay?.video===video&&(this.pendingPlay=void 0);return}this.pendingPlay=void 0,video.play().catch(()=>{generation!==this.activationGeneration||this.activeVideo})}capturePreferences(video,native=video.getVideoElement()){const state2=video.getState(),preferences={};validVolume(state2.volume)&&(preferences.volume=state2.volume),typeof state2.muted=="boolean"&&(preferences.muted=state2.muted),validPlaybackRate(state2.playbackRate)&&(preferences.playbackRate=state2.playbackRate);const tracks=textTracks(native),showingIndex=tracks.findIndex(track=>isSelectableTrack(track)&&track.mode!=="disabled");if(showingIndex<0)preferences.textTrack=null;else{const track=tracks[showingIndex];preferences.textTrack={index:showingIndex,kind:track.kind,label:track.label,language:track.language}}return preferences}applyPreferences(video,preferences){validVolume(preferences.volume)&&video.setVolume(preferences.volume),validPlaybackRate(preferences.playbackRate)&&video.setPlaybackRate(preferences.playbackRate),typeof preferences.muted=="boolean"&&video.getState().muted!==preferences.muted&&video.toggleMute(),this.applyTextTrackPreference(video.getVideoElement(),preferences.textTrack)}applyTextTrackPreference(native,preference){if(!native||preference===void 0)return;const tracks=textTracks(native);if(preference===null){for(const track of tracks)isSelectableTrack(track)&&(track.mode="disabled");return}const exact=tracks.find(track=>track.kind===preference.kind&&track.label===preference.label&&track.language===preference.language),indexed=tracks[preference.index],selected=exact??(indexed?.kind===preference.kind?indexed:void 0);if(selected)for(const track of tracks)isSelectableTrack(track)&&(track.mode=track===selected?"hidden":"disabled")}handleLoadedMetadata(video){video===this.activeVideo&&(this.applyPreferences(video,this.preferences),this.requestUpdate())}handleCompletion(video){if(video!==this.activeVideo||this.withoutAutoAdvance)return;if(this.repeat==="one"){video.seek(0);const generation=this.activationGeneration;video.play().catch(()=>{generation!==this.activationGeneration||this.activeVideo});return}const nextIndex=this.nearestEnabledIndex(this.playlistVideos,this.activeIndex+1);if(nextIndex>this.activeIndex){this.switchTo(nextIndex,!0);return}if(this.repeat==="all"){const first=this.nearestEnabledIndex(this.playlistVideos,0);if(first>=0&&first!==this.activeIndex)this.switchTo(first,!0);else if(first===this.activeIndex){video.seek(0);const generation=this.activationGeneration;video.play().catch(()=>{generation!==this.activationGeneration||this.activeVideo})}}}snapshotVideo(video){const sources=[],directSrc=video.src.trim();directSrc&&sources.push(sourceSnapshot(directSrc,"",""));const tracks=[];for(const child of video.children)if(child.localName==="source"){const src=child.getAttribute("src")?.trim()??"";src&&sources.push(sourceSnapshot(src,child.getAttribute("type")??"",child.getAttribute("media")??""))}else if(child.localName==="track"){const src=child.getAttribute("src")?.trim()??"";src&&tracks.push(trackSnapshot(src,child.getAttribute("kind")??"",child.getAttribute("srclang")??"",child.getAttribute("label")??"",child.hasAttribute("default")))}return{title:video.title,poster:video.poster,sources,tracks}}emitChange(previousIndex,currentIndex,video){this.emit("lr-video-change",{previousIndex,currentIndex,video:video?this.snapshotVideo(video):null})}switchTo(index,forcePlay=!1){const incoming=this.playlistVideos[index];if(!incoming||!this.isEnabled(incoming))return;const previousIndex=this.activeIndex,outgoing=this.activeVideo;if(incoming===outgoing){if(this.navigationIndex=index,this.requestUpdate(),forcePlay){const generation=this.activationGeneration;incoming.play().catch(()=>{generation!==this.activationGeneration||this.activeVideo})}this.emitChange(previousIndex,index,incoming);return}const wasPlaying=forcePlay||!!outgoing?.getState().playing;outgoing&&(this.preferences=this.capturePreferences(outgoing),this.pauseAndUnload(outgoing)),this.activationGeneration+=1,this.activeVideo=incoming,this.activeIndex=index,this.navigationIndex=index;for(const video of this.playlistVideos){const isActive=video===incoming;video.hidden=!isActive,!isActive&&video!==outgoing&&this.pauseAndUnload(video)}this.activateVideo(incoming,wasPlaying,this.activationGeneration),this.requestUpdate(),this.emitChange(previousIndex,index,incoming)}goTo(index){!Number.isFinite(index)||!Number.isInteger(index)||index<0||index>=this.playlistVideos.length||this.switchTo(index)}next(){const index=this.nearestEnabledIndex(this.playlistVideos,this.activeIndex+1);index>this.activeIndex&&this.switchTo(index)}previous(){for(let index=this.activeIndex-1;index>=0;index-=1)if(this.isEnabled(this.playlistVideos[index])){this.switchTo(index);return}}onItemClick(event){const button=event.currentTarget,index=Number(button.dataset.index);Number.isInteger(index)&&(this.navigationIndex=index,this.goTo(index))}enabledIndices(){const result=[];for(let index=0;index<this.playlistVideos.length;index+=1)this.isEnabled(this.playlistVideos[index])&&result.push(index);return result}moveNavigation(from,direction){const enabled=this.enabledIndices(),position=enabled.indexOf(from);if(position<0)return;const next=enabled[position+direction];next!==void 0&&this.focusItem(next)}get navigationItem(){const rows=[...this.renderRoot.querySelectorAll('[part~="playlist-item"]')];return rows.find(row=>!row.disabled&&row.getAttribute("aria-current")==="true")??rows.find(row=>!row.disabled)??null}focus(options){this.navigationItem?.focus(options)}blur(){this.navigationItem?.blur()}click(){this.navigationItem?.click()}focusItem(index){this.isEnabled(this.playlistVideos[index])&&(this.navigationIndex=index,this.requestUpdate(),this.updateComplete.then(()=>{this.navigationIndex===index&&this.shadowRoot?.querySelector(`[data-index="${index}"]`)?.focus()}))}onItemKeyDown(event){const button=event.currentTarget,index=Number(button.dataset.index);if(!Number.isInteger(index)||button.disabled)return;const forward=this.effectiveDirection==="rtl"?"ArrowLeft":"ArrowRight",backward=this.effectiveDirection==="rtl"?"ArrowRight":"ArrowLeft";if(event.key==="Enter"||event.key===" ")event.preventDefault(),this.navigationIndex=index,this.goTo(index);else if(event.key==="ArrowDown"||event.key===forward)event.preventDefault(),this.moveNavigation(index,1);else if(event.key==="ArrowUp"||event.key===backward)event.preventDefault(),this.moveNavigation(index,-1);else if(event.key==="Home"){event.preventDefault();const first=this.enabledIndices()[0];first!==void 0&&this.focusItem(first)}else if(event.key==="End"){event.preventDefault();const enabled=this.enabledIndices(),last=enabled[enabled.length-1];last!==void 0&&this.focusItem(last)}}itemTitle(value,index){const title=typeof value=="string"?value.trim():"";if(title)return title;const position=getNumberFormat(this.effectiveLocale).format(index+1);return this.localize("videoPlaylistUntitled",void 0,{position})}renderItem(item,index,current,disabled){const title=this.itemTitle(item.title,index),poster=safeMediaSrc(typeof item.poster=="string"?item.poster:""),duration=finiteRange(typeof item.duration=="number"?item.duration:0,0,0),durationId=`playlist-duration-${index}`;return html`
+import{__decorate}from"tslib";import{collectionSupport}from"../../../internal/collection-snapshot.js";import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{formatMediaTime}from"../media-time.js";import{LyraElement}from"../../../internal/lyra-element.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{activeElementIn}from"../../../internal/active-element.js";import{MAX_NATIVE_PLAYBACK_RATE,MIN_NATIVE_PLAYBACK_RATE}from"../../../internal/media-controller.js";import{finiteRange}from"../../../internal/numbers.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{tag}from"../../../internal/prefix.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{styles}from"./video-playlist.styles.js";import{LYRA_DEFAULT_videoPlaylistLabel,LYRA_DEFAULT_videoPlaylistUntitled}from"../../../internal/default-strings.generated.js";function safeControls(value){return value==="none"||value==="standard"?value:"full"}function safeRepeat(value){return value==="one"||value==="all"?value:"none"}function sameVideos(left,right){return left.length===right.length&&left.every((video,index)=>video===right[index])}function textTracks(media){const result=[];if(!media)return result;for(let index=0;index<media.textTracks.length;index+=1){const track=media.textTracks[index];track&&result.push(track)}return result}function isSelectableTrack(track){return track.kind==="subtitles"||track.kind==="captions"||track.kind==="descriptions"}function validVolume(value){return typeof value=="number"&&Number.isFinite(value)&&value>=0&&value<=1}function validPlaybackRate(value){return typeof value=="number"&&Number.isFinite(value)&&value>=MIN_NATIVE_PLAYBACK_RATE&&value<=MAX_NATIVE_PLAYBACK_RATE}function sourceSnapshot(src,type,media){return{src,type,media}}function trackSnapshot(src,kind,srclang,label,isDefault){return{src,kind,srclang,label,default:isDefault}}class LyraVideoPlaylist extends LyraElement{constructor(){super(...arguments),this.controls="full",this.iconLibrary="system",this.withoutAutoAdvance=!1,this.repeat="none",this.items=[],this.playlistVideos=[],this.liveChildrenReady=!1,this.activeIndex=-1,this.navigationIndex=-1,this.listeners=new Map,this.lastKnownPlaying=new WeakMap,this.nativeVideos=new WeakMap,this.needsReload=new WeakSet,this.ownedVideoState=new WeakMap,this.preferences={},this.activationGeneration=0,this.reconcileGeneration=0,this.onSlotChange=()=>this.reconcileChildren(),this.onItemFocus=event=>{relayNativeEvent(this,event)},this.onItemBlur=event=>{relayNativeEvent(this,event)}}static{this.defaultStrings={...super.defaultStrings,videoPlaylistLabel:LYRA_DEFAULT_videoPlaylistLabel,videoPlaylistUntitled:LYRA_DEFAULT_videoPlaylistUntitled}}static{this.collectionSupport=collectionSupport}static{this.immutableEventDetails=Object.freeze(["lr-video-change"])}static{this.styles=[LyraElement.styles,styles]}connectedCallback(){super.connectedCallback(),this.observeChildren(),this.hasUpdated?this.scheduleAfterUpdate(()=>this.reconcileChildren(),"video-playlist-reconcile"):this.seedFirstRenderState(()=>{this.directVideos().length>0&&this.reconcileChildren()})}disconnectedCallback(){this.activationGeneration+=1,this.reconcileGeneration+=1,this.pendingPlay=void 0,this.mutationObserver?.disconnect(),this.mutationObserver=void 0;for(const video of this.playlistVideos)this.unbindVideo(video),video.hidden=!0,this.pauseAndUnload(video);super.disconnectedCallback()}willUpdate(changed){super.willUpdate(changed),changed.has("controls")&&(this.controls=safeControls(this.controls)),changed.has("repeat")&&(this.repeat=safeRepeat(this.repeat)),(changed.has("controls")||changed.has("iconLibrary"))&&this.scheduleAfterUpdate(()=>this.reconcileChildren(),"video-playlist-reconcile")}observeChildren(){this.mutationObserver?.disconnect(),this.mutationObserver=void 0;const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;MutationObserverCtor&&(this.mutationObserver=new MutationObserverCtor(()=>{this.scheduleAfterUpdate(()=>{this.reconcileChildren(),this.requestUpdate()},"video-playlist-reconcile")}),this.mutationObserver.observe(this,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["default","inert","kind","label","media","poster","src","srclang","title","type"]}))}directVideos(){const videoTag=tag("video");return[...this.children].filter(child=>child.localName===videoTag)}isEnabled(video){return!video.inert}nearestEnabledIndex(videos,preferred){if(!videos.length)return-1;const start=Math.min(Math.max(preferred,0),videos.length-1);for(let index=start;index<videos.length;index+=1)if(this.isEnabled(videos[index]))return index;for(let index=start-1;index>=0;index-=1)if(this.isEnabled(videos[index]))return index;return-1}reconcileChildren(){if(!this.isConnected)return;const previousVideos=this.playlistVideos,previousActive=this.activeVideo,previousIndex=this.activeIndex,previousNavigation=previousVideos[this.navigationIndex],navigationHadFocus=activeElementIn(this.shadowRoot)?.getAttribute("part")==="playlist-item",videos=this.directVideos();(videos.length>0||this.liveChildrenReady)&&(this.liveChildrenReady=!0);let active=previousActive&&videos.includes(previousActive)&&this.isEnabled(previousActive)?previousActive:void 0,nextIndex=active?videos.indexOf(active):this.nearestEnabledIndex(videos,previousIndex);!active&&nextIndex>=0&&(active=videos[nextIndex]),active||(nextIndex=-1);const activeChanged=active!==previousActive,outgoingWasRemoved=!!(previousActive&&!videos.includes(previousActive)),resumePlayback=activeChanged&&previousActive?outgoingWasRemoved?this.lastKnownPlaying.get(previousActive)??previousActive.getState().playing:previousActive.getState().playing:!1,outgoingPreferences=activeChanged&&previousActive?outgoingWasRemoved?this.capturePreferences(previousActive,this.nativeVideos.get(previousActive)):this.capturePreferences(previousActive):void 0;for(const video of previousVideos)videos.includes(video)||this.releaseVideo(video);for(const video of videos)this.claimVideo(video),this.bindVideo(video);activeChanged&&previousActive?(this.preferences=outgoingPreferences??{},outgoingWasRemoved||this.pauseAndUnload(previousActive),this.activationGeneration+=1):activeChanged&&(this.activationGeneration+=1),this.activeVideo=active,this.activeIndex=nextIndex,sameVideos(previousVideos,videos)||(this.playlistVideos=videos);for(const video of videos){video.controls!==this.controls&&(video.controls=this.controls),video.iconLibrary!==this.iconLibrary&&(video.iconLibrary=this.iconLibrary);const isActive=video===active;video.hidden=!isActive,isActive||this.pauseAndUnload(video)}active?(activeChanged||this.needsReload.has(active))&&this.activateVideo(active,resumePlayback,this.activationGeneration):this.pendingPlay=void 0;const keptNavigation=previousNavigation&&videos.includes(previousNavigation)&&this.isEnabled(previousNavigation)?videos.indexOf(previousNavigation):-1;this.navigationIndex=keptNavigation>=0?keptNavigation:nextIndex,navigationHadFocus&&keptNavigation<0&&this.navigationIndex>=0&&this.focusItem(this.navigationIndex),activeChanged&&previousActive&&this.emitChange(previousIndex,nextIndex,active??null),this.scheduleChildrenReady(videos)}scheduleChildrenReady(videos){const reconcileGeneration=++this.reconcileGeneration;Promise.all(videos.map(video=>video.updateComplete)).then(()=>{if(!this.isConnected||reconcileGeneration!==this.reconcileGeneration)return;for(const video of this.playlistVideos)this.rememberNativeVideo(video);for(const video of this.playlistVideos)video!==this.activeVideo&&this.pauseAndUnload(video);const active=this.activeVideo;if(!active||!this.needsReload.has(active))return;const shouldPlay=this.pendingPlay?.video===active&&this.pendingPlay.generation===this.activationGeneration;this.activateVideo(active,shouldPlay,this.activationGeneration)})}bindVideo(video){if(this.listeners.has(video))return;const listeners={ended:()=>{this.rememberNativeVideo(video),this.lastKnownPlaying.set(video,!1),this.handleCompletion(video)},error:()=>{this.rememberNativeVideo(video),this.lastKnownPlaying.set(video,!1)},loadedmetadata:()=>{this.rememberNativeVideo(video),this.handleLoadedMetadata(video)},pause:()=>{this.rememberNativeVideo(video),this.lastKnownPlaying.set(video,!1)},play:()=>{this.rememberNativeVideo(video),this.lastKnownPlaying.set(video,!0),video!==this.activeVideo&&this.pauseAndUnload(video)}};this.lastKnownPlaying.set(video,video.getState().playing),this.rememberNativeVideo(video),this.listeners.set(video,listeners),video.addEventListener("ended",listeners.ended),video.addEventListener("error",listeners.error),video.addEventListener("loadedmetadata",listeners.loadedmetadata),video.addEventListener("pause",listeners.pause),video.addEventListener("play",listeners.play)}unbindVideo(video){const listeners=this.listeners.get(video);listeners&&(video.removeEventListener("ended",listeners.ended),video.removeEventListener("error",listeners.error),video.removeEventListener("loadedmetadata",listeners.loadedmetadata),video.removeEventListener("pause",listeners.pause),video.removeEventListener("play",listeners.play),this.listeners.delete(video))}claimVideo(video){this.ownedVideoState.has(video)||this.ownedVideoState.set(video,{controls:video.controls,iconLibrary:video.iconLibrary,hidden:!!video.hidden})}releaseVideo(video){const authored=this.ownedVideoState.get(video);this.unbindVideo(video),this.pauseAndUnload(video),authored&&(video.controls=authored.controls,video.iconLibrary=authored.iconLibrary,video.hidden=authored.hidden,this.ownedVideoState.delete(video),video.isConnected&&video.load())}rememberNativeVideo(video){const native=video.getVideoElement();native&&this.nativeVideos.set(video,native)}pauseAndUnload(video){video.pause(),video.hidden=!0,this.needsReload.add(video);const native=video.getVideoElement();if(!native)return;const mediaChildren=[...native.children].filter(child=>child.localName==="source"||child.localName==="track");if(!(!native.hasAttribute("src")&&mediaChildren.length===0)){native.removeAttribute("src");for(const child of mediaChildren)child.remove();native.load()}}activateVideo(video,shouldPlay,generation){if(video.hidden=!1,!video.getVideoElement()){this.needsReload.add(video),shouldPlay&&(this.pendingPlay={video,generation});return}if(this.rememberNativeVideo(video),video.load(),this.needsReload.delete(video),this.applyPreferences(video,this.preferences),!shouldPlay){this.pendingPlay?.video===video&&(this.pendingPlay=void 0);return}this.pendingPlay=void 0,video.play().catch(()=>{generation!==this.activationGeneration||this.activeVideo})}capturePreferences(video,native=video.getVideoElement()){const state2=video.getState(),preferences={};validVolume(state2.volume)&&(preferences.volume=state2.volume),typeof state2.muted=="boolean"&&(preferences.muted=state2.muted),validPlaybackRate(state2.playbackRate)&&(preferences.playbackRate=state2.playbackRate);const tracks=textTracks(native),showingIndex=tracks.findIndex(track=>isSelectableTrack(track)&&track.mode!=="disabled");if(showingIndex<0)preferences.textTrack=null;else{const track=tracks[showingIndex];preferences.textTrack={index:showingIndex,kind:track.kind,label:track.label,language:track.language}}return preferences}applyPreferences(video,preferences){validVolume(preferences.volume)&&video.setVolume(preferences.volume),validPlaybackRate(preferences.playbackRate)&&video.setPlaybackRate(preferences.playbackRate),typeof preferences.muted=="boolean"&&video.getState().muted!==preferences.muted&&video.toggleMute(),this.applyTextTrackPreference(video.getVideoElement(),preferences.textTrack)}applyTextTrackPreference(native,preference){if(!native||preference===void 0)return;const tracks=textTracks(native);if(preference===null){for(const track of tracks)isSelectableTrack(track)&&(track.mode="disabled");return}const exact=tracks.find(track=>track.kind===preference.kind&&track.label===preference.label&&track.language===preference.language),indexed=tracks[preference.index],selected=exact??(indexed?.kind===preference.kind?indexed:void 0);if(selected)for(const track of tracks)isSelectableTrack(track)&&(track.mode=track===selected?"hidden":"disabled")}handleLoadedMetadata(video){video===this.activeVideo&&(this.applyPreferences(video,this.preferences),this.requestUpdate())}handleCompletion(video){if(video!==this.activeVideo||this.withoutAutoAdvance)return;if(this.repeat==="one"){video.seek(0);const generation=this.activationGeneration;video.play().catch(()=>{generation!==this.activationGeneration||this.activeVideo});return}const nextIndex=this.nearestEnabledIndex(this.playlistVideos,this.activeIndex+1);if(nextIndex>this.activeIndex){this.switchTo(nextIndex,!0);return}if(this.repeat==="all"){const first=this.nearestEnabledIndex(this.playlistVideos,0);if(first>=0&&first!==this.activeIndex)this.switchTo(first,!0);else if(first===this.activeIndex){video.seek(0);const generation=this.activationGeneration;video.play().catch(()=>{generation!==this.activationGeneration||this.activeVideo})}}}snapshotVideo(video){const sources=[],directSrc=video.src.trim();directSrc&&sources.push(sourceSnapshot(directSrc,"",""));const tracks=[];for(const child of video.children)if(child.localName==="source"){const src=child.getAttribute("src")?.trim()??"";src&&sources.push(sourceSnapshot(src,child.getAttribute("type")??"",child.getAttribute("media")??""))}else if(child.localName==="track"){const src=child.getAttribute("src")?.trim()??"";src&&tracks.push(trackSnapshot(src,child.getAttribute("kind")??"",child.getAttribute("srclang")??"",child.getAttribute("label")??"",child.hasAttribute("default")))}return{title:video.title,poster:video.poster,sources,tracks}}emitChange(previousIndex,currentIndex,video){this.emit("lr-video-change",{previousIndex,currentIndex,video:video?this.snapshotVideo(video):null})}switchTo(index,forcePlay=!1){const incoming=this.playlistVideos[index];if(!incoming||!this.isEnabled(incoming))return;const previousIndex=this.activeIndex,outgoing=this.activeVideo;if(incoming===outgoing){if(this.navigationIndex=index,this.requestUpdate(),forcePlay){const generation=this.activationGeneration;incoming.play().catch(()=>{generation!==this.activationGeneration||this.activeVideo})}this.emitChange(previousIndex,index,incoming);return}const wasPlaying=forcePlay||!!outgoing?.getState().playing;outgoing&&(this.preferences=this.capturePreferences(outgoing),this.pauseAndUnload(outgoing)),this.activationGeneration+=1,this.activeVideo=incoming,this.activeIndex=index,this.navigationIndex=index;for(const video of this.playlistVideos){const isActive=video===incoming;video.hidden=!isActive,!isActive&&video!==outgoing&&this.pauseAndUnload(video)}this.activateVideo(incoming,wasPlaying,this.activationGeneration),this.requestUpdate(),this.emitChange(previousIndex,index,incoming)}goTo(index){!Number.isFinite(index)||!Number.isInteger(index)||index<0||index>=this.playlistVideos.length||this.switchTo(index)}next(){const index=this.nearestEnabledIndex(this.playlistVideos,this.activeIndex+1);index>this.activeIndex&&this.switchTo(index)}previous(){for(let index=this.activeIndex-1;index>=0;index-=1)if(this.isEnabled(this.playlistVideos[index])){this.switchTo(index);return}}onItemClick(event){const button=event.currentTarget,index=Number(button.dataset.index);Number.isInteger(index)&&(this.navigationIndex=index,this.goTo(index))}enabledIndices(){const result=[];for(let index=0;index<this.playlistVideos.length;index+=1)this.isEnabled(this.playlistVideos[index])&&result.push(index);return result}moveNavigation(from,direction){const enabled=this.enabledIndices(),position=enabled.indexOf(from);if(position<0)return;const next=enabled[position+direction];next!==void 0&&this.focusItem(next)}get navigationItem(){const rows=[...this.renderRoot.querySelectorAll('[part~="playlist-item"]')];return rows.find(row=>!row.disabled&&row.getAttribute("aria-current")==="true")??rows.find(row=>!row.disabled)??null}focus(options){this.navigationItem?.focus(options)}blur(){this.navigationItem?.blur()}click(){this.navigationItem?.click()}focusItem(index){this.isEnabled(this.playlistVideos[index])&&(this.navigationIndex=index,this.requestUpdate(),this.updateComplete.then(()=>{this.navigationIndex===index&&this.shadowRoot?.querySelector(`[data-index="${index}"]`)?.focus()}))}onItemKeyDown(event){const button=event.currentTarget,index=Number(button.dataset.index);if(!Number.isInteger(index)||button.disabled)return;const forward=this.effectiveDirection==="rtl"?"ArrowLeft":"ArrowRight",backward=this.effectiveDirection==="rtl"?"ArrowRight":"ArrowLeft";if(event.key==="Enter"||event.key===" ")event.preventDefault(),this.navigationIndex=index,this.goTo(index);else if(event.key==="ArrowDown"||event.key===forward)event.preventDefault(),this.moveNavigation(index,1);else if(event.key==="ArrowUp"||event.key===backward)event.preventDefault(),this.moveNavigation(index,-1);else if(event.key==="Home"){event.preventDefault();const first=this.enabledIndices()[0];first!==void 0&&this.focusItem(first)}else if(event.key==="End"){event.preventDefault();const enabled=this.enabledIndices(),last=enabled[enabled.length-1];last!==void 0&&this.focusItem(last)}}itemTitle(value,index){const title=typeof value=="string"?value.trim():"";if(title)return title;const position=getNumberFormat(this.effectiveLocale).format(index+1);return this.localize("videoPlaylistUntitled",void 0,{position})}renderItem(item,index,current,disabled){const title=this.itemTitle(item.title,index),poster=safeMediaSrc(typeof item.poster=="string"?item.poster:""),duration=finiteRange(typeof item.duration=="number"?item.duration:0,0,0),durationId=`playlist-duration-${index}`;return html`
       <li>
         <button
           type="button"
@@ -24,7 +24,7 @@ import{__decorate}from"tslib";import{collectionSupport}from"../../../internal/co
           <span data-item-copy>
             <span part="playlist-title">${title}</span>
             <span part="playlist-duration" id=${durationId}>
-              ${duration>0?formatDuration(duration,this.effectiveLocale):nothing}
+              ${duration>0?formatMediaTime(duration,this.effectiveLocale):nothing}
             </span>
           </span>
         </button>

package/dist/components/overlays/callout/callout.class.d.ts

@@ -110,12 +110,9 @@ private _headingLevel;get headingLevel():LyraHeadingLevel;set headingLevel(next:
 *  any host `role="status"`/`role="alert"` hand-added before this property existed once it is
 *  set -- otherwise the initial text is announced twice, through the native role and again
 *  through the shared sink. */
-announce:boolean;open:boolean;private legacyAccessibleLabel;
-/** Compatibility fallback below the host aria-label, including an explicitly empty host value.
-* @deprecated Use the host aria-label attribute or the native ariaLabel property. */
-get accessibleLabel():string;set accessibleLabel(value:string);
+announce:boolean;open:boolean;
 /** The host `aria-label`: names the grouped panel and prefixes announced updates, winning by
-*  presence over `accessibleLabel`. */
+*  presence. */
 private hostAriaLabel;private readonly slotPresence;private liveActive;private initialContentAnnounced;private connectionGeneration;private politeSink?;private assertiveSink?;private contentObserver?;private lastAnnouncementText;private announcementShadowRoots;private readonly announcementUpgrades;connectedCallback():void;disconnectedCallback():void;protected updated(changed:PropertyValues):void;protected willUpdate(changed:PropertyValues):void;private isAnnouncementMutation;private isAnnouncementSlotNode;private announcementObservationOptions;private announcementForwardingSlots;private observeAnnouncementContent;private onForwardedSlotChange;private normalizedText;private resolvedAccessibleLabel;private announcementText;private announceCurrentContent;
 /** Resolve the same contextual tone that the inherited CSS vocabulary paints. An explicit local
 * attribute wins; otherwise the nearest composed semantic ancestor wins, with brand as the

package/dist/components/overlays/callout/callout.class.js

@@ -1,4 +1,4 @@
-import{__decorate}from"tslib";import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{composedParentElement}from"../../../internal/active-element.js";import{isAccessibilityVisible}from"../../../internal/accessibility-visibility.js";import{AnnouncementUpgradeObserver}from"../../../internal/announcement-text.js";import{applyComposedFocusRepair,captureComposedFocusRepair,collectComposedFocusTargets}from"../../../internal/focus-navigation.js";import{LyraElement}from"../../../internal/lyra-element.js";import{resolveHeadingLevel}from"../../../internal/heading-level.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{contextualSizes,contextualVariants}from"../../../internal/contextual-vocabulary.styles.js";import{styles}from"./callout.styles.js";import{warnDeprecatedUsage}from"../../../internal/dev-mode-attribute-warning.js";import{literalSetConverter,presenceTrueDefaultBooleanConverter as trueDefaultBooleanConverter}from"../../../internal/converters.js";import{LYRA_DEFAULT_calloutAnnouncementWithContext,LYRA_DEFAULT_close}from"../../../internal/default-strings.generated.js";const CALLOUT_VARIANT=literalSetConverter(["brand","neutral","success","warning","danger"],"brand"),CALLOUT_VARIANTS=new Set(["brand","neutral","success","warning","danger"]),CALLOUT_SIZE=literalSetConverter(["2xs","xs","s","m","l","xl","small","medium","large"],"m"),CALLOUT_HEADING_LEVEL=literalSetConverter(["1","2","3","4","5","6","none"],"3"),CALLOUT_APPEARANCES=new Set(["accent","filled","outlined","filled-outlined","plain"]),normalizeCalloutAppearance=value=>typeof value=="string"&&CALLOUT_APPEARANCES.has(value)?value:void 0,calloutAppearanceConverter={fromAttribute:normalizeCalloutAppearance,toAttribute:value=>normalizeCalloutAppearance(value)??null};function isComposedWithin(owner,candidate){let current=candidate;for(;current;){if(current===owner)return!0;current=composedParentElement(current)}return!1}function nearestExternalFocusTarget(owner){const documentElement=owner.ownerDocument?.documentElement;if(!documentElement)return null;const targets=collectComposedFocusTargets(documentElement,{mode:"programmatic"}).elements,owned=targets.map((target,index)=>isComposedWithin(owner,target)?index:-1).filter(index=>index>=0);if(owned.length===0)return null;const first=owned[0],last=owned[owned.length-1];return targets.slice(last+1).find(target=>!isComposedWithin(owner,target))??targets.slice(0,first).reverse().find(target=>!isComposedWithin(owner,target))??null}class LyraCallout extends LyraElement{constructor(){super(...arguments),this._variant="brand",this._size="m",this.heading="",this._headingLevel="3",this.closable=!1,this.inline=!1,this.announce=!1,this.open=!0,this.legacyAccessibleLabel="",this.hostAriaLabel=null,this.slotPresence=new SlotPresenceController(this),this.liveActive=!1,this.initialContentAnnounced=!1,this.connectionGeneration=0,this.lastAnnouncementText="",this.announcementShadowRoots=new Set,this.announcementUpgrades=new AnnouncementUpgradeObserver(()=>{this.announceCurrentContent(),this.observeAnnouncementContent()}),this.onForwardedSlotChange=event=>{const slot=event.target;this.announcementForwardingSlots().includes(slot)&&(this.announceCurrentContent(),this.observeAnnouncementContent())},this.close=()=>{const repair=captureComposedFocusRepair(this,nearestExternalFocusTarget(this));this.emit("lr-close-request",{reason:"close-button"},{cancelable:!0}).defaultPrevented||(repair&&applyComposedFocusRepair(repair),this.open=!1,this.emit("lr-close",{reason:"close-button"}))}}static{this.defaultStrings={...super.defaultStrings,calloutAnnouncementWithContext:LYRA_DEFAULT_calloutAnnouncementWithContext,close:LYRA_DEFAULT_close}}static{this.styles=[LyraElement.styles,contextualVariants,contextualSizes,styles]}attributeChangedCallback(name,oldValue,newValue){super.attributeChangedCallback(name,oldValue,newValue)}get variant(){return this._variant}set variant(next){const normalized=CALLOUT_VARIANT.normalizeReflected(this,"variant",next),old=this._variant;old!==normalized&&(this._variant=normalized,this.requestUpdate("variant",old))}get appearance(){return this._appearance}set appearance(next){const normalized=normalizeCalloutAppearance(next);this.hasAttribute("appearance")&&this.getAttribute("appearance")!==normalized&&(normalized===void 0?this.removeAttribute("appearance"):this.setAttribute("appearance",normalized));const old=this._appearance;old!==normalized&&(this._appearance=normalized,this.requestUpdate("appearance",old))}get size(){return this._size}set size(next){const normalized=CALLOUT_SIZE.normalizeReflected(this,"size",next),old=this._size;old!==normalized&&(this._size=normalized,this.requestUpdate("size",old))}get headingLevel(){return this._headingLevel}set headingLevel(next){const normalized=CALLOUT_HEADING_LEVEL.normalizeReflected(this,"heading-level",next),old=this._headingLevel;old!==normalized&&(this._headingLevel=normalized,this.requestUpdate("headingLevel",old))}get accessibleLabel(){return this.legacyAccessibleLabel}set accessibleLabel(value){warnDeprecatedUsage(this,"property","accessibleLabel","aria-label"),this.legacyAccessibleLabel=value}connectedCallback(){super.connectedCallback(),this.addEventListener("slotchange",this.onForwardedSlotChange),this.politeSink??=acquireAnnouncementSink("polite",{document:this.ownerDocument,source:this}),this.assertiveSink??=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this});const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;MutationObserverCtor&&(this.contentObserver=new MutationObserverCtor(records=>{records.some(record=>!this.contains(record.target)||this.isAnnouncementMutation(record))&&(this.announceCurrentContent(),this.observeAnnouncementContent())}),this.observeAnnouncementContent());const generation=++this.connectionGeneration;this.updateComplete.then(()=>{const view=this.ownerDocument?.defaultView;return typeof view?.requestAnimationFrame=="function"?new Promise(resolve=>view.requestAnimationFrame(()=>resolve())):Promise.resolve()}).then(()=>this.updateComplete).then(()=>{this.isConnected&&generation===this.connectionGeneration&&(this.lastAnnouncementText=this.announcementText(),this.observeAnnouncementContent(),this.liveActive=!0,this.announce&&!this.initialContentAnnounced&&(this.initialContentAnnounced=!0,this.announceCurrentContent(!0)))})}disconnectedCallback(){this.connectionGeneration+=1,this.liveActive=!1,this.lastAnnouncementText="",this.contentObserver?.disconnect(),this.contentObserver=void 0,this.announcementShadowRoots.clear(),this.announcementUpgrades.disconnect(),this.removeEventListener("slotchange",this.onForwardedSlotChange),this.politeSink?.release(),this.politeSink=void 0,this.assertiveSink?.release(),this.assertiveSink=void 0,super.disconnectedCallback()}updated(changed){super.updated(changed),!(!this.liveActive||!this.open)&&(changed.has("open")||changed.has("heading")||changed.has("accessibleLabel"))&&(this.announceCurrentContent(changed.has("open")),this.observeAnnouncementContent())}willUpdate(changed){if(super.willUpdate(changed),changed.has("open")&&!this.open){const repair=captureComposedFocusRepair(this,nearestExternalFocusTarget(this));repair&&applyComposedFocusRepair(repair)}}isAnnouncementMutation(record){if(record.target===this)return record.type==="childList"||record.type==="attributes"&&["aria-hidden","aria-label","class","hidden","inert","style"].includes(record.attributeName??"");let top=record.target;for(;top.parentNode&&top.parentNode!==this;)top=top.parentNode;return top.parentNode!==this?!1:record.type==="attributes"&&record.attributeName==="slot"&&record.target===top?!0:this.isAnnouncementSlotNode(top)}isAnnouncementSlotNode(node){if(node.nodeType!==1)return!0;const slotName=node.getAttribute("slot");return slotName===null||slotName===""||slotName==="heading"}announcementObservationOptions(){return{attributes:!0,attributeFilter:["alt","aria-hidden","aria-label","class","hidden","inert","open","slot","style"],characterData:!0,childList:!0,subtree:!0}}announcementForwardingSlots(){return Array.from(this.querySelectorAll("slot")).filter(slot=>{let top=slot;for(;top.parentNode&&top.parentNode!==this;)top=top.parentNode;return top.parentNode===this&&this.isAnnouncementSlotNode(top)})}observeAnnouncementContent(){const observer=this.contentObserver;if(!observer)return;observer.disconnect();const options=this.announcementObservationOptions();observer.observe(this,options);for(const slot of this.announcementForwardingSlots())if(slot.assignedNodes().length!==0)for(const assigned of slot.assignedNodes({flatten:!0}))observer.observe(assigned,options);for(const root of this.announcementShadowRoots)observer.observe(root,options)}normalizedText(value){return(value??"").replace(/\s+/g," ").trim()}resolvedAccessibleLabel(){const hostLabel=this.hostAriaLabel;return this.normalizedText(hostLabel!==null?hostLabel:this.accessibleLabel)}announcementText(){const roots=new Set;if(this.announcementShadowRoots=roots,!isAccessibilityVisible(this))return"";const hostLabel=this.hostAriaLabel,context=this.normalizedText(hostLabel!==null?hostLabel:this.accessibleLabel),heading=[this.heading,...Array.from(this.childNodes).filter(node=>node.nodeType===1&&node.getAttribute("slot")==="heading").map(node=>this.announcementUpgrades.collect(node,roots))],message=Array.from(this.childNodes).filter(node=>{if(node.nodeType!==1)return!0;const slotName=node.getAttribute("slot");return slotName===null||slotName===""}).map(node=>this.announcementUpgrades.collect(node,roots)),content=this.normalizedText([...heading,...message].join(" "));return!context||context===content?content:content?this.localize("calloutAnnouncementWithContext",void 0,{context,content}):context}announceCurrentContent(force=!1){if(!this.liveActive||!this.isConnected||!this.open)return;const text=this.announcementText();!force&&text===this.lastAnnouncementText||(this.lastAnnouncementText=text,(this.effectiveContextualVariant==="danger"?this.assertiveSink:this.politeSink)?.announce(text))}get effectiveContextualVariant(){if(this.hasAttribute("variant"))return this.variant;let ancestor=composedParentElement(this);for(;ancestor;){const candidate=ancestor.getAttribute("variant");if(candidate&&CALLOUT_VARIANTS.has(candidate))return candidate;ancestor=composedParentElement(ancestor)}return"brand"}render(){if(!this.open)return html``;const label=this.resolvedAccessibleLabel()||void 0,headingLevel=resolveHeadingLevel(this.headingLevel);return html`<div
+import{__decorate}from"tslib";import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{composedParentElement}from"../../../internal/active-element.js";import{isAccessibilityVisible}from"../../../internal/accessibility-visibility.js";import{AnnouncementUpgradeObserver}from"../../../internal/announcement-text.js";import{applyComposedFocusRepair,captureComposedFocusRepair,collectComposedFocusTargets}from"../../../internal/focus-navigation.js";import{LyraElement}from"../../../internal/lyra-element.js";import{resolveHeadingLevel}from"../../../internal/heading-level.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{contextualSizes,contextualVariants}from"../../../internal/contextual-vocabulary.styles.js";import{styles}from"./callout.styles.js";import{literalSetConverter,presenceTrueDefaultBooleanConverter as trueDefaultBooleanConverter}from"../../../internal/converters.js";import{LYRA_DEFAULT_calloutAnnouncementWithContext,LYRA_DEFAULT_close}from"../../../internal/default-strings.generated.js";const CALLOUT_VARIANT=literalSetConverter(["brand","neutral","success","warning","danger"],"brand"),CALLOUT_VARIANTS=new Set(["brand","neutral","success","warning","danger"]),CALLOUT_SIZE=literalSetConverter(["2xs","xs","s","m","l","xl","small","medium","large"],"m"),CALLOUT_HEADING_LEVEL=literalSetConverter(["1","2","3","4","5","6","none"],"3"),CALLOUT_APPEARANCES=new Set(["accent","filled","outlined","filled-outlined","plain"]),normalizeCalloutAppearance=value=>typeof value=="string"&&CALLOUT_APPEARANCES.has(value)?value:void 0,calloutAppearanceConverter={fromAttribute:normalizeCalloutAppearance,toAttribute:value=>normalizeCalloutAppearance(value)??null};function isComposedWithin(owner,candidate){let current=candidate;for(;current;){if(current===owner)return!0;current=composedParentElement(current)}return!1}function nearestExternalFocusTarget(owner){const documentElement=owner.ownerDocument?.documentElement;if(!documentElement)return null;const targets=collectComposedFocusTargets(documentElement,{mode:"programmatic"}).elements,owned=targets.map((target,index)=>isComposedWithin(owner,target)?index:-1).filter(index=>index>=0);if(owned.length===0)return null;const first=owned[0],last=owned[owned.length-1];return targets.slice(last+1).find(target=>!isComposedWithin(owner,target))??targets.slice(0,first).reverse().find(target=>!isComposedWithin(owner,target))??null}class LyraCallout extends LyraElement{constructor(){super(...arguments),this._variant="brand",this._size="m",this.heading="",this._headingLevel="3",this.closable=!1,this.inline=!1,this.announce=!1,this.open=!0,this.hostAriaLabel=null,this.slotPresence=new SlotPresenceController(this),this.liveActive=!1,this.initialContentAnnounced=!1,this.connectionGeneration=0,this.lastAnnouncementText="",this.announcementShadowRoots=new Set,this.announcementUpgrades=new AnnouncementUpgradeObserver(()=>{this.announceCurrentContent(),this.observeAnnouncementContent()}),this.onForwardedSlotChange=event=>{const slot=event.target;this.announcementForwardingSlots().includes(slot)&&(this.announceCurrentContent(),this.observeAnnouncementContent())},this.close=()=>{const repair=captureComposedFocusRepair(this,nearestExternalFocusTarget(this));this.emit("lr-close-request",{reason:"close-button"},{cancelable:!0}).defaultPrevented||(repair&&applyComposedFocusRepair(repair),this.open=!1,this.emit("lr-close",{reason:"close-button"}))}}static{this.defaultStrings={...super.defaultStrings,calloutAnnouncementWithContext:LYRA_DEFAULT_calloutAnnouncementWithContext,close:LYRA_DEFAULT_close}}static{this.styles=[LyraElement.styles,contextualVariants,contextualSizes,styles]}attributeChangedCallback(name,oldValue,newValue){super.attributeChangedCallback(name,oldValue,newValue)}get variant(){return this._variant}set variant(next){const normalized=CALLOUT_VARIANT.normalizeReflected(this,"variant",next),old=this._variant;old!==normalized&&(this._variant=normalized,this.requestUpdate("variant",old))}get appearance(){return this._appearance}set appearance(next){const normalized=normalizeCalloutAppearance(next);this.hasAttribute("appearance")&&this.getAttribute("appearance")!==normalized&&(normalized===void 0?this.removeAttribute("appearance"):this.setAttribute("appearance",normalized));const old=this._appearance;old!==normalized&&(this._appearance=normalized,this.requestUpdate("appearance",old))}get size(){return this._size}set size(next){const normalized=CALLOUT_SIZE.normalizeReflected(this,"size",next),old=this._size;old!==normalized&&(this._size=normalized,this.requestUpdate("size",old))}get headingLevel(){return this._headingLevel}set headingLevel(next){const normalized=CALLOUT_HEADING_LEVEL.normalizeReflected(this,"heading-level",next),old=this._headingLevel;old!==normalized&&(this._headingLevel=normalized,this.requestUpdate("headingLevel",old))}connectedCallback(){super.connectedCallback(),this.addEventListener("slotchange",this.onForwardedSlotChange),this.politeSink??=acquireAnnouncementSink("polite",{document:this.ownerDocument,source:this}),this.assertiveSink??=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this});const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;MutationObserverCtor&&(this.contentObserver=new MutationObserverCtor(records=>{records.some(record=>!this.contains(record.target)||this.isAnnouncementMutation(record))&&(this.announceCurrentContent(),this.observeAnnouncementContent())}),this.observeAnnouncementContent());const generation=++this.connectionGeneration;this.updateComplete.then(()=>{const view=this.ownerDocument?.defaultView;return typeof view?.requestAnimationFrame=="function"?new Promise(resolve=>view.requestAnimationFrame(()=>resolve())):Promise.resolve()}).then(()=>this.updateComplete).then(()=>{this.isConnected&&generation===this.connectionGeneration&&(this.lastAnnouncementText=this.announcementText(),this.observeAnnouncementContent(),this.liveActive=!0,this.announce&&!this.initialContentAnnounced&&(this.initialContentAnnounced=!0,this.announceCurrentContent(!0)))})}disconnectedCallback(){this.connectionGeneration+=1,this.liveActive=!1,this.lastAnnouncementText="",this.contentObserver?.disconnect(),this.contentObserver=void 0,this.announcementShadowRoots.clear(),this.announcementUpgrades.disconnect(),this.removeEventListener("slotchange",this.onForwardedSlotChange),this.politeSink?.release(),this.politeSink=void 0,this.assertiveSink?.release(),this.assertiveSink=void 0,super.disconnectedCallback()}updated(changed){super.updated(changed),!(!this.liveActive||!this.open)&&(changed.has("open")||changed.has("heading")||changed.has("hostAriaLabel"))&&(this.announceCurrentContent(changed.has("open")),this.observeAnnouncementContent())}willUpdate(changed){if(super.willUpdate(changed),changed.has("open")&&!this.open){const repair=captureComposedFocusRepair(this,nearestExternalFocusTarget(this));repair&&applyComposedFocusRepair(repair)}}isAnnouncementMutation(record){if(record.target===this)return record.type==="childList"||record.type==="attributes"&&["aria-hidden","aria-label","class","hidden","inert","style"].includes(record.attributeName??"");let top=record.target;for(;top.parentNode&&top.parentNode!==this;)top=top.parentNode;return top.parentNode!==this?!1:record.type==="attributes"&&record.attributeName==="slot"&&record.target===top?!0:this.isAnnouncementSlotNode(top)}isAnnouncementSlotNode(node){if(node.nodeType!==1)return!0;const slotName=node.getAttribute("slot");return slotName===null||slotName===""||slotName==="heading"}announcementObservationOptions(){return{attributes:!0,attributeFilter:["alt","aria-hidden","aria-label","class","hidden","inert","open","slot","style"],characterData:!0,childList:!0,subtree:!0}}announcementForwardingSlots(){return Array.from(this.querySelectorAll("slot")).filter(slot=>{let top=slot;for(;top.parentNode&&top.parentNode!==this;)top=top.parentNode;return top.parentNode===this&&this.isAnnouncementSlotNode(top)})}observeAnnouncementContent(){const observer=this.contentObserver;if(!observer)return;observer.disconnect();const options=this.announcementObservationOptions();observer.observe(this,options);for(const slot of this.announcementForwardingSlots())if(slot.assignedNodes().length!==0)for(const assigned of slot.assignedNodes({flatten:!0}))observer.observe(assigned,options);for(const root of this.announcementShadowRoots)observer.observe(root,options)}normalizedText(value){return(value??"").replace(/\s+/g," ").trim()}resolvedAccessibleLabel(){const hostLabel=this.hostAriaLabel;return this.normalizedText(hostLabel)}announcementText(){const roots=new Set;if(this.announcementShadowRoots=roots,!isAccessibilityVisible(this))return"";const hostLabel=this.hostAriaLabel,context=this.normalizedText(hostLabel),heading=[this.heading,...Array.from(this.childNodes).filter(node=>node.nodeType===1&&node.getAttribute("slot")==="heading").map(node=>this.announcementUpgrades.collect(node,roots))],message=Array.from(this.childNodes).filter(node=>{if(node.nodeType!==1)return!0;const slotName=node.getAttribute("slot");return slotName===null||slotName===""}).map(node=>this.announcementUpgrades.collect(node,roots)),content=this.normalizedText([...heading,...message].join(" "));return!context||context===content?content:content?this.localize("calloutAnnouncementWithContext",void 0,{context,content}):context}announceCurrentContent(force=!1){if(!this.liveActive||!this.isConnected||!this.open)return;const text=this.announcementText();!force&&text===this.lastAnnouncementText||(this.lastAnnouncementText=text,(this.effectiveContextualVariant==="danger"?this.assertiveSink:this.politeSink)?.announce(text))}get effectiveContextualVariant(){if(this.hasAttribute("variant"))return this.variant;let ancestor=composedParentElement(this);for(;ancestor;){const candidate=ancestor.getAttribute("variant");if(candidate&&CALLOUT_VARIANTS.has(candidate))return candidate;ancestor=composedParentElement(ancestor)}return"brand"}render(){if(!this.open)return html``;const label=this.resolvedAccessibleLabel()||void 0,headingLevel=resolveHeadingLevel(this.headingLevel);return html`<div
       part="base"
       role=${label?"group":nothing}
       aria-label=${label||nothing}
@@ -30,4 +30,4 @@ import{__decorate}from"tslib";import{html,nothing}from"lit";import{property}from
       >
         <span part="close-icon" aria-hidden="true" inert>×</span>
       </lr-icon-button>
-    </div>`}}__decorate([property({reflect:!0,useDefault:!0,converter:CALLOUT_VARIANT})],LyraCallout.prototype,"variant",null),__decorate([property({reflect:!0,converter:calloutAppearanceConverter})],LyraCallout.prototype,"appearance",null),__decorate([property({reflect:!0,useDefault:!0,converter:CALLOUT_SIZE})],LyraCallout.prototype,"size",null),__decorate([property()],LyraCallout.prototype,"heading",void 0),__decorate([property({attribute:"heading-level",reflect:!0,converter:CALLOUT_HEADING_LEVEL})],LyraCallout.prototype,"headingLevel",null),__decorate([property({type:Boolean,reflect:!0})],LyraCallout.prototype,"closable",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraCallout.prototype,"inline",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraCallout.prototype,"announce",void 0),__decorate([property({type:Boolean,reflect:!0,converter:trueDefaultBooleanConverter})],LyraCallout.prototype,"open",void 0),__decorate([property({attribute:!1})],LyraCallout.prototype,"accessibleLabel",null),__decorate([property({attribute:"aria-label"})],LyraCallout.prototype,"hostAriaLabel",void 0);export{LyraCallout};
+    </div>`}}__decorate([property({reflect:!0,useDefault:!0,converter:CALLOUT_VARIANT})],LyraCallout.prototype,"variant",null),__decorate([property({reflect:!0,converter:calloutAppearanceConverter})],LyraCallout.prototype,"appearance",null),__decorate([property({reflect:!0,useDefault:!0,converter:CALLOUT_SIZE})],LyraCallout.prototype,"size",null),__decorate([property()],LyraCallout.prototype,"heading",void 0),__decorate([property({attribute:"heading-level",reflect:!0,converter:CALLOUT_HEADING_LEVEL})],LyraCallout.prototype,"headingLevel",null),__decorate([property({type:Boolean,reflect:!0})],LyraCallout.prototype,"closable",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraCallout.prototype,"inline",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraCallout.prototype,"announce",void 0),__decorate([property({type:Boolean,reflect:!0,converter:trueDefaultBooleanConverter})],LyraCallout.prototype,"open",void 0),__decorate([property({attribute:"aria-label"})],LyraCallout.prototype,"hostAriaLabel",void 0);export{LyraCallout};

package/dist/components/overlays/dialog/dialog.class.d.ts

@@ -51,8 +51,8 @@ export interface LyraDialogCloseDetail{reason:DialogCloseReason;}export interfac
 * over a page default, while keyframes-only overrides retain the dialog's token-derived timing.
 *
 * Accessible naming and visible-title precedence are independent. A host `aria-label` wins by
-* attribute presence, including an explicitly empty value, followed by `accessibleLabel`, then
-* the text of a direct light-DOM heading. Otherwise the visible title wrapper names the panel.
+* attribute presence, including an explicitly empty value, followed by the text of a direct
+* light-DOM heading. Otherwise the visible title wrapper names the panel.
 * Within that wrapper the rich `label` slot wins over the `label` property, which wins over the
 * legacy `heading` property. Explicit accessible-only naming never suppresses that visible title.
 *
@@ -236,14 +236,11 @@ withFooter:boolean;
 *  `--lr-dialog-max-width`'s literal `32rem` default. Every other tier scales that same cap, from
 *  a compact `20rem` at `2xs` up to a roomy `48rem` at `xl`; an explicit `--lr-dialog-width` or
 *  `--lr-dialog-max-width` override still wins over any tier. */
-size:LyraSize;private legacyAccessibleLabel;
-/** Compatibility fallback below the host aria-label, including an explicitly empty host value.
-* @deprecated Use the host aria-label attribute or the native ariaLabel property. */
-get accessibleLabel():string;set accessibleLabel(value:string);
+size:LyraSize;
 /** Host-level `aria-label` override for the panel's accessible name — wins by attribute
 *  presence, including an explicitly empty value, over every other naming source (a slotted
 *  heading, the `label` slot, `heading`, the `label` property) without suppressing visible
-*  heading chrome, matching `<lr-date-input>`'s `accessibleLabel` pattern. See the class doc for
+*  heading chrome. See the class doc for
 *  the full precedence order. Set as a plain `aria-label` attribute on `<lr-dialog>` itself, not
 *  a public JS property. */
 private hostAriaLabel;

package/dist/components/overlays/dialog/dialog.class.js

@@ -1,4 +1,4 @@
-import{__decorate}from"tslib";import{NativeModalCarrier}from"../../../internal/native-modal-carrier.js";import{nativeModalCarrierStyles}from"../../../internal/native-modal-carrier.styles.js";import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{resolveHeadingLevel}from"../../../internal/heading-level.js";import{activateOverlay,collectFocusableElements}from"../../../internal/overlay-manager.js";import{DeferredFocusReturn,captureFocusReturnOpener}from"../../../internal/deferred-focus-return.js";import{nextId}from"../../../internal/a11y.js";import{composedAccessibilityText,isAccessibilitySubtreeExcluded}from"../../../internal/accessibility-visibility.js";import{closeIcon}from"../../../internal/icons.js";import{warnDeprecatedUsage}from"../../../internal/dev-mode-attribute-warning.js";import{animateRegistered}from"../../../internal/registered-animation.js";import{styles}from"./dialog.styles.js";import{LYRA_DEFAULT_close}from"../../../internal/default-strings.generated.js";const HEADING_SELECTOR='h1, h2, h3, h4, h5, h6, [role="heading"]';class LyraDialog extends LyraElement{constructor(){super(...arguments),this._open=!1,this.label="",this.headingLevel="3",this.withoutCloseButton=!1,this.withoutHeader=!1,this.noHeader=!1,this.withFooter=!1,this.size="m",this.legacyAccessibleLabel="",this.hostAriaLabel=null,this.lightDismiss=!1,this.hasFooterSlot=!1,this.hasLabelSlot=!1,this.hasHeaderActionsSlot=!1,this.focusReturnOpener=null,this.deferredFocusReturn=new DeferredFocusReturn,this.nativeModal=new NativeModalCarrier(this,{onCancel:event=>this.onNativeCancel(event),onUnexpectedClose:carrier=>{!this.open||!this.modalSurface||(this.closeFrom("api",carrier),this.open&&this.enterTopLayer())}}),this.headingObserverGeneration=0,this.transitionToken=0,this.transitionAnimations=[],this.headingId=nextId("dialog-heading"),this.externalModalDepth=0,this.modal={activateExternal:()=>{this.externalModalDepth++,this.externalModalDepth===1&&this.overlay?.suspend()},deactivateExternal:()=>{this.externalModalDepth!==0&&(this.externalModalDepth--,this.externalModalDepth===0&&this.open&&this.modalSurface&&(this.overlay?.resume(),queueMicrotask(()=>this.focusInitial())))}},this.onDefaultSlotChange=()=>{this.detectLightDomChrome(),this.syncBodyTabIndex(),this.resetBodyOverflowObserver(),this.armBodyOverflowObserver()},this.onFooterSlotChange=()=>{this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer")},this.onNativeCancel=event=>{if(event.preventDefault(),!this.open||!this.overlay?.isTopmost())return;const panel=this.renderRoot.querySelector('[part~="panel"]')??this;this.requestClose("keyboard","escape",panel)},this.onBackdropClick=()=>{this.lightDismiss&&this.overlay?.dismissBackdrop()},this.onCloseButtonClick=()=>{const button=this.renderRoot.querySelector('[part~="close-button"]')??this;this.requestClose("close-button","close-button",button)}}static{this.defaultStrings={...super.defaultStrings,close:LYRA_DEFAULT_close}}static{this.styles=[LyraElement.styles,styles,nativeModalCarrierStyles]}attributeChangedCallback(name,oldValue,newValue){super.attributeChangedCallback(name,oldValue,newValue)}get open(){return this._open}set open(next){const normalized=!!next;if(!this.coalesceOpenRequest(normalized)&&normalized!==this._open){if(!this.hasUpdated){this.applyOpenState(normalized);return}normalized?this.show():this.close("api")}}get accessibleLabel(){return this.legacyAccessibleLabel}set accessibleLabel(value){warnDeprecatedUsage(this,"property","accessibleLabel","aria-label"),this.legacyAccessibleLabel=value}get modalSurface(){return!0}willUpdate(changed){if(super.willUpdate(changed),this.hasUpdated||(this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer"),this.detectLightDomChrome()),this.open&&(changed.has("open")||changed.has("contained"))&&this.nativeModal.prepare(this.modalSurface),changed.has("open")){if(this.flushPendingScrollLockRelease(),this.open)this.deferredFocusReturn.cancel(),this.focusReturnOpener=captureFocusReturnOpener(this),this.isConnected&&this.modalSurface&&this.activateOverlay();else{const hadOverlay=this.overlay!==void 0;this.pendingScrollLockRelease=this.deactivateOverlay({deferScrollLockRelease:!0});const opener=this.focusReturnOpener;this.focusReturnOpener=null,hadOverlay&&opener&&this.isConnected&&this.deferredFocusReturn.schedule({host:this,candidates:()=>[opener],settled:this.hideSettled,isCurrent:()=>!this.open})}this.hideSettled=void 0}}flushPendingScrollLockRelease(){const release=this.pendingScrollLockRelease;this.pendingScrollLockRelease=void 0,release?.()}updated(changed){super.updated(changed),this.syncBodyTabIndex(),this.armBodyOverflowObserver(),changed.has("open")&&this.open&&this.isConnected&&this.modalSurface&&(this.enterTopLayer(),this.focusInitial())}connectedCallback(){super.connectedCallback(),this.armHeadingObserver(),this.syncBodyTabIndex(),this.armBodyOverflowObserver(),this.hasUpdated&&this.open&&this.modalSurface&&(this.overlay?.isActive()?this.overlay.resume():this.activateOverlay(),this.enterTopLayer(),queueMicrotask(()=>this.focusInitial()))}disconnectedCallback(){this.resetHeadingObserver(),this.resetBodyOverflowObserver(),super.disconnectedCallback(),this.overlay?.suspend(),this.nativeModal.hide(),this.deferredFocusReturn.cancel(),this.transitionToken++,this.flushPendingScrollLockRelease(),this.cancelTransitionAnimations(),this.removeAttribute("data-closing"),this.open&&queueMicrotask(()=>{if(!this.isConnected&&this.open){if(this.emit("lr-hide",{source:this},{cancelable:this.disconnectHideCancelable}).defaultPrevented){this.syncOpenAttribute();return}this.applyOpenState(!1),this.emit("lr-close",{reason:"unmount"}),this.emit("lr-after-hide")}})}adoptedCallback(){super.adoptedCallback(),this.resetHeadingObserver(),this.resetBodyOverflowObserver(),this.isConnected&&(this.armHeadingObserver(),this.armBodyOverflowObserver(),this.syncBodyTabIndex())}armHeadingObserver(){const ownerDocument=this.ownerDocument;if(!this.isConnected||this.headingObserver&&this.headingObserverDocument===ownerDocument)return;this.resetHeadingObserver();const MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.headingObserverGeneration,observer=new MutationObserverCtor(()=>{this.headingObserver!==observer||this.headingObserverDocument!==ownerDocument||this.headingObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||(this.detectLightDomChrome(),this.syncBodyTabIndex())});this.headingObserver=observer,this.headingObserverDocument=ownerDocument,observer.observe(this,{childList:!0,characterData:!0,subtree:!0,attributes:!0,attributeFilter:["aria-label","aria-labelledby","aria-hidden","hidden","inert","class","style","slot"]})}resetHeadingObserver(){this.headingObserverGeneration+=1,this.headingObserver?.disconnect(),this.headingObserver=void 0,this.headingObserverDocument=void 0}syncBodyTabIndex(){const body=this.renderRoot?.querySelector('[part="body"]');if(!body)return;const next=this.open&&(body.scrollHeight>body.clientHeight&&body.scrollHeight>0||body.scrollWidth>body.clientWidth&&body.scrollWidth>0)?0:-1;body.tabIndex!==next&&(body.tabIndex=next)}armBodyOverflowObserver(){const body=this.renderRoot?.querySelector('[part="body"]');if(!body||!this.isConnected||this.bodyOverflowObservedBody===body)return;this.resetBodyOverflowObserver();const ResizeObserverCtor=this.ownerDocument.defaultView?.ResizeObserver;if(!ResizeObserverCtor)return;const observer=new ResizeObserverCtor(()=>{this.bodyOverflowObserver!==observer||this.bodyOverflowObservedBody!==body||!this.isConnected||this.syncBodyTabIndex()});this.bodyOverflowObserver=observer,this.bodyOverflowObservedBody=body,observer.observe(body);for(const element of this.defaultSlotElements())observer.observe(element)}resetBodyOverflowObserver(){this.bodyOverflowObserver?.disconnect(),this.bodyOverflowObserver=void 0,this.bodyOverflowObservedBody=void 0}defaultSlotElements(){return this.renderRoot?.querySelector('[part="body"] slot:not([name])')?.assignedElements({flatten:!0})??[]}get disconnectHideCancelable(){return!1}detectLightDomChrome(){const children=Array.from(this.children),heading=children.find(el=>el.getAttribute("slot")===null&&el.matches(HEADING_SELECTOR));!heading||isAccessibilitySubtreeExcluded(heading)?this.headingText=void 0:heading.hasAttribute("aria-label")?this.headingText=heading.getAttribute("aria-label")??"":heading.hasAttribute("aria-labelledby")?this.headingText=composedAccessibilityText(heading,{ancestorBoundary:this}).trim()||void 0:this.headingText=composedAccessibilityText(Array.from(heading.childNodes),{ancestorBoundary:heading}).trim()||void 0,this.hasLabelSlot=children.some(el=>el.getAttribute("slot")==="label"),this.hasHeaderActionsSlot=children.some(el=>el.getAttribute("slot")==="header-actions")}show(){if(this.coalesceOpenRequest(!0)||this._open)return Promise.resolve();this.beginOpenRequest(!0);const prevented=this.emit("lr-show",null,{cancelable:!0}).defaultPrevented,superseded=this.openRequestWasSuperseded(!0);return this.finishOpenRequest(),prevented||superseded?(this.syncOpenAttribute(),Promise.resolve()):(this.cancelTransitionAnimations(),this.removeAttribute("data-closing"),this.applyOpenState(!0),this.settleTransition("lr-after-show"))}hide(){return this.close("api")}close(reason="api"){return this.closeFrom(reason,this)}closeFrom(reason,source){if(this.coalesceOpenRequest(!1)||!this._open)return Promise.resolve();if(this.beginOpenRequest(!1),this.emit("lr-hide",{source},{cancelable:!0}).defaultPrevented||this.openRequestWasSuperseded(!1))return this.finishOpenRequest(),this.syncOpenAttribute(),Promise.resolve();if(this.emit("lr-close-request",{reason},{cancelable:!0}).defaultPrevented||this.openRequestWasSuperseded(!1))return this.finishOpenRequest(),this.syncOpenAttribute(),Promise.resolve();this.finishOpenRequest(),this.cancelTransitionAnimations(),this.isConnected&&this.setAttribute("data-closing",""),this.applyOpenState(!1);const settled=this.settleTransition("lr-after-hide");return this.hideSettled=settled,this.emit("lr-close",{reason}),settled}coalesceOpenRequest(next){return this.openRequestTarget===void 0?!1:(this.openRequestDuringPreflight=next,!0)}beginOpenRequest(next){this.openRequestTarget=next,this.openRequestDuringPreflight=void 0}openRequestWasSuperseded(next){return this.openRequestDuringPreflight!==void 0&&this.openRequestDuringPreflight!==next}finishOpenRequest(){this.openRequestTarget=void 0,this.openRequestDuringPreflight=void 0}applyOpenState(next){const old=this._open;this._open=next,next&&(this.initialFocusDecision=void 0),this.requestUpdate("open",old)}syncOpenAttribute(){this.toggleAttribute("open",this._open)}panelAnimationName(showing){return showing?"dialog.show":"dialog.hide"}overlayAnimationName(showing){return showing?"dialog.overlay.show":"dialog.overlay.hide"}panelAnimationSpec(showing){const offset="translateY(calc(-1 * var(--lr-size-0-5rem)))";return{keyframes:showing?[{opacity:0,transform:offset},{opacity:1,transform:"translateY(0)"}]:[{opacity:1,transform:"translateY(0)"},{opacity:0,transform:offset}],durationProperties:[showing?"--show-duration":"--hide-duration","--lr-dialog-panel-duration","--lr-duration-base"],easingProperties:["--lr-easing-standard"]}}overlayAnimationSpec(showing){return{keyframes:showing?[{opacity:0},{opacity:1}]:[{opacity:1},{opacity:0}],durationProperties:[showing?"--show-duration":"--hide-duration","--lr-dialog-backdrop-duration","--lr-duration-fast"],easingProperties:["--lr-easing-standard"]}}cancelTransitionAnimations(){for(const animation of this.transitionAnimations)animation.cancel();this.transitionAnimations=[]}async settleTransition(event){const token=++this.transitionToken;if(await this.updateComplete,this.transitionToken===token){if(this.isConnected){const root=this.renderRoot,panel=root.querySelector('[part~="panel"]'),backdrop=root.querySelector('[part~="backdrop"]'),showing=event==="lr-after-show",animations=[panel?animateRegistered(this,panel,this.panelAnimationName(showing),this.effectiveDirection,this.panelAnimationSpec(showing)):void 0,this.modalSurface&&backdrop?animateRegistered(this,backdrop,this.overlayAnimationName(showing),this.effectiveDirection,this.overlayAnimationSpec(showing)):void 0].filter(animation=>animation!==void 0);if(this.transitionAnimations=animations,await Promise.all(animations.map(animation=>animation.finished.catch(()=>{}))),this.transitionToken!==token)return;this.cancelTransitionAnimations()}event==="lr-after-hide"&&(this.removeAttribute("data-closing"),this.leaveTopLayer(),this.flushPendingScrollLockRelease()),this.emit(event)}}enterTopLayer(){if(this.isConnected&&!this.nativeModal.show()&&typeof this.showPopover=="function"){this.getAttribute("popover")!=="manual"&&this.setAttribute("popover","manual");try{this.isTopLayer()||this.showPopover()}catch{}}}leaveTopLayer(){if(this.nativeModal.hide(),typeof this.hidePopover=="function")try{this.isTopLayer()&&this.hidePopover()}catch{}}isTopLayer(){try{return this.matches(":popover-open")}catch{return!1}}requestClose(source,reason,sourceElement){this.emit("lr-request-close",{source},{cancelable:!0}).defaultPrevented||this.closeFrom(reason,sourceElement)}focusInitial(){this.overlay?.focusInitial()}activateOverlay(){!this.isConnected||this.overlay?.isActive()||(this.overlay=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part~="panel"]')??null,onEscape:()=>{const panel=this.renderRoot.querySelector('[part~="panel"]')??this;this.requestClose("keyboard","escape",panel)},onBackdrop:()=>{const backdrop=this.renderRoot.querySelector('[part~="backdrop"]')??this;this.requestClose("overlay","backdrop",backdrop)},preferredInitialFocus:()=>{const panel=this.renderRoot.querySelector('[part~="panel"]'),body=this.renderRoot.querySelector('[part="body"]'),stops=body?collectFocusableElements(body):[];return stops.find(stop=>stop!==body)??stops[0]??panel},beforeInitialFocus:()=>(this.initialFocusDecision===void 0&&(this.initialFocusDecision=!this.emit("lr-initial-focus",null,{cancelable:!0}).defaultPrevented),this.initialFocusDecision),lockScroll:!0,suspendWhenUnrendered:!0}),this.externalModalDepth>0&&this.overlay.suspend())}deactivateOverlay(options){const overlay=this.overlay;return this.overlay=void 0,overlay?.deactivate(options)}render(){const suppressHeader=this.withoutHeader||this.noHeader,renderHeading=!suppressHeader&&!this.headingText&&(this.hasLabelSlot||(this.label??"").length>0||!!this.heading),hasHostName=this.hostAriaLabel!==null,explicitName=hasHostName?this.hostAriaLabel:this.accessibleLabel||this.headingText,hasExplicitName=hasHostName||!!explicitName,useHeadingForName=!hasExplicitName&&renderHeading,showHeader=!suppressHeader&&(renderHeading||this.hasHeaderActionsSlot||!this.withoutCloseButton),headingLevel=resolveHeadingLevel(this.headingLevel);return this.nativeModal.render(html`
+import{__decorate}from"tslib";import{NativeModalCarrier}from"../../../internal/native-modal-carrier.js";import{nativeModalCarrierStyles}from"../../../internal/native-modal-carrier.styles.js";import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{resolveHeadingLevel}from"../../../internal/heading-level.js";import{activateOverlay,collectFocusableElements}from"../../../internal/overlay-manager.js";import{DeferredFocusReturn,captureFocusReturnOpener}from"../../../internal/deferred-focus-return.js";import{nextId}from"../../../internal/a11y.js";import{composedAccessibilityText,isAccessibilitySubtreeExcluded}from"../../../internal/accessibility-visibility.js";import{closeIcon}from"../../../internal/icons.js";import{animateRegistered}from"../../../internal/registered-animation.js";import{styles}from"./dialog.styles.js";import{LYRA_DEFAULT_close}from"../../../internal/default-strings.generated.js";const HEADING_SELECTOR='h1, h2, h3, h4, h5, h6, [role="heading"]';class LyraDialog extends LyraElement{constructor(){super(...arguments),this._open=!1,this.label="",this.headingLevel="3",this.withoutCloseButton=!1,this.withoutHeader=!1,this.noHeader=!1,this.withFooter=!1,this.size="m",this.hostAriaLabel=null,this.lightDismiss=!1,this.hasFooterSlot=!1,this.hasLabelSlot=!1,this.hasHeaderActionsSlot=!1,this.focusReturnOpener=null,this.deferredFocusReturn=new DeferredFocusReturn,this.nativeModal=new NativeModalCarrier(this,{onCancel:event=>this.onNativeCancel(event),onUnexpectedClose:carrier=>{!this.open||!this.modalSurface||(this.closeFrom("api",carrier),this.open&&this.enterTopLayer())}}),this.headingObserverGeneration=0,this.transitionToken=0,this.transitionAnimations=[],this.headingId=nextId("dialog-heading"),this.externalModalDepth=0,this.modal={activateExternal:()=>{this.externalModalDepth++,this.externalModalDepth===1&&this.overlay?.suspend()},deactivateExternal:()=>{this.externalModalDepth!==0&&(this.externalModalDepth--,this.externalModalDepth===0&&this.open&&this.modalSurface&&(this.overlay?.resume(),queueMicrotask(()=>this.focusInitial())))}},this.onDefaultSlotChange=()=>{this.detectLightDomChrome(),this.syncBodyTabIndex(),this.resetBodyOverflowObserver(),this.armBodyOverflowObserver()},this.onFooterSlotChange=()=>{this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer")},this.onNativeCancel=event=>{if(event.preventDefault(),!this.open||!this.overlay?.isTopmost())return;const panel=this.renderRoot.querySelector('[part~="panel"]')??this;this.requestClose("keyboard","escape",panel)},this.onBackdropClick=()=>{this.lightDismiss&&this.overlay?.dismissBackdrop()},this.onCloseButtonClick=()=>{const button=this.renderRoot.querySelector('[part~="close-button"]')??this;this.requestClose("close-button","close-button",button)}}static{this.defaultStrings={...super.defaultStrings,close:LYRA_DEFAULT_close}}static{this.styles=[LyraElement.styles,styles,nativeModalCarrierStyles]}attributeChangedCallback(name,oldValue,newValue){super.attributeChangedCallback(name,oldValue,newValue)}get open(){return this._open}set open(next){const normalized=!!next;if(!this.coalesceOpenRequest(normalized)&&normalized!==this._open){if(!this.hasUpdated){this.applyOpenState(normalized);return}normalized?this.show():this.close("api")}}get modalSurface(){return!0}willUpdate(changed){if(super.willUpdate(changed),this.hasUpdated||(this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer"),this.detectLightDomChrome()),this.open&&(changed.has("open")||changed.has("contained"))&&this.nativeModal.prepare(this.modalSurface),changed.has("open")){if(this.flushPendingScrollLockRelease(),this.open)this.deferredFocusReturn.cancel(),this.focusReturnOpener=captureFocusReturnOpener(this),this.isConnected&&this.modalSurface&&this.activateOverlay();else{const hadOverlay=this.overlay!==void 0;this.pendingScrollLockRelease=this.deactivateOverlay({deferScrollLockRelease:!0});const opener=this.focusReturnOpener;this.focusReturnOpener=null,hadOverlay&&opener&&this.isConnected&&this.deferredFocusReturn.schedule({host:this,candidates:()=>[opener],settled:this.hideSettled,isCurrent:()=>!this.open})}this.hideSettled=void 0}}flushPendingScrollLockRelease(){const release=this.pendingScrollLockRelease;this.pendingScrollLockRelease=void 0,release?.()}updated(changed){super.updated(changed),this.syncBodyTabIndex(),this.armBodyOverflowObserver(),changed.has("open")&&this.open&&this.isConnected&&this.modalSurface&&(this.enterTopLayer(),this.focusInitial())}connectedCallback(){super.connectedCallback(),this.armHeadingObserver(),this.syncBodyTabIndex(),this.armBodyOverflowObserver(),this.hasUpdated&&this.open&&this.modalSurface&&(this.overlay?.isActive()?this.overlay.resume():this.activateOverlay(),this.enterTopLayer(),queueMicrotask(()=>this.focusInitial()))}disconnectedCallback(){this.resetHeadingObserver(),this.resetBodyOverflowObserver(),super.disconnectedCallback(),this.overlay?.suspend(),this.nativeModal.hide(),this.deferredFocusReturn.cancel(),this.transitionToken++,this.flushPendingScrollLockRelease(),this.cancelTransitionAnimations(),this.removeAttribute("data-closing"),this.open&&queueMicrotask(()=>{if(!this.isConnected&&this.open){if(this.emit("lr-hide",{source:this},{cancelable:this.disconnectHideCancelable}).defaultPrevented){this.syncOpenAttribute();return}this.applyOpenState(!1),this.emit("lr-close",{reason:"unmount"}),this.emit("lr-after-hide")}})}adoptedCallback(){super.adoptedCallback(),this.resetHeadingObserver(),this.resetBodyOverflowObserver(),this.isConnected&&(this.armHeadingObserver(),this.armBodyOverflowObserver(),this.syncBodyTabIndex())}armHeadingObserver(){const ownerDocument=this.ownerDocument;if(!this.isConnected||this.headingObserver&&this.headingObserverDocument===ownerDocument)return;this.resetHeadingObserver();const MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.headingObserverGeneration,observer=new MutationObserverCtor(()=>{this.headingObserver!==observer||this.headingObserverDocument!==ownerDocument||this.headingObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||(this.detectLightDomChrome(),this.syncBodyTabIndex())});this.headingObserver=observer,this.headingObserverDocument=ownerDocument,observer.observe(this,{childList:!0,characterData:!0,subtree:!0,attributes:!0,attributeFilter:["aria-label","aria-labelledby","aria-hidden","hidden","inert","class","style","slot"]})}resetHeadingObserver(){this.headingObserverGeneration+=1,this.headingObserver?.disconnect(),this.headingObserver=void 0,this.headingObserverDocument=void 0}syncBodyTabIndex(){const body=this.renderRoot?.querySelector('[part="body"]');if(!body)return;const next=this.open&&(body.scrollHeight>body.clientHeight&&body.scrollHeight>0||body.scrollWidth>body.clientWidth&&body.scrollWidth>0)?0:-1;body.tabIndex!==next&&(body.tabIndex=next)}armBodyOverflowObserver(){const body=this.renderRoot?.querySelector('[part="body"]');if(!body||!this.isConnected||this.bodyOverflowObservedBody===body)return;this.resetBodyOverflowObserver();const ResizeObserverCtor=this.ownerDocument.defaultView?.ResizeObserver;if(!ResizeObserverCtor)return;const observer=new ResizeObserverCtor(()=>{this.bodyOverflowObserver!==observer||this.bodyOverflowObservedBody!==body||!this.isConnected||this.syncBodyTabIndex()});this.bodyOverflowObserver=observer,this.bodyOverflowObservedBody=body,observer.observe(body);for(const element of this.defaultSlotElements())observer.observe(element)}resetBodyOverflowObserver(){this.bodyOverflowObserver?.disconnect(),this.bodyOverflowObserver=void 0,this.bodyOverflowObservedBody=void 0}defaultSlotElements(){return this.renderRoot?.querySelector('[part="body"] slot:not([name])')?.assignedElements({flatten:!0})??[]}get disconnectHideCancelable(){return!1}detectLightDomChrome(){const children=Array.from(this.children),heading=children.find(el=>el.getAttribute("slot")===null&&el.matches(HEADING_SELECTOR));!heading||isAccessibilitySubtreeExcluded(heading)?this.headingText=void 0:heading.hasAttribute("aria-label")?this.headingText=heading.getAttribute("aria-label")??"":heading.hasAttribute("aria-labelledby")?this.headingText=composedAccessibilityText(heading,{ancestorBoundary:this}).trim()||void 0:this.headingText=composedAccessibilityText(Array.from(heading.childNodes),{ancestorBoundary:heading}).trim()||void 0,this.hasLabelSlot=children.some(el=>el.getAttribute("slot")==="label"),this.hasHeaderActionsSlot=children.some(el=>el.getAttribute("slot")==="header-actions")}show(){if(this.coalesceOpenRequest(!0)||this._open)return Promise.resolve();this.beginOpenRequest(!0);const prevented=this.emit("lr-show",null,{cancelable:!0}).defaultPrevented,superseded=this.openRequestWasSuperseded(!0);return this.finishOpenRequest(),prevented||superseded?(this.syncOpenAttribute(),Promise.resolve()):(this.cancelTransitionAnimations(),this.removeAttribute("data-closing"),this.applyOpenState(!0),this.settleTransition("lr-after-show"))}hide(){return this.close("api")}close(reason="api"){return this.closeFrom(reason,this)}closeFrom(reason,source){if(this.coalesceOpenRequest(!1)||!this._open)return Promise.resolve();if(this.beginOpenRequest(!1),this.emit("lr-hide",{source},{cancelable:!0}).defaultPrevented||this.openRequestWasSuperseded(!1))return this.finishOpenRequest(),this.syncOpenAttribute(),Promise.resolve();if(this.emit("lr-close-request",{reason},{cancelable:!0}).defaultPrevented||this.openRequestWasSuperseded(!1))return this.finishOpenRequest(),this.syncOpenAttribute(),Promise.resolve();this.finishOpenRequest(),this.cancelTransitionAnimations(),this.isConnected&&this.setAttribute("data-closing",""),this.applyOpenState(!1);const settled=this.settleTransition("lr-after-hide");return this.hideSettled=settled,this.emit("lr-close",{reason}),settled}coalesceOpenRequest(next){return this.openRequestTarget===void 0?!1:(this.openRequestDuringPreflight=next,!0)}beginOpenRequest(next){this.openRequestTarget=next,this.openRequestDuringPreflight=void 0}openRequestWasSuperseded(next){return this.openRequestDuringPreflight!==void 0&&this.openRequestDuringPreflight!==next}finishOpenRequest(){this.openRequestTarget=void 0,this.openRequestDuringPreflight=void 0}applyOpenState(next){const old=this._open;this._open=next,next&&(this.initialFocusDecision=void 0),this.requestUpdate("open",old)}syncOpenAttribute(){this.toggleAttribute("open",this._open)}panelAnimationName(showing){return showing?"dialog.show":"dialog.hide"}overlayAnimationName(showing){return showing?"dialog.overlay.show":"dialog.overlay.hide"}panelAnimationSpec(showing){const offset="translateY(calc(-1 * var(--lr-size-0-5rem)))";return{keyframes:showing?[{opacity:0,transform:offset},{opacity:1,transform:"translateY(0)"}]:[{opacity:1,transform:"translateY(0)"},{opacity:0,transform:offset}],durationProperties:[showing?"--show-duration":"--hide-duration","--lr-dialog-panel-duration","--lr-duration-base"],easingProperties:["--lr-easing-standard"]}}overlayAnimationSpec(showing){return{keyframes:showing?[{opacity:0},{opacity:1}]:[{opacity:1},{opacity:0}],durationProperties:[showing?"--show-duration":"--hide-duration","--lr-dialog-backdrop-duration","--lr-duration-fast"],easingProperties:["--lr-easing-standard"]}}cancelTransitionAnimations(){for(const animation of this.transitionAnimations)animation.cancel();this.transitionAnimations=[]}async settleTransition(event){const token=++this.transitionToken;if(await this.updateComplete,this.transitionToken===token){if(this.isConnected){const root=this.renderRoot,panel=root.querySelector('[part~="panel"]'),backdrop=root.querySelector('[part~="backdrop"]'),showing=event==="lr-after-show",animations=[panel?animateRegistered(this,panel,this.panelAnimationName(showing),this.effectiveDirection,this.panelAnimationSpec(showing)):void 0,this.modalSurface&&backdrop?animateRegistered(this,backdrop,this.overlayAnimationName(showing),this.effectiveDirection,this.overlayAnimationSpec(showing)):void 0].filter(animation=>animation!==void 0);if(this.transitionAnimations=animations,await Promise.all(animations.map(animation=>animation.finished.catch(()=>{}))),this.transitionToken!==token)return;this.cancelTransitionAnimations()}event==="lr-after-hide"&&(this.removeAttribute("data-closing"),this.leaveTopLayer(),this.flushPendingScrollLockRelease()),this.emit(event)}}enterTopLayer(){if(this.isConnected&&!this.nativeModal.show()&&typeof this.showPopover=="function"){this.getAttribute("popover")!=="manual"&&this.setAttribute("popover","manual");try{this.isTopLayer()||this.showPopover()}catch{}}}leaveTopLayer(){if(this.nativeModal.hide(),typeof this.hidePopover=="function")try{this.isTopLayer()&&this.hidePopover()}catch{}}isTopLayer(){try{return this.matches(":popover-open")}catch{return!1}}requestClose(source,reason,sourceElement){this.emit("lr-request-close",{source},{cancelable:!0}).defaultPrevented||this.closeFrom(reason,sourceElement)}focusInitial(){this.overlay?.focusInitial()}activateOverlay(){!this.isConnected||this.overlay?.isActive()||(this.overlay=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part~="panel"]')??null,onEscape:()=>{const panel=this.renderRoot.querySelector('[part~="panel"]')??this;this.requestClose("keyboard","escape",panel)},onBackdrop:()=>{const backdrop=this.renderRoot.querySelector('[part~="backdrop"]')??this;this.requestClose("overlay","backdrop",backdrop)},preferredInitialFocus:()=>{const panel=this.renderRoot.querySelector('[part~="panel"]'),body=this.renderRoot.querySelector('[part="body"]'),stops=body?collectFocusableElements(body):[];return stops.find(stop=>stop!==body)??stops[0]??panel},beforeInitialFocus:()=>(this.initialFocusDecision===void 0&&(this.initialFocusDecision=!this.emit("lr-initial-focus",null,{cancelable:!0}).defaultPrevented),this.initialFocusDecision),lockScroll:!0,suspendWhenUnrendered:!0}),this.externalModalDepth>0&&this.overlay.suspend())}deactivateOverlay(options){const overlay=this.overlay;return this.overlay=void 0,overlay?.deactivate(options)}render(){const suppressHeader=this.withoutHeader||this.noHeader,renderHeading=!suppressHeader&&!this.headingText&&(this.hasLabelSlot||(this.label??"").length>0||!!this.heading),hasHostName=this.hostAriaLabel!==null,explicitName=hasHostName?this.hostAriaLabel:this.headingText,hasExplicitName=hasHostName||!!explicitName,useHeadingForName=!hasExplicitName&&renderHeading,showHeader=!suppressHeader&&(renderHeading||this.hasHeaderActionsSlot||!this.withoutCloseButton),headingLevel=resolveHeadingLevel(this.headingLevel);return this.nativeModal.render(html`
         <div part="backdrop overlay" @click=${this.onBackdropClick}></div>
         <div
           part="panel dialog"
@@ -40,4 +40,4 @@ import{__decorate}from"tslib";import{NativeModalCarrier}from"../../../internal/n
           </div>
           ${this.nativeModal.renderHelperSlot()}
         </div>
-    `,{part:"base",label:hasExplicitName?explicitName:void 0,labelledBy:useHeadingForName?this.headingId:void 0})}}__decorate([property({type:Boolean,reflect:!0})],LyraDialog.prototype,"open",null),__decorate([property({reflect:!0})],LyraDialog.prototype,"label",void 0),__decorate([property({attribute:"heading-level",reflect:!0})],LyraDialog.prototype,"headingLevel",void 0),__decorate([property()],LyraDialog.prototype,"heading",void 0),__decorate([property({type:Boolean,attribute:"without-close-button",reflect:!0})],LyraDialog.prototype,"withoutCloseButton",void 0),__decorate([property({type:Boolean,attribute:"without-header",reflect:!0})],LyraDialog.prototype,"withoutHeader",void 0),__decorate([property({type:Boolean,attribute:"no-header",reflect:!0})],LyraDialog.prototype,"noHeader",void 0),__decorate([property({type:Boolean,attribute:"with-footer",reflect:!0})],LyraDialog.prototype,"withFooter",void 0),__decorate([property({reflect:!0})],LyraDialog.prototype,"size",void 0),__decorate([property({attribute:!1})],LyraDialog.prototype,"accessibleLabel",null),__decorate([property({attribute:"aria-label"})],LyraDialog.prototype,"hostAriaLabel",void 0),__decorate([property({type:Boolean,attribute:"light-dismiss"})],LyraDialog.prototype,"lightDismiss",void 0),__decorate([state()],LyraDialog.prototype,"hasFooterSlot",void 0),__decorate([state()],LyraDialog.prototype,"hasLabelSlot",void 0),__decorate([state()],LyraDialog.prototype,"hasHeaderActionsSlot",void 0),__decorate([state()],LyraDialog.prototype,"headingText",void 0);export{LyraDialog};
+    `,{part:"base",label:hasExplicitName?explicitName:void 0,labelledBy:useHeadingForName?this.headingId:void 0})}}__decorate([property({type:Boolean,reflect:!0})],LyraDialog.prototype,"open",null),__decorate([property({reflect:!0})],LyraDialog.prototype,"label",void 0),__decorate([property({attribute:"heading-level",reflect:!0})],LyraDialog.prototype,"headingLevel",void 0),__decorate([property()],LyraDialog.prototype,"heading",void 0),__decorate([property({type:Boolean,attribute:"without-close-button",reflect:!0})],LyraDialog.prototype,"withoutCloseButton",void 0),__decorate([property({type:Boolean,attribute:"without-header",reflect:!0})],LyraDialog.prototype,"withoutHeader",void 0),__decorate([property({type:Boolean,attribute:"no-header",reflect:!0})],LyraDialog.prototype,"noHeader",void 0),__decorate([property({type:Boolean,attribute:"with-footer",reflect:!0})],LyraDialog.prototype,"withFooter",void 0),__decorate([property({reflect:!0})],LyraDialog.prototype,"size",void 0),__decorate([property({attribute:"aria-label"})],LyraDialog.prototype,"hostAriaLabel",void 0),__decorate([property({type:Boolean,attribute:"light-dismiss"})],LyraDialog.prototype,"lightDismiss",void 0),__decorate([state()],LyraDialog.prototype,"hasFooterSlot",void 0),__decorate([state()],LyraDialog.prototype,"hasLabelSlot",void 0),__decorate([state()],LyraDialog.prototype,"hasHeaderActionsSlot",void 0),__decorate([state()],LyraDialog.prototype,"headingText",void 0);export{LyraDialog};

package/dist/components/overlays/overlay/dropdown.class.d.ts

@@ -1,4 +1,4 @@
-import{type PropertyValues,type TemplateResult}from'lit';import type{Placement}from'@floating-ui/dom';import type{PlaceStrategy,PlaceSync}from'../../../internal/positioner.js';import type{LyraSize}from'../../../internal/variants.js';import type{LyraMenu,MenuItemSelectDetail}from'../../layout/menu/menu.class.js';import{LyraPopover,type LyraPopoverEventMap,type LyraPopupRole}from'./popover.class.js';import{type LyraDeprecatedAliases}from'../../../internal/deprecated-aliases.js';export type{PlaceStrategy,PlaceSync};export interface LyraDropdownEventMap extends LyraPopoverEventMap{'lr-select':CustomEvent<MenuItemSelectDetail>;}
+import{type PropertyValues,type TemplateResult}from'lit';import type{Placement}from'@floating-ui/dom';import type{PlaceStrategy,PlaceSync}from'../../../internal/positioner.js';import type{LyraSize}from'../../../internal/variants.js';import type{LyraMenu,MenuItemSelectDetail}from'../../layout/menu/menu.class.js';import{LyraPopover,type LyraPopoverEventMap,type LyraPopupRole}from'./popover.class.js';export type{PlaceStrategy,PlaceSync};export interface LyraDropdownEventMap extends LyraPopoverEventMap{'lr-select':CustomEvent<MenuItemSelectDetail>;}
 /**
 * `<lr-dropdown>` — a trigger-owned action menu. The public host remains the Popover-style
 * trigger/positioning shell, but that shell is semantic-neutral: a contained `<lr-menu>` is the
@@ -62,10 +62,7 @@ import{type PropertyValues,type TemplateResult}from'lit';import type{Placement}f
 * @status stable
 * @since 4.0.0
 */
-export declare class LyraDropdown extends LyraPopover<LyraDropdownEventMap>{static styles:(import("lit").CSSResultGroup[]|import("lit").CSSResult)[];protected static deprecatedAliases:LyraDeprecatedAliases;
-/** Render the anchor arrow. Defaults on.
-* @deprecated Use `without-arrow`; removal not before 24.0.0. */
-arrow:boolean;
+export declare class LyraDropdown extends LyraPopover<LyraDropdownEventMap>{static styles:(import("lit").CSSResultGroup[]|import("lit").CSSResult)[];
 /** Dropdowns sit flush against their trigger by default; generic popovers retain eight pixels. */
 distance:number;
 /** Action menus retain their mapped below-trigger placement. */
@@ -104,11 +101,9 @@ protected get popupSurfaceRole():undefined;protected animationDurationProperties
 /**
 * Reads the default slot's currently assigned elements and adopts a consumer-supplied
 * `<lr-menu>` among them (rather than wrapping mapped rows in a second, generated one) --
-* wired as the `slotchange` handler (via `onContentSlotChange`) for every later mutation, and
-* called once more from `firstUpdated()` (see `collectInitialSlotAssignment`) to cover an
-* environment, or a real-browser timing race, where the slot's initial assignment never fires
-* `slotchange`. Idempotent: a second call finding the same (or still-absent) menu falls through
-* the `next !== this.consumerMenu` guard and only re-runs the harmless `configureMenu()` resync.
+* wired as the `slotchange` handler for later mutations and called from `firstUpdated()` for
+* initial assignment. A repeated menu falls through the identity guard and only re-runs the
+* harmless `configureMenu()` resync.
 */
 private collectConsumerMenuFromSlot;protected onTriggerKeyDown(event:KeyboardEvent):void;
 /** Re-run positioning after an imperative anchor/layout change. */

package/dist/components/overlays/overlay/dropdown.class.js

@@ -1,4 +1,4 @@
-import{__decorate}from"tslib";import{html}from"lit";import{property,query,state}from"lit/decorators.js";import{html as staticHtml,unsafeStatic}from"lit/static-html.js";import{collectInitialSlotAssignment}from"../../../internal/initial-slot-collection.js";import{tag}from"../../../internal/prefix.js";import{LyraPopover}from"./popover.class.js";import{trueDefaultBooleanConverter}from"../../../internal/converters.js";import{invertAlias}from"../../../internal/deprecated-aliases.js";import{styles}from"./dropdown.styles.js";const menuTag=unsafeStatic(tag("menu"));class LyraDropdown extends LyraPopover{static{this.styles=[LyraPopover.styles,styles]}static{this.deprecatedAliases={arrow:["withoutArrow",invertAlias,invertAlias]}}get hoist(){return this.positioningStrategy==="fixed"}set hoist(next){this.positioningStrategy=next?"fixed":"absolute"}constructor(){super(),this.arrow=!0,this.distance=0,this.placement="bottom-start",this.size="m",this.stayOpenOnSelect=!1,this.onContentSlotChange=event=>{this.collectConsumerMenuFromSlot(event.target)},this.popupRole="menu"}get popupRole(){return"menu"}set popupRole(_next){super.popupRole!=="menu"&&(super.popupRole="menu")}attributeChangedCallback(name,oldValue,newValue){if(name==="popup-role"&&newValue!==null&&newValue!=="menu"){this.setAttribute("popup-role","menu");return}super.attributeChangedCallback(name,oldValue,newValue)}get defaultDistance(){return 0}get defaultPositioningStrategy(){return"absolute"}onPositioningStrategyChanged(previous,next){const wasHoisted=previous==="fixed";wasHoisted!==(next==="fixed")&&this.requestUpdate("hoist",wasHoisted)}get positioningSync(){return this.sync}get animationNamespace(){return"dropdown"}get popupSurfaceRole(){}animationDurationProperties(showing){return[showing?"--show-duration":"--hide-duration","--lr-transition-fast"]}get popupPartNames(){return["popup","dialog","popup-popup","base","base__popup","panel"].join(" ")}get arrowPartNames(){return"arrow popup-arrow"}isInsideLightDismissBoundary(path){return super.isInsideLightDismissBoundary(path)||!!(this.containingElement&&path.includes(this.containingElement))}onPopupPositioned(){if(super.onPopupPositioned(),this.openedByInteraction)return;const menu=this.menuEngine;if(!menu?.dropdownOpen)return;menu.shadowRoot?.querySelector("slot:not([name])")?.assignedElements({flatten:!0}).find(element=>element.tabIndex===0)?.focus()}get menuEngine(){return this.consumerMenu??this.renderRoot.querySelector('[part~="menu"]')??void 0}configureMenu(menu){menu&&(menu===this.consumerMenu&&!this.consumerMenuSnapshot&&(this.consumerMenuSnapshot={dropdownOwner:menu.dropdownOwner,dropdownContained:menu.dropdownContained,dropdownRendersMenuRole:menu.dropdownRendersMenuRole,dropdownStayOpenOnSelect:menu.dropdownStayOpenOnSelect,dropdownSize:menu.dropdownSize,dropdownLabel:menu.dropdownLabel,dropdownOpen:menu.dropdownOpen}),menu.dropdownOwner=this,menu.dropdownContained=!0,menu.dropdownRendersMenuRole=!0,menu.dropdownStayOpenOnSelect=this.stayOpenOnSelect,menu.dropdownSize=this.size,menu.dropdownLabel=this.effectivePopupLabel,menu.dropdownOpen=this.open)}connectedCallback(){super.connectedCallback(),this.updateComplete.then(()=>{this.isConnected&&this.configureMenu(this.menuEngine)})}releaseConsumerMenu(menu){if(!menu)return;const snapshot=menu===this.consumerMenu?this.consumerMenuSnapshot:void 0;menu.dropdownOpen=!1,menu.dropdownOwner=snapshot?.dropdownOwner??null,menu.dropdownContained=snapshot?.dropdownContained??!1,menu.dropdownRendersMenuRole=snapshot?.dropdownRendersMenuRole??!1,menu.dropdownStayOpenOnSelect=snapshot?.dropdownStayOpenOnSelect??!1,menu.dropdownSize=snapshot?.dropdownSize,menu.dropdownLabel=snapshot?.dropdownLabel,snapshot&&(menu.dropdownOpen=snapshot.dropdownOpen),menu===this.consumerMenu&&(this.consumerMenuSnapshot=void 0)}collectConsumerMenuFromSlot(slot){const next=slot.assignedElements({flatten:!0}).find(element=>element.localName===tag("menu"));next!==this.consumerMenu&&(this.releaseConsumerMenu(this.consumerMenu),this.consumerMenu=next),this.configureMenu(next??this.menuEngine)}onTriggerKeyDown(event){if(this.disabled||this.open)return;let focus;if(event.key==="ArrowDown"?focus="first":event.key==="ArrowUp"&&(focus="last"),!focus)return;event.preventDefault();const menu=this.menuEngine;this.configureMenu(menu),menu?menu.focusContained(focus):this.show()}reposition(){this.positionPopup()}focusOnTrigger(options){this.renderRoot.querySelector('slot[name="trigger"]')?.assignedElements({flatten:!0})[0]?.focus(options)}getMenu(){return this.menuEngine??null}updated(changed){super.updated(changed),this.configureMenu(this.menuEngine),this.open&&changed.has("sync")&&this.reposition()}firstUpdated(changed){super.firstUpdated(changed);const slot=this.contentSlot;queueMicrotask(()=>{collectInitialSlotAssignment(slot,s=>this.collectConsumerMenuFromSlot(s))})}disconnectedCallback(){this.releaseConsumerMenu(this.consumerMenu),super.disconnectedCallback()}renderPopupContent(){return this.consumerMenu?html`<slot @slotchange=${this.onContentSlotChange}></slot>`:staticHtml`
+import{__decorate}from"tslib";import{html}from"lit";import{property,query,state}from"lit/decorators.js";import{html as staticHtml,unsafeStatic}from"lit/static-html.js";import{collectInitialSlotAssignment}from"../../../internal/initial-slot-collection.js";import{tag}from"../../../internal/prefix.js";import{LyraPopover}from"./popover.class.js";import{styles}from"./dropdown.styles.js";const menuTag=unsafeStatic(tag("menu"));class LyraDropdown extends LyraPopover{static{this.styles=[LyraPopover.styles,styles]}get hoist(){return this.positioningStrategy==="fixed"}set hoist(next){this.positioningStrategy=next?"fixed":"absolute"}constructor(){super(),this.distance=0,this.placement="bottom-start",this.size="m",this.stayOpenOnSelect=!1,this.onContentSlotChange=event=>{this.collectConsumerMenuFromSlot(event.target)},this.popupRole="menu"}get popupRole(){return"menu"}set popupRole(_next){super.popupRole!=="menu"&&(super.popupRole="menu")}attributeChangedCallback(name,oldValue,newValue){if(name==="popup-role"&&newValue!==null&&newValue!=="menu"){this.setAttribute("popup-role","menu");return}super.attributeChangedCallback(name,oldValue,newValue)}get defaultDistance(){return 0}get defaultPositioningStrategy(){return"absolute"}onPositioningStrategyChanged(previous,next){const wasHoisted=previous==="fixed";wasHoisted!==(next==="fixed")&&this.requestUpdate("hoist",wasHoisted)}get positioningSync(){return this.sync}get animationNamespace(){return"dropdown"}get popupSurfaceRole(){}animationDurationProperties(showing){return[showing?"--show-duration":"--hide-duration","--lr-transition-fast"]}get popupPartNames(){return["popup","dialog","popup-popup","base","base__popup","panel"].join(" ")}get arrowPartNames(){return"arrow popup-arrow"}isInsideLightDismissBoundary(path){return super.isInsideLightDismissBoundary(path)||!!(this.containingElement&&path.includes(this.containingElement))}onPopupPositioned(){if(super.onPopupPositioned(),this.openedByInteraction)return;const menu=this.menuEngine;if(!menu?.dropdownOpen)return;menu.shadowRoot?.querySelector("slot:not([name])")?.assignedElements({flatten:!0}).find(element=>element.tabIndex===0)?.focus()}get menuEngine(){return this.consumerMenu??this.renderRoot.querySelector('[part~="menu"]')??void 0}configureMenu(menu){menu&&(menu===this.consumerMenu&&!this.consumerMenuSnapshot&&(this.consumerMenuSnapshot={dropdownOwner:menu.dropdownOwner,dropdownContained:menu.dropdownContained,dropdownRendersMenuRole:menu.dropdownRendersMenuRole,dropdownStayOpenOnSelect:menu.dropdownStayOpenOnSelect,dropdownSize:menu.dropdownSize,dropdownLabel:menu.dropdownLabel,dropdownOpen:menu.dropdownOpen}),menu.dropdownOwner=this,menu.dropdownContained=!0,menu.dropdownRendersMenuRole=!0,menu.dropdownStayOpenOnSelect=this.stayOpenOnSelect,menu.dropdownSize=this.size,menu.dropdownLabel=this.effectivePopupLabel,menu.dropdownOpen=this.open)}connectedCallback(){super.connectedCallback(),this.updateComplete.then(()=>{this.isConnected&&this.configureMenu(this.menuEngine)})}releaseConsumerMenu(menu){if(!menu)return;const snapshot=menu===this.consumerMenu?this.consumerMenuSnapshot:void 0;menu.dropdownOpen=!1,menu.dropdownOwner=snapshot?.dropdownOwner??null,menu.dropdownContained=snapshot?.dropdownContained??!1,menu.dropdownRendersMenuRole=snapshot?.dropdownRendersMenuRole??!1,menu.dropdownStayOpenOnSelect=snapshot?.dropdownStayOpenOnSelect??!1,menu.dropdownSize=snapshot?.dropdownSize,menu.dropdownLabel=snapshot?.dropdownLabel,snapshot&&(menu.dropdownOpen=snapshot.dropdownOpen),menu===this.consumerMenu&&(this.consumerMenuSnapshot=void 0)}collectConsumerMenuFromSlot(slot){const next=slot.assignedElements({flatten:!0}).find(element=>element.localName===tag("menu"));next!==this.consumerMenu&&(this.releaseConsumerMenu(this.consumerMenu),this.consumerMenu=next),this.configureMenu(next??this.menuEngine)}onTriggerKeyDown(event){if(this.disabled||this.open)return;let focus;if(event.key==="ArrowDown"?focus="first":event.key==="ArrowUp"&&(focus="last"),!focus)return;event.preventDefault();const menu=this.menuEngine;this.configureMenu(menu),menu?menu.focusContained(focus):this.show()}reposition(){this.positionPopup()}focusOnTrigger(options){this.renderRoot.querySelector('slot[name="trigger"]')?.assignedElements({flatten:!0})[0]?.focus(options)}getMenu(){return this.menuEngine??null}updated(changed){super.updated(changed),this.configureMenu(this.menuEngine),this.open&&changed.has("sync")&&this.reposition()}firstUpdated(changed){super.firstUpdated(changed);const slot=this.contentSlot;queueMicrotask(()=>{collectInitialSlotAssignment(slot,s=>this.collectConsumerMenuFromSlot(s))})}disconnectedCallback(){this.releaseConsumerMenu(this.consumerMenu),super.disconnectedCallback()}renderPopupContent(){return this.consumerMenu?html`<slot @slotchange=${this.onContentSlotChange}></slot>`:staticHtml`
       <${menuTag}
         part="menu"
         .dropdownOwner=${this}
@@ -11,4 +11,4 @@ import{__decorate}from"tslib";import{html}from"lit";import{property,query,state}
       >
         <slot @slotchange=${this.onContentSlotChange}></slot>
       </${menuTag}>
-    `}}__decorate([property({type:Boolean,converter:trueDefaultBooleanConverter,reflect:!0})],LyraDropdown.prototype,"arrow",void 0),__decorate([property({reflect:!0})],LyraDropdown.prototype,"size",void 0),__decorate([property({type:Boolean,attribute:"stay-open-on-select",reflect:!0})],LyraDropdown.prototype,"stayOpenOnSelect",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraDropdown.prototype,"hoist",null),__decorate([property({reflect:!0})],LyraDropdown.prototype,"sync",void 0),__decorate([property({attribute:!1})],LyraDropdown.prototype,"containingElement",void 0),__decorate([state()],LyraDropdown.prototype,"consumerMenu",void 0),__decorate([query("slot:not([name])")],LyraDropdown.prototype,"contentSlot",void 0),__decorate([property({attribute:"popup-role"})],LyraDropdown.prototype,"popupRole",null);export{LyraDropdown};
+    `}}__decorate([property({reflect:!0})],LyraDropdown.prototype,"size",void 0),__decorate([property({type:Boolean,attribute:"stay-open-on-select",reflect:!0})],LyraDropdown.prototype,"stayOpenOnSelect",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraDropdown.prototype,"hoist",null),__decorate([property({reflect:!0})],LyraDropdown.prototype,"sync",void 0),__decorate([property({attribute:!1})],LyraDropdown.prototype,"containingElement",void 0),__decorate([state()],LyraDropdown.prototype,"consumerMenu",void 0),__decorate([query("slot:not([name])")],LyraDropdown.prototype,"contentSlot",void 0),__decorate([property({attribute:"popup-role"})],LyraDropdown.prototype,"popupRole",null);export{LyraDropdown};

package/dist/components/overlays/overlay/popover.class.d.ts

@@ -376,9 +376,8 @@ showAt(rect:OverlayVirtualRect,options?:{returnFocusTo?:HTMLElement;}):void;
 private resolveAnchor;protected positionPopup():void;private invalidatePositioning;private resolveCurrentPositioning;private startPositioning;private syncTriggerA11y;private get accessibleTrigger();private releaseTriggerA11y;private onTriggerSlotChange;
 /**
 * Reads the named `trigger` slot's currently assigned element and applies it -- wired as the
-* `slotchange` handler (via `onTriggerSlotChange`) for every later mutation, and called once
-* more from `firstUpdated()` (see `collectInitialSlotAssignment`) to cover an environment, or a
-* real-browser timing race, where the slot's initial assignment never fires `slotchange`.
+* `slotchange` handler for later mutations and called from `firstUpdated()` for initial
+* assignment.
 * Idempotent: a second call that reads back the same assigned element is a no-op past the
 * `next === this.slottedTrigger` guard.
 */

package/dist/components/overlays/popup/popup.class.js

@@ -1,4 +1,4 @@
-import{__decorate}from"tslib";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{deferredPlace as place}from"../../../internal/anchored-overlay-runtime.js";import{virtualAnchorFromRect}from"../../../internal/positioner-geometry.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{finiteNumber}from"../../../internal/numbers.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{applyOverlayArrow}from"../overlay/overlay-arrow.js";import{observeOverlayAnchorIdentity}from"../overlay/overlay-shared.js";import{styles}from"./popup.styles.js";const PLACEMENTS=new Set(["top","top-start","top-end","bottom","bottom-start","bottom-end","left","left-start","left-end","right","right-start","right-end"]),AUTO_SIZE_AXES=new Set(["horizontal","vertical","both"]),SYNC_AXES=new Set(["width","height","both"]);function parseCssTime(value){const trimmed=value.trim();return trimmed.endsWith("ms")?Number.parseFloat(trimmed):trimmed.endsWith("s")?Number.parseFloat(trimmed)*1e3:0}function maxCssTransitionTime(value){return Math.max(0,...value.split(",").map(parseCssTime).filter(Number.isFinite))}class LyraPopup extends LyraElement{constructor(){super(...arguments),this.active=!1,this.for="",this.anchor=null,this.placement="top",this.strategy="absolute",this.distance=0,this.skidding=0,this.flip=!1,this.flipFallbackPlacements="",this.flipFallbackStrategy="best-fit",this.boundary="viewport",this.flipBoundary=null,this.flipPadding=0,this.shift=!1,this.shiftBoundary=null,this.shiftPadding=0,this.padding=0,this.autoSize=null,this.autoSizeBoundary=null,this.autoSizePadding=0,this.sync=null,this.hoverBridge=!1,this.arrow=!1,this.arrowPlacement="anchor",this.arrowPadding=10,this.virtualAnchor=null,this.anchorPositioned=!1,this.popupHidden=!0,this.popupHideToken=0,this.resolvedPlacement="top",this.onAnchorSlotChange=()=>{if(!this.active)return;const nextIdentity=this.resolveAnchor()?.identity,currentIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;nextIdentity!==currentIdentity&&this.reposition()},this.onForwardedAnchorSlotChange=event=>{event.target?.localName==="slot"&&this.onAnchorSlotChange()}}static{this.styles=[LyraElement.styles,styles]}get popup(){return this.renderRoot?.querySelector('[part~="popup"]')}set popup(_next){}connectedCallback(){super.connectedCallback(),this.addEventListener("slotchange",this.onForwardedAnchorSlotChange),this.syncAnchorIdentityObservation(),this.hasUpdated&&this.active&&(this.popupHidden=!1,this.reposition())}disconnectedCallback(){this.removeEventListener("slotchange",this.onForwardedAnchorSlotChange),this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.teardown(),this.positionedAnchorIdentity=void 0,this.setPositioned(!1),this.popupHideToken++,this.popupHidden=!0,super.disconnectedCallback()}willUpdate(changed){super.willUpdate(changed),changed.has("active")&&!this.active&&this.setPositioned(!1),changed.has("active")&&this.active&&(this.popupHidden=!1),(changed.has("anchor")||changed.has("for")||changed.has("virtualAnchor"))&&this.setPositioned(!1)}updated(changed){super.updated(changed),this.reposition(),changed.has("active")&&!this.active&&this.settlePopupHidden()}async settlePopupHidden(){const token=++this.popupHideToken;if(await this.updateComplete,token!==this.popupHideToken||this.active)return;const popup=this.popup,view=this.ownerDocument.defaultView;if(popup&&view&&!prefersReducedMotion(this)){const computed=view.getComputedStyle(popup),durationMs=maxCssTransitionTime(computed.transitionDuration)+maxCssTransitionTime(computed.transitionDelay);if(durationMs>0&&(await new Promise(resolve=>{let settled=!1,timeout;const finish=()=>{settled||(settled=!0,timeout!==void 0&&view.clearTimeout(timeout),popup.removeEventListener("transitionend",onEnd),popup.removeEventListener("transitioncancel",onEnd),resolve())},onEnd=event=>{event.target===popup&&finish()};popup.addEventListener("transitionend",onEnd),popup.addEventListener("transitioncancel",onEnd),timeout=view.setTimeout(finish,durationMs+50)}),token!==this.popupHideToken||this.active))return}this.popupHidden=!0}reposition(){this.syncAnchorIdentityObservation();const anchor=this.isConnected&&this.active?this.resolveAnchor():null,previousIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;if(this.teardown(),!this.isConnected||!this.active||!this.popup||!anchor){this.positionedAnchorIdentity=void 0,this.setPositioned(!1);return}anchor.identity!==previousIdentity&&(this.positionedAnchorIdentity=void 0,this.setPositioned(!1)),this.placingAnchorIdentity=anchor.identity;const arrowPadding=Math.max(0,finiteNumber(this.arrowPadding,0));this.stopPlacing=place(anchor.target,this.popup,{placement:rtlAwarePlacement(this.placement,this),strategy:this.strategy==="absolute"?"absolute":"fixed",offset:finiteNumber(this.distance,0),skidding:finiteNumber(this.skidding,0),boundary:this.boundary==="scroll"?void 0:[],flip:this.flip,flipFallbackPlacements:this.parsedFlipFallbackPlacements,flipFallbackStrategy:this.flipFallbackStrategy==="initial"||this.flipFallbackStrategy==="initial-placement"?"initial-placement":"best-fit",flipBoundary:this.flipBoundary??void 0,flipPadding:Math.max(0,finiteNumber(this.flipPadding,0)),shift:this.shift,shiftBoundary:this.shiftBoundary??void 0,shiftPadding:Math.max(0,finiteNumber(this.shiftPadding,0)),padding:Math.max(0,finiteNumber(this.padding,0)),autoSize:AUTO_SIZE_AXES.has(this.autoSize)?this.autoSize:void 0,autoSizeBoundary:this.autoSizeBoundary??void 0,autoSizePadding:Math.max(0,finiteNumber(this.autoSizePadding,0)),sync:SYNC_AXES.has(this.sync)?this.sync:void 0,arrow:this.arrow?this.arrowElement:void 0,arrowPadding,hoverBridge:this.hoverBridge?this.hoverBridgeElement:void 0,onPlaced:({placement,arrow})=>{const currentAnchor=this.resolveAnchor();if(!this.isConnected||!this.active||currentAnchor?.identity!==anchor.identity){this.setPositioned(!1);return}this.placingAnchorIdentity=void 0,this.positionedAnchorIdentity=anchor.identity,this.setPositioned(!0),this.popup.style.setProperty("--auto-size-available-width",this.popup.style.getPropertyValue("--lr-positioner-available-inline-size")),this.popup.style.setProperty("--auto-size-available-height",this.popup.style.getPropertyValue("--lr-positioner-available-block-size"));const side=applyOverlayArrow(this.arrowElement??null,{placement,coords:arrow,enabled:this.arrow,arrowPlacement:this.arrowPlacement,arrowPadding,rtl:this.effectiveDirection==="rtl",sizeProperty:"--arrow-size",fallbackSizeProperty:"--lr-popup-arrow-size"});this.applyArrowSidePart(side),placement!==this.resolvedPlacement&&(this.resolvedPlacement=placement,this.applySidePart(placement)),this.emit("lr-reposition",{placement})}})}get parsedFlipFallbackPlacements(){const raw=(this.flipFallbackPlacements??"").trim();if(!raw)return;const parsed=raw.split(/[\s,]+/).filter(token=>PLACEMENTS.has(token));return parsed.length?parsed:void 0}teardown(){this.stopPlacing?.(),this.stopPlacing=void 0,this.placingAnchorIdentity=void 0}resolveAnchor(){if(this.virtualAnchor){const candidate=this.virtualAnchor;if(typeof candidate.getBoundingClientRect=="function")return{target:candidate,identity:candidate};const rect=this.virtualAnchor,width=rect.width??0,height=rect.height??0;return[rect.x,rect.y,width,height].every(Number.isFinite)?{target:virtualAnchorFromRect({x:rect.x,y:rect.y,width:Math.max(0,width),height:Math.max(0,height)}),identity:rect}:null}if(this.anchor){if(typeof this.anchor=="string"){const target2=this.getRootNode().getElementById?.(this.anchor)??null;if(target2)return{target:target2,identity:target2}}else if(typeof this.anchor.getBoundingClientRect=="function"&&(!this.isElementAnchor(this.anchor)||this.anchor.isConnected))return{target:this.anchor,identity:this.anchor}}if(this.for){const target2=this.getRootNode().getElementById?.(this.for)??null;if(target2)return{target:target2,identity:target2}}const target=this.anchorSlotWrapper?.querySelector("slot")?.assignedElements({flatten:!0})[0]??null;return target?.isConnected?{target,identity:target}:null}isElementAnchor(anchor){const candidate=anchor,ElementCtor=candidate.ownerDocument?.defaultView?.Element;return ElementCtor?candidate instanceof ElementCtor:candidate.nodeType===1}syncAnchorIdentityObservation(){if(this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,!this.isConnected||!this.active||this.virtualAnchor)return;const directAnchor=this.anchor&&typeof this.anchor!="string"&&this.isElementAnchor(this.anchor)?this.anchor:void 0;if(!(typeof this.anchor=="string"||!!this.for||!!directAnchor))return;const onIdentityChange=()=>{const nextIdentity=this.resolveAnchor()?.identity,currentIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;nextIdentity!==currentIdentity&&this.reposition()},observedRoots=new Set([this]);directAnchor&&directAnchor.getRootNode()!==this.getRootNode()&&observedRoots.add(directAnchor.isConnected?directAnchor:directAnchor.ownerDocument);const cleanups=[...observedRoots].map(root=>observeOverlayAnchorIdentity(root,onIdentityChange));this.stopAnchorIdentityObservation=()=>{for(const cleanup of cleanups)cleanup()}}setPositioned(positioned){this.anchorPositioned=positioned}applySidePart(placement){const side=placement.split("-")[0]??"bottom";this.popup?.setAttribute("part",`popup ${side}`)}applyArrowSidePart(side){this.arrowElement?.setAttribute("part",`arrow arrow-${side}`)}render(){const side=this.resolvedPlacement.split("-")[0],paints=this.active&&this.anchorPositioned,awaitsPosition=this.active&&!this.anchorPositioned;return html`
+import{__decorate}from"tslib";import{maxCssTime}from"../../../internal/css-motion-time.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{deferredPlace as place}from"../../../internal/anchored-overlay-runtime.js";import{virtualAnchorFromRect}from"../../../internal/positioner-geometry.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{finiteNumber}from"../../../internal/numbers.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{applyOverlayArrow}from"../overlay/overlay-arrow.js";import{observeOverlayAnchorIdentity}from"../overlay/overlay-shared.js";import{styles}from"./popup.styles.js";const PLACEMENTS=new Set(["top","top-start","top-end","bottom","bottom-start","bottom-end","left","left-start","left-end","right","right-start","right-end"]),AUTO_SIZE_AXES=new Set(["horizontal","vertical","both"]),SYNC_AXES=new Set(["width","height","both"]);class LyraPopup extends LyraElement{constructor(){super(...arguments),this.active=!1,this.for="",this.anchor=null,this.placement="top",this.strategy="absolute",this.distance=0,this.skidding=0,this.flip=!1,this.flipFallbackPlacements="",this.flipFallbackStrategy="best-fit",this.boundary="viewport",this.flipBoundary=null,this.flipPadding=0,this.shift=!1,this.shiftBoundary=null,this.shiftPadding=0,this.padding=0,this.autoSize=null,this.autoSizeBoundary=null,this.autoSizePadding=0,this.sync=null,this.hoverBridge=!1,this.arrow=!1,this.arrowPlacement="anchor",this.arrowPadding=10,this.virtualAnchor=null,this.anchorPositioned=!1,this.popupHidden=!0,this.popupHideToken=0,this.resolvedPlacement="top",this.onAnchorSlotChange=()=>{if(!this.active)return;const nextIdentity=this.resolveAnchor()?.identity,currentIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;nextIdentity!==currentIdentity&&this.reposition()},this.onForwardedAnchorSlotChange=event=>{event.target?.localName==="slot"&&this.onAnchorSlotChange()}}static{this.styles=[LyraElement.styles,styles]}get popup(){return this.renderRoot?.querySelector('[part~="popup"]')}set popup(_next){}connectedCallback(){super.connectedCallback(),this.addEventListener("slotchange",this.onForwardedAnchorSlotChange),this.syncAnchorIdentityObservation(),this.hasUpdated&&this.active&&(this.popupHidden=!1,this.reposition())}disconnectedCallback(){this.removeEventListener("slotchange",this.onForwardedAnchorSlotChange),this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.teardown(),this.positionedAnchorIdentity=void 0,this.setPositioned(!1),this.popupHideToken++,this.popupHidden=!0,super.disconnectedCallback()}willUpdate(changed){super.willUpdate(changed),changed.has("active")&&!this.active&&this.setPositioned(!1),changed.has("active")&&this.active&&(this.popupHidden=!1),(changed.has("anchor")||changed.has("for")||changed.has("virtualAnchor"))&&this.setPositioned(!1)}updated(changed){super.updated(changed),this.reposition(),changed.has("active")&&!this.active&&this.settlePopupHidden()}async settlePopupHidden(){const token=++this.popupHideToken;if(await this.updateComplete,token!==this.popupHideToken||this.active)return;const popup=this.popup,view=this.ownerDocument.defaultView;if(popup&&view&&!prefersReducedMotion(this)){const computed=view.getComputedStyle(popup),durationMs=maxCssTime(computed.transitionDuration)+maxCssTime(computed.transitionDelay);if(durationMs>0&&(await new Promise(resolve=>{let settled=!1,timeout;const finish=()=>{settled||(settled=!0,timeout!==void 0&&view.clearTimeout(timeout),popup.removeEventListener("transitionend",onEnd),popup.removeEventListener("transitioncancel",onEnd),resolve())},onEnd=event=>{event.target===popup&&finish()};popup.addEventListener("transitionend",onEnd),popup.addEventListener("transitioncancel",onEnd),timeout=view.setTimeout(finish,durationMs+50)}),token!==this.popupHideToken||this.active))return}this.popupHidden=!0}reposition(){this.syncAnchorIdentityObservation();const anchor=this.isConnected&&this.active?this.resolveAnchor():null,previousIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;if(this.teardown(),!this.isConnected||!this.active||!this.popup||!anchor){this.positionedAnchorIdentity=void 0,this.setPositioned(!1);return}anchor.identity!==previousIdentity&&(this.positionedAnchorIdentity=void 0,this.setPositioned(!1)),this.placingAnchorIdentity=anchor.identity;const arrowPadding=Math.max(0,finiteNumber(this.arrowPadding,0));this.stopPlacing=place(anchor.target,this.popup,{placement:rtlAwarePlacement(this.placement,this),strategy:this.strategy==="absolute"?"absolute":"fixed",offset:finiteNumber(this.distance,0),skidding:finiteNumber(this.skidding,0),boundary:this.boundary==="scroll"?void 0:[],flip:this.flip,flipFallbackPlacements:this.parsedFlipFallbackPlacements,flipFallbackStrategy:this.flipFallbackStrategy==="initial"||this.flipFallbackStrategy==="initial-placement"?"initial-placement":"best-fit",flipBoundary:this.flipBoundary??void 0,flipPadding:Math.max(0,finiteNumber(this.flipPadding,0)),shift:this.shift,shiftBoundary:this.shiftBoundary??void 0,shiftPadding:Math.max(0,finiteNumber(this.shiftPadding,0)),padding:Math.max(0,finiteNumber(this.padding,0)),autoSize:AUTO_SIZE_AXES.has(this.autoSize)?this.autoSize:void 0,autoSizeBoundary:this.autoSizeBoundary??void 0,autoSizePadding:Math.max(0,finiteNumber(this.autoSizePadding,0)),sync:SYNC_AXES.has(this.sync)?this.sync:void 0,arrow:this.arrow?this.arrowElement:void 0,arrowPadding,hoverBridge:this.hoverBridge?this.hoverBridgeElement:void 0,onPlaced:({placement,arrow})=>{const currentAnchor=this.resolveAnchor();if(!this.isConnected||!this.active||currentAnchor?.identity!==anchor.identity){this.setPositioned(!1);return}this.placingAnchorIdentity=void 0,this.positionedAnchorIdentity=anchor.identity,this.setPositioned(!0),this.popup.style.setProperty("--auto-size-available-width",this.popup.style.getPropertyValue("--lr-positioner-available-inline-size")),this.popup.style.setProperty("--auto-size-available-height",this.popup.style.getPropertyValue("--lr-positioner-available-block-size"));const side=applyOverlayArrow(this.arrowElement??null,{placement,coords:arrow,enabled:this.arrow,arrowPlacement:this.arrowPlacement,arrowPadding,rtl:this.effectiveDirection==="rtl",sizeProperty:"--arrow-size",fallbackSizeProperty:"--lr-popup-arrow-size"});this.applyArrowSidePart(side),placement!==this.resolvedPlacement&&(this.resolvedPlacement=placement,this.applySidePart(placement)),this.emit("lr-reposition",{placement})}})}get parsedFlipFallbackPlacements(){const raw=(this.flipFallbackPlacements??"").trim();if(!raw)return;const parsed=raw.split(/[\s,]+/).filter(token=>PLACEMENTS.has(token));return parsed.length?parsed:void 0}teardown(){this.stopPlacing?.(),this.stopPlacing=void 0,this.placingAnchorIdentity=void 0}resolveAnchor(){if(this.virtualAnchor){const candidate=this.virtualAnchor;if(typeof candidate.getBoundingClientRect=="function")return{target:candidate,identity:candidate};const rect=this.virtualAnchor,width=rect.width??0,height=rect.height??0;return[rect.x,rect.y,width,height].every(Number.isFinite)?{target:virtualAnchorFromRect({x:rect.x,y:rect.y,width:Math.max(0,width),height:Math.max(0,height)}),identity:rect}:null}if(this.anchor){if(typeof this.anchor=="string"){const target2=this.getRootNode().getElementById?.(this.anchor)??null;if(target2)return{target:target2,identity:target2}}else if(typeof this.anchor.getBoundingClientRect=="function"&&(!this.isElementAnchor(this.anchor)||this.anchor.isConnected))return{target:this.anchor,identity:this.anchor}}if(this.for){const target2=this.getRootNode().getElementById?.(this.for)??null;if(target2)return{target:target2,identity:target2}}const target=this.anchorSlotWrapper?.querySelector("slot")?.assignedElements({flatten:!0})[0]??null;return target?.isConnected?{target,identity:target}:null}isElementAnchor(anchor){const candidate=anchor,ElementCtor=candidate.ownerDocument?.defaultView?.Element;return ElementCtor?candidate instanceof ElementCtor:candidate.nodeType===1}syncAnchorIdentityObservation(){if(this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,!this.isConnected||!this.active||this.virtualAnchor)return;const directAnchor=this.anchor&&typeof this.anchor!="string"&&this.isElementAnchor(this.anchor)?this.anchor:void 0;if(!(typeof this.anchor=="string"||!!this.for||!!directAnchor))return;const onIdentityChange=()=>{const nextIdentity=this.resolveAnchor()?.identity,currentIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;nextIdentity!==currentIdentity&&this.reposition()},observedRoots=new Set([this]);directAnchor&&directAnchor.getRootNode()!==this.getRootNode()&&observedRoots.add(directAnchor.isConnected?directAnchor:directAnchor.ownerDocument);const cleanups=[...observedRoots].map(root=>observeOverlayAnchorIdentity(root,onIdentityChange));this.stopAnchorIdentityObservation=()=>{for(const cleanup of cleanups)cleanup()}}setPositioned(positioned){this.anchorPositioned=positioned}applySidePart(placement){const side=placement.split("-")[0]??"bottom";this.popup?.setAttribute("part",`popup ${side}`)}applyArrowSidePart(side){this.arrowElement?.setAttribute("part",`arrow arrow-${side}`)}render(){const side=this.resolvedPlacement.split("-")[0],paints=this.active&&this.anchorPositioned,awaitsPosition=this.active&&!this.anchorPositioned;return html`
       ${this.hoverBridge?html`<span part="hover-bridge" ?data-active=${paints}></span>`:nothing}
       <span part="anchor"><slot name="anchor" @slotchange=${this.onAnchorSlotChange}></slot></span>
       <div part="popup ${side}" ?hidden=${this.popupHidden} ?data-active=${paints} ?data-awaits-position=${awaitsPosition}>