@aceshooting/lyra-ui 13.0.1 → 14.1.0

package/dist/components/media/av-player/av-metadata.d.ts

@@ -1,5 +1,6 @@
-/** One synced transcript entry. `end` is exclusive; an omitted `end` extends to the next cue (or
-* forever, for the last one). Cue collections require a trimmed nonempty `cueId` and retain the
+/** One synced transcript entry. `end` is exclusive; an omitted `end` extends to the next strictly chronological
+* start (or forever, for the last one). Equal starts do not end one another; caller order is
+* retained. The player indexes starts on assignment so playback reconciliation stays linear. Cue collections require a trimmed nonempty `cueId` and retain the
 * first occurrence when IDs repeat. */
 export interface LyraAvCue{readonly cueId:string;readonly start:number;readonly end?:number;readonly text:string;readonly speaker?:string;}
 /** A native `<track>` source (subtitles/captions/descriptions). */

package/dist/components/media/av-player/av-player.class.d.ts

@@ -119,7 +119,7 @@ name:string;
 *  Unrecognized runtime or attribute values continue MIME auto-detection. */
 kind?:LyraAvKind;
 /** Drives auto-detection: an `audio/*` mime type renders `<audio>`; anything else renders
-*  `<video>`. Ignored once `kind` is set explicitly. */
+*  `<video>`. Ignored once `kind` is set explicitly. Attribute removal is consumed as an absent hint. */
 mimeType:string;
 /** Poster image for `<video>`; validated with `safeMediaSrc` and omitted when unsafe. Ignored for
 *  `<audio>`. */
@@ -133,9 +133,10 @@ get playbackRate():number;set playbackRate(next:number);
 * direct property writes update the current media generation without feedback duplicates. */
 get volume():number;set volume(next:number);private _rates;
 /** Selectable rates offered by `[part="rate-select"]`; snapshotted, deduplicated, bounded to 32. */
-get rates():readonly number[];set rates(value:readonly number[]);private _cues;
+get rates():readonly number[];set rates(value:readonly number[]);private _cues;private nextCueStarts;
 /** Transcript entries, rendered as a virtualized, `currentTime`-synced list. Valid nonempty
-* `cueId` values are unique; the first occurrence wins. Inputs are bounded, cloned, and frozen. */
+* `cueId` values are unique; the first occurrence wins. Inputs are bounded, cloned, and frozen.
+* Omitted ends use indexed next chronological starts; seeks reconcile in linear work. */
 get cues():readonly LyraAvCue[];set cues(value:readonly LyraAvCue[]);private _peaks;
 /** Normalized `0..1` waveform amplitude samples. Empty renders a plain seek rail instead of a
 *  canvas -- this component never decodes audio itself. */

package/dist/components/media/av-player/av-player.class.js

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{keyed}from"lit/directives/keyed.js";import{ref}from"lit/directives/ref.js";import{LyraElement}from"../../../internal/lyra-element.js";import{DocumentAnchorTarget}from"../../../internal/anchor-target.js";import{MAX_NATIVE_PLAYBACK_RATE as MAX_PLAYBACK_RATE,MIN_NATIVE_PLAYBACK_RATE as MIN_PLAYBACK_RATE,NativeMediaController,safeNativeMediaSource as safeMediaSrc}from"../../../internal/media-controller.js";import{hostAriaLabel,srOnly}from"../../../internal/a11y.js";import{finiteNumber,finiteRange}from"../../../internal/numbers.js";import{attachInternalsSafely}from"../../../internal/form-associated.js";import{chevronIcon}from"../../../internal/icons.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{ThemeWatcher}from"../../../internal/theme-watcher.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{styles}from"./av-player.styles.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{resolveBoundedCanvasAllocation}from"../../../internal/canvas.js";import{EMPTY_LYRA_AV_CUES,EMPTY_LYRA_AV_TRACKS,snapshotLyraAvCues,snapshotLyraAvTracks}from"./av-metadata.js";import{LYRA_DEFAULT_anchorJumped,LYRA_DEFAULT_anchorJumpedToPage,LYRA_DEFAULT_anchorNotFound,LYRA_DEFAULT_avPlayerFailedToLoad,LYRA_DEFAULT_avPlayerLabel,LYRA_DEFAULT_avPlayerPlaybackRate,LYRA_DEFAULT_avPlayerPosition,LYRA_DEFAULT_avPlayerRateOption,LYRA_DEFAULT_avPlayerTimeline,LYRA_DEFAULT_avPlayerTranscript,LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_viewerHighlightLabel}from"../../../internal/default-strings.generated.js";const TIME_CHANGE_THROTTLE_MS=250,MAX_AV_RATES=32,MAX_AV_PEAKS=65536,MAX_CANVAS_DIMENSION=4096,MAX_CANVAS_PIXELS=8388608,OWNED_AV_COLLECTIONS=new WeakSet,NO_REPORTED_ERROR=Symbol("no-reported-av-error");function ownedSnapshot(values){const snapshot=Object.freeze(values);return OWNED_AV_COLLECTIONS.add(snapshot),snapshot}const EMPTY_RATES=ownedSnapshot([]),DEFAULT_RATES=ownedSnapshot([.75,1,1.25,1.5,2]),EMPTY_CUES=EMPTY_LYRA_AV_CUES,EMPTY_PEAKS=ownedSnapshot([]),EMPTY_TRACKS=EMPTY_LYRA_AV_TRACKS;function normalizeArray(value,limit,normalize,fallback){try{if(!Array.isArray(value))return fallback;if(OWNED_AV_COLLECTIONS.has(value))return value;const result=[],length=Math.min(value.length,limit);for(let index=0;index<length;index++)try{const normalized=normalize(value[index],index);normalized!==void 0&&result.push(normalized)}catch{}return ownedSnapshot(result)}catch{return fallback}}function normalizeRates(value){const seen=new Set;return normalizeArray(value,MAX_AV_RATES,candidate=>{if(!(typeof candidate!="number"||!Number.isFinite(candidate)||candidate<MIN_PLAYBACK_RATE||candidate>MAX_PLAYBACK_RATE||seen.has(candidate)))return seen.add(candidate),candidate},EMPTY_RATES)}function normalizePeaks(value){return normalizeArray(value,MAX_AV_PEAKS,candidate=>typeof candidate=="number"?finiteRange(candidate,0,0,1):void 0,EMPTY_PEAKS)}function positiveFinite(value){const finite=finiteNumber(value,1);return finite>0?finite:1}function waveformPaintPeaks(peaks,maxBars){const barCount=Math.max(1,Math.floor(finiteNumber(maxBars,1)));if(peaks.length<=barCount)return peaks;const finalIndex=peaks.length-1;if(barCount===1)return[finiteRange(peaks[finalIndex],0,0,1)];const result=new Array(barCount),preEndpointBars=barCount-1;for(let barIndex=0;barIndex<preEndpointBars;barIndex+=1){const start=Math.floor(barIndex*finalIndex/preEndpointBars),end=Math.floor((barIndex+1)*finalIndex/preEndpointBars);let peak=0;for(let sampleIndex=start;sampleIndex<end;sampleIndex+=1)peak=Math.max(peak,finiteRange(peaks[sampleIndex],0,0,1));result[barIndex]=peak}return result[preEndpointBars]=finiteRange(peaks[finalIndex],0,0,1),result}function formatTime(seconds,locale){const total=Math.round(finiteRange(seconds,0,0)),h=Math.floor(total/3600),m=Math.floor(total%3600/60),s=total%60,regular=getNumberFormat(locale,{maximumFractionDigits:0,useGrouping:!1}),padded=getNumberFormat(locale,{maximumFractionDigits:0,minimumIntegerDigits:2,useGrouping:!1}),mm=(h>0?padded:regular).format(m),ss=padded.format(s);return h>0?`${regular.format(h)}:${mm}:${ss}`:`${mm}:${ss}`}class LyraAvPlayerBase extends LyraElement{}class LyraAvPlayer extends DocumentAnchorTarget(LyraAvPlayerBase){static{this.defaultStrings={...super.defaultStrings,anchorJumped:LYRA_DEFAULT_anchorJumped,anchorJumpedToPage:LYRA_DEFAULT_anchorJumpedToPage,anchorNotFound:LYRA_DEFAULT_anchorNotFound,avPlayerFailedToLoad:LYRA_DEFAULT_avPlayerFailedToLoad,avPlayerLabel:LYRA_DEFAULT_avPlayerLabel,avPlayerPlaybackRate:LYRA_DEFAULT_avPlayerPlaybackRate,avPlayerPosition:LYRA_DEFAULT_avPlayerPosition,avPlayerRateOption:LYRA_DEFAULT_avPlayerRateOption,avPlayerTimeline:LYRA_DEFAULT_avPlayerTimeline,avPlayerTranscript:LYRA_DEFAULT_avPlayerTranscript,fieldRequired:LYRA_DEFAULT_fieldRequired,viewerHighlightLabel:LYRA_DEFAULT_viewerHighlightLabel}}static{this.styles=[LyraElement.styles,styles,srOnly]}static{this.properties={playbackRate:{type:Number,attribute:"playback-rate",reflect:!0,noAccessor:!0},volume:{type:Number,reflect:!0,noAccessor:!0}}}get playbackRate(){return this._playbackRate}set playbackRate(next){const old=this._playbackRate;this._playbackRate=finiteRange(next,1,MIN_PLAYBACK_RATE,MAX_PLAYBACK_RATE),this.requestUpdate("playbackRate",old)}get volume(){return this._volume}set volume(next){const old=this._volume;this._volume=finiteRange(next,1,0,1),this.requestUpdate("volume",old)}get rates(){return this._rates}set rates(value){const previous=this._rates;this._rates=normalizeRates(value),this.requestUpdate("rates",previous)}get cues(){return this._cues}set cues(value){const previous=this._cues;this._cues=snapshotLyraAvCues(value),this.requestUpdate("cues",previous)}get peaks(){return this._peaks}set peaks(value){const previous=this._peaks;this._peaks=normalizePeaks(value),this.requestUpdate("peaks",previous)}get tracks(){return this._tracks}set tracks(value){const previous=this._tracks;this._tracks=snapshotLyraAvTracks(value),this.requestUpdate("tracks",previous)}constructor(){super(),this.src="",this.name="",this.mimeType="",this.poster="",this.loop=!1,this.muted=!1,this.preload="metadata",this._playbackRate=1,this._volume=1,this._rates=DEFAULT_RATES,this._cues=EMPTY_CUES,this._peaks=EMPTY_PEAKS,this._tracks=EMPTY_TRACKS,this.anchorKinds=["time-range"],this.duration=0,this.currentTimeState=0,this.activeCueId=null,this.activeCueIndex=-1,this.searchQuery="",this.searchMatches=[],this.activeSearchIndex=-1,this.metadataLoaded=!1,this.sourceError=!1,this.playbackError=!1,this.mediaController=new NativeMediaController(this,{onEvent:event=>this.onNativeMediaEvent(event)}),this.semanticInternals=attachInternalsSafely(this),this.lastTimeChangeAt=0,this.searchLocale="",this.transcriptLocale="",this.searchMatchIndices=new Set,this.cueKeys=[],this.waveformVisible=!1,this.waveformDirty=!1,this.pendingSeekEmission=null,this.lastEmittedTime=null,this.lastReportedSourceError=NO_REPORTED_ERROR,this.connectionEventBaselinePending=!0,this.onMediaFocus=event=>{relayNativeEvent(this,event)},this.onMediaBlur=event=>{relayNativeEvent(this,event)},this.onWindowResize=()=>this.drawWaveform(),this.canvasRef=el=>{if(!el){this.unbindWaveformResizeObserver();return}this.syncWaveformVisibilityObserver(),this.syncWaveformResizeObserver(),this.drawWaveform()},this.mediaRef=el=>{const media=el?.localName==="audio"||el?.localName==="video"?el:void 0;this.mediaController.attach(media)},this.onPlaybackFailure=error=>{this.playbackError=!0,this.announceRenderError(),this.emit("lr-render-error",{error})},this.onHighlightActivate=(id,start)=>{this.activeHighlightId=id,this.seek(start),this.emit("lr-highlight-activate",{highlightId:id})},this.onTimelineClick=event=>{if(!this.duration)return;const rect=event.currentTarget.getBoundingClientRect();if(rect.width<=0)return;const ratio=Math.min(1,Math.max(0,(event.clientX-rect.left)/rect.width));this.seek(ratio*this.duration)},this.onTimelineKeyDown=event=>{if(!(this.duration>0))return;const delta=event.shiftKey?15:5;switch(event.key){case"ArrowLeft":event.preventDefault(),this.seek(Math.max(0,this.currentTime-delta));break;case"ArrowRight":event.preventDefault(),this.seek(Math.min(this.duration,this.currentTime+delta));break;case"Home":event.preventDefault(),this.seek(0);break;case"End":event.preventDefault(),this.seek(this.duration);break;case" ":event.preventDefault(),this.toggle();break;default:return}},this.cueKey=(_cue,index)=>this.cueKeys[index]??`index:${index}`,this.renderCue=(cue,index)=>{const c=cue,start=this.safeCueStart(c),isActive=this.activeCueIndex===index,isMatch=this.searchMatchIndices.has(index),isActiveMatch=index===this.searchMatches[this.activeSearchIndex],part=["cue",isActive?"cue-current":"",isMatch?"cue-match":"",isActiveMatch?"cue-active-match":""].filter(Boolean).join(" ");return html`<button
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{keyed}from"lit/directives/keyed.js";import{ref}from"lit/directives/ref.js";import{LyraElement}from"../../../internal/lyra-element.js";import{DocumentAnchorTarget}from"../../../internal/anchor-target.js";import{MAX_NATIVE_PLAYBACK_RATE as MAX_PLAYBACK_RATE,MIN_NATIVE_PLAYBACK_RATE as MIN_PLAYBACK_RATE,NativeMediaController,safeNativeMediaSource as safeMediaSrc}from"../../../internal/media-controller.js";import{hostAriaLabel,srOnly}from"../../../internal/a11y.js";import{finiteNumber,finiteRange}from"../../../internal/numbers.js";import{attachInternalsSafely}from"../../../internal/form-associated.js";import{chevronIcon}from"../../../internal/icons.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{ThemeWatcher}from"../../../internal/theme-watcher.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{styles}from"./av-player.styles.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{resolveBoundedCanvasAllocation}from"../../../internal/canvas.js";import{EMPTY_LYRA_AV_CUES,EMPTY_LYRA_AV_TRACKS,snapshotLyraAvCues,snapshotLyraAvTracks}from"./av-metadata.js";import{LYRA_DEFAULT_anchorJumped,LYRA_DEFAULT_anchorJumpedToPage,LYRA_DEFAULT_anchorNotFound,LYRA_DEFAULT_avPlayerFailedToLoad,LYRA_DEFAULT_avPlayerLabel,LYRA_DEFAULT_avPlayerPlaybackRate,LYRA_DEFAULT_avPlayerPosition,LYRA_DEFAULT_avPlayerRateOption,LYRA_DEFAULT_avPlayerTimeline,LYRA_DEFAULT_avPlayerTranscript,LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_viewerHighlightLabel}from"../../../internal/default-strings.generated.js";const TIME_CHANGE_THROTTLE_MS=250,MAX_AV_RATES=32,MAX_AV_PEAKS=65536,MAX_CANVAS_DIMENSION=4096,MAX_CANVAS_PIXELS=8388608,OWNED_AV_COLLECTIONS=new WeakSet,NO_REPORTED_ERROR=Symbol("no-reported-av-error");function ownedSnapshot(values){const snapshot=Object.freeze(values);return OWNED_AV_COLLECTIONS.add(snapshot),snapshot}const EMPTY_RATES=ownedSnapshot([]),DEFAULT_RATES=ownedSnapshot([.75,1,1.25,1.5,2]),EMPTY_CUES=EMPTY_LYRA_AV_CUES,EMPTY_PEAKS=ownedSnapshot([]),EMPTY_TRACKS=EMPTY_LYRA_AV_TRACKS;function normalizeArray(value,limit,normalize,fallback){try{if(!Array.isArray(value))return fallback;if(OWNED_AV_COLLECTIONS.has(value))return value;const result=[],length=Math.min(value.length,limit);for(let index=0;index<length;index++)try{const normalized=normalize(value[index],index);normalized!==void 0&&result.push(normalized)}catch{}return ownedSnapshot(result)}catch{return fallback}}function normalizeRates(value){const seen=new Set;return normalizeArray(value,MAX_AV_RATES,candidate=>{if(!(typeof candidate!="number"||!Number.isFinite(candidate)||candidate<MIN_PLAYBACK_RATE||candidate>MAX_PLAYBACK_RATE||seen.has(candidate)))return seen.add(candidate),candidate},EMPTY_RATES)}function normalizePeaks(value){return normalizeArray(value,MAX_AV_PEAKS,candidate=>typeof candidate=="number"?finiteRange(candidate,0,0,1):void 0,EMPTY_PEAKS)}function positiveFinite(value){const finite=finiteNumber(value,1);return finite>0?finite:1}function waveformPaintPeaks(peaks,maxBars){const barCount=Math.max(1,Math.floor(finiteNumber(maxBars,1)));if(peaks.length<=barCount)return peaks;const finalIndex=peaks.length-1;if(barCount===1)return[finiteRange(peaks[finalIndex],0,0,1)];const result=new Array(barCount),preEndpointBars=barCount-1;for(let barIndex=0;barIndex<preEndpointBars;barIndex+=1){const start=Math.floor(barIndex*finalIndex/preEndpointBars),end=Math.floor((barIndex+1)*finalIndex/preEndpointBars);let peak=0;for(let sampleIndex=start;sampleIndex<end;sampleIndex+=1)peak=Math.max(peak,finiteRange(peaks[sampleIndex],0,0,1));result[barIndex]=peak}return result[preEndpointBars]=finiteRange(peaks[finalIndex],0,0,1),result}function formatTime(seconds,locale){const total=Math.round(finiteRange(seconds,0,0)),h=Math.floor(total/3600),m=Math.floor(total%3600/60),s=total%60,regular=getNumberFormat(locale,{maximumFractionDigits:0,useGrouping:!1}),padded=getNumberFormat(locale,{maximumFractionDigits:0,minimumIntegerDigits:2,useGrouping:!1}),mm=(h>0?padded:regular).format(m),ss=padded.format(s);return h>0?`${regular.format(h)}:${mm}:${ss}`:`${mm}:${ss}`}class LyraAvPlayerBase extends LyraElement{}class LyraAvPlayer extends DocumentAnchorTarget(LyraAvPlayerBase){static{this.defaultStrings={...super.defaultStrings,anchorJumped:LYRA_DEFAULT_anchorJumped,anchorJumpedToPage:LYRA_DEFAULT_anchorJumpedToPage,anchorNotFound:LYRA_DEFAULT_anchorNotFound,avPlayerFailedToLoad:LYRA_DEFAULT_avPlayerFailedToLoad,avPlayerLabel:LYRA_DEFAULT_avPlayerLabel,avPlayerPlaybackRate:LYRA_DEFAULT_avPlayerPlaybackRate,avPlayerPosition:LYRA_DEFAULT_avPlayerPosition,avPlayerRateOption:LYRA_DEFAULT_avPlayerRateOption,avPlayerTimeline:LYRA_DEFAULT_avPlayerTimeline,avPlayerTranscript:LYRA_DEFAULT_avPlayerTranscript,fieldRequired:LYRA_DEFAULT_fieldRequired,viewerHighlightLabel:LYRA_DEFAULT_viewerHighlightLabel}}static{this.styles=[LyraElement.styles,styles,srOnly]}static{this.properties={playbackRate:{type:Number,attribute:"playback-rate",reflect:!0,noAccessor:!0},volume:{type:Number,reflect:!0,noAccessor:!0}}}get playbackRate(){return this._playbackRate}set playbackRate(next){const old=this._playbackRate;this._playbackRate=finiteRange(next,1,MIN_PLAYBACK_RATE,MAX_PLAYBACK_RATE),this.requestUpdate("playbackRate",old)}get volume(){return this._volume}set volume(next){const old=this._volume;this._volume=finiteRange(next,1,0,1),this.requestUpdate("volume",old)}get rates(){return this._rates}set rates(value){const previous=this._rates;this._rates=normalizeRates(value),this.requestUpdate("rates",previous)}get cues(){return this._cues}set cues(value){const previous=this._cues;if(this._cues=snapshotLyraAvCues(value),this._cues!==previous){const starts=[...new Set(this._cues.map(cue=>cue.start))].sort((a,b)=>a-b);this.nextCueStarts=new Map;for(let index=0;index<starts.length;index+=1)this.nextCueStarts.set(starts[index],starts[index+1]??1/0)}this.requestUpdate("cues",previous)}get peaks(){return this._peaks}set peaks(value){const previous=this._peaks;this._peaks=normalizePeaks(value),this.requestUpdate("peaks",previous)}get tracks(){return this._tracks}set tracks(value){const previous=this._tracks;this._tracks=snapshotLyraAvTracks(value),this.requestUpdate("tracks",previous)}constructor(){super(),this.src="",this.name="",this.mimeType="",this.poster="",this.loop=!1,this.muted=!1,this.preload="metadata",this._playbackRate=1,this._volume=1,this._rates=DEFAULT_RATES,this._cues=EMPTY_CUES,this.nextCueStarts=new Map,this._peaks=EMPTY_PEAKS,this._tracks=EMPTY_TRACKS,this.anchorKinds=["time-range"],this.duration=0,this.currentTimeState=0,this.activeCueId=null,this.activeCueIndex=-1,this.searchQuery="",this.searchMatches=[],this.activeSearchIndex=-1,this.metadataLoaded=!1,this.sourceError=!1,this.playbackError=!1,this.mediaController=new NativeMediaController(this,{onEvent:event=>this.onNativeMediaEvent(event)}),this.semanticInternals=attachInternalsSafely(this),this.lastTimeChangeAt=0,this.searchLocale="",this.transcriptLocale="",this.searchMatchIndices=new Set,this.cueKeys=[],this.waveformVisible=!1,this.waveformDirty=!1,this.pendingSeekEmission=null,this.lastEmittedTime=null,this.lastReportedSourceError=NO_REPORTED_ERROR,this.connectionEventBaselinePending=!0,this.onMediaFocus=event=>{relayNativeEvent(this,event)},this.onMediaBlur=event=>{relayNativeEvent(this,event)},this.onWindowResize=()=>this.drawWaveform(),this.canvasRef=el=>{if(!el){this.unbindWaveformResizeObserver();return}this.syncWaveformVisibilityObserver(),this.syncWaveformResizeObserver(),this.drawWaveform()},this.mediaRef=el=>{const media=el?.localName==="audio"||el?.localName==="video"?el:void 0;this.mediaController.attach(media)},this.onPlaybackFailure=error=>{this.playbackError=!0,this.announceRenderError(),this.emit("lr-render-error",{error})},this.onHighlightActivate=(id,start)=>{this.activeHighlightId=id,this.seek(start),this.emit("lr-highlight-activate",{highlightId:id})},this.onTimelineClick=event=>{if(!this.duration)return;const rect=event.currentTarget.getBoundingClientRect();if(rect.width<=0)return;const ratio=Math.min(1,Math.max(0,(event.clientX-rect.left)/rect.width));this.seek(ratio*this.duration)},this.onTimelineKeyDown=event=>{if(!(this.duration>0))return;const delta=event.shiftKey?15:5;switch(event.key){case"ArrowLeft":event.preventDefault(),this.seek(Math.max(0,this.currentTime-delta));break;case"ArrowRight":event.preventDefault(),this.seek(Math.min(this.duration,this.currentTime+delta));break;case"Home":event.preventDefault(),this.seek(0);break;case"End":event.preventDefault(),this.seek(this.duration);break;case" ":event.preventDefault(),this.toggle();break;default:return}},this.cueKey=(_cue,index)=>this.cueKeys[index]??`index:${index}`,this.renderCue=(cue,index)=>{const c=cue,start=this.safeCueStart(c),isActive=this.activeCueIndex===index,isMatch=this.searchMatchIndices.has(index),isActiveMatch=index===this.searchMatches[this.activeSearchIndex],part=["cue",isActive?"cue-current":"",isMatch?"cue-match":"",isActiveMatch?"cue-active-match":""].filter(Boolean).join(" ");return html`<button
       part=${part}
       type="button"
       aria-current=${isActive?"true":"false"}
@@ -9,7 +9,7 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
       <span part="cue-time">${formatTime(start,this.effectiveLocale)}</span>
       ${c.speaker?html`<span part="cue-speaker">${c.speaker}</span>`:nothing}
       <span part="cue-text">${c.text}</span>
-    </button>`},this.transcriptRenderItem=this.renderCue,new ThemeWatcher(this,()=>{this.peaks.length>0&&this.drawWaveform()})}get mediaEl(){return this.mediaController.element}focus(options){this.mediaEl?.focus(options)}blur(){this.mediaEl?.blur()}click(){this.mediaEl?.click()}get currentTime(){return this.mediaController.currentTime}set currentTime(value){this.mediaController.currentTime=value,this.currentTimeState=this.mediaController.currentTime}detectedKind(){return this.kind==="audio"||this.kind==="video"?this.kind:this.mimeType.startsWith("audio/")?"audio":"video"}get effectivePreload(){return this.preload==="none"||this.preload==="auto"?this.preload:"metadata"}willUpdate(changed){super.willUpdate(changed),this.semanticInternals.role=hostAriaLabel(this)!==null?"region":null;const mayEmitConnectionTransition=this.isConnected&&!this.connectionEventBaselinePending,locale=this.effectiveLocale;let refreshTranscript=!1;if(changed.has("kind")&&this.kind!==void 0&&this.kind!=="audio"&&this.kind!=="video"&&(this.kind=void 0),changed.has("preload")&&this.preload!==this.effectivePreload&&(this.preload=this.effectivePreload),changed.has("cues")&&(this.rebuildCueKeys(),this.metadataLoaded&&this.reconcileActiveCue()),this.transcriptLocale!==locale&&(this.transcriptLocale=locale,refreshTranscript=!0),this.hasUpdated&&(changed.has("src")||changed.has("kind")||changed.has("mimeType"))&&(this.duration=0,this.currentTimeState=0,this.activeCueId=null,this.activeCueIndex=-1,this.metadataLoaded=!1,this.sourceError=!1,this.playbackError=!1,this.lastTimeChangeAt=0,this.pendingSeekEmission=null,this.lastEmittedTime=null,this.lastReportedSourceError=NO_REPORTED_ERROR,this.mediaController.startGeneration(),changed.has("src")&&this.src&&!safeMediaSrc(this.src))){const error=new TypeError("The media source URL is not allowed.");mayEmitConnectionTransition&&(this.announceRenderError(),this.emit("lr-render-error",{error}))}this.searchQuery&&(changed.has("cues")||this.searchLocale!==locale)&&(this.reconcileSearchMatches(changed.get("cues")),refreshTranscript=!0),refreshTranscript&&this.refreshTranscriptRenderItem()}updated(changed){super.updated(changed),changed.has("playbackRate")&&(this.mediaController.playbackRate=this.playbackRate,changed.get("playbackRate")!==void 0&&this.emit("lr-rate-change",{rate:this.playbackRate})),changed.has("volume")&&(this.mediaController.volume=this.volume),changed.has("muted")&&(this.mediaController.muted=this.muted),changed.has("peaks")&&(this.syncWaveformVisibilityObserver(),this.syncWaveformResizeObserver(),this.drawWaveform()),this.isConnected&&(this.connectionEventBaselinePending=!1)}connectedCallback(){super.connectedCallback(),this.connectionEventBaselinePending=!0,this.syncErrorAnnouncementSink(),this.mediaController.reconnect(),this.bindResizeWindow(),this.syncWaveformVisibilityObserver(),this.syncWaveformResizeObserver(),this.waveformDirty&&this.drawWaveform(),this.requestUpdate()}firstUpdated(changed){super.firstUpdated(changed),this.drawWaveform()}disconnectedCallback(){this.connectionEventBaselinePending=!0,this.mediaController.disconnect(),this.releaseErrorAnnouncementSink(),this.unbindResizeWindow(),this.unbindWaveformResizeObserver(),this.cancelWaveformDrawFrame(),this.waveformDetachedObserverWindow=this.waveformObserverWindow,this.unbindWaveformVisibilityObserver(),this.waveformDirty=this.peaks.length>0,super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.releaseErrorAnnouncementSink(),this.syncErrorAnnouncementSink(),this.bindResizeWindow(),this.syncWaveformVisibilityObserver(),this.syncWaveformResizeObserver(),this.isConnected&&this.waveformDirty&&this.drawWaveform()}syncErrorAnnouncementSink(){this.isConnected&&this.errorAnnouncementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseErrorAnnouncementSink(),this.errorAnnouncementSink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseErrorAnnouncementSink(){this.errorAnnouncementSink?.release(),this.errorAnnouncementSink=void 0}announceRenderError(){this.errorAnnouncementSink?.announce(this.localize("avPlayerFailedToLoad"))}bindResizeWindow(){const nextWindow=this.isConnected?this.ownerDocument.defaultView:null;this.resizeWindow!==nextWindow&&(this.unbindResizeWindow(),this.resizeWindow=nextWindow??void 0,this.resizeWindow?.addEventListener("resize",this.onWindowResize))}unbindResizeWindow(){this.resizeWindow?.removeEventListener("resize",this.onWindowResize),this.resizeWindow=void 0}syncWaveformVisibilityObserver(){const owner=this.isConnected&&this.peaks.length>0?this.ownerDocument.defaultView:null;if(this.waveformIntersectionObserver&&this.waveformObserverWindow===owner)return;const needsFreshSameRealmVisibility=owner!==null&&this.waveformDetachedObserverWindow===owner;if(owner!==null&&(this.waveformDetachedObserverWindow=void 0),this.cancelWaveformDrawFrame(),this.unbindWaveformVisibilityObserver(),!owner)return;const IntersectionObserverCtor=owner.IntersectionObserver;if(!IntersectionObserverCtor){this.waveformVisible=!0;return}needsFreshSameRealmVisibility&&(this.waveformVisible=!1),this.waveformDirty=!0;let observer;observer=new IntersectionObserverCtor(entries=>{if(!this.isConnected||this.ownerDocument.defaultView!==owner||this.waveformIntersectionObserver!==observer)return;const entry=entries.find(candidate=>candidate.target===this);!entry||entry.isIntersecting===this.waveformVisible||(this.waveformVisible=entry.isIntersecting,this.waveformVisible?this.waveformDirty&&this.scheduleWaveformDraw():this.cancelWaveformDrawFrame())}),this.waveformObserverWindow=owner,this.waveformIntersectionObserver=observer,observer.observe(this)}unbindWaveformVisibilityObserver(){this.waveformIntersectionObserver?.disconnect(),this.waveformIntersectionObserver=void 0,this.waveformObserverWindow=void 0}syncWaveformResizeObserver(){const target=this.isConnected&&this.peaks.length>0?this.canvasEl:void 0,owner=target?.ownerDocument.defaultView;if(target&&owner&&this.waveformResizeObserver&&this.waveformResizeObserverWindow===owner&&this.waveformResizeTarget===target||(this.unbindWaveformResizeObserver(),!target||!owner||typeof owner.ResizeObserver!="function"))return;let observer;observer=new owner.ResizeObserver(entries=>{if(!this.isConnected||this.ownerDocument.defaultView!==owner||this.waveformResizeObserver!==observer||this.waveformResizeTarget!==target||!entries.some(entry=>entry.target===target))return;const width=positiveFinite(target.clientWidth),height=positiveFinite(target.clientHeight),dpr=positiveFinite(owner.devicePixelRatio),previous=this.lastWaveformAllocation;previous?.target===target&&previous.width===width&&previous.height===height&&previous.dpr===dpr||this.drawWaveform()}),this.waveformResizeObserver=observer,this.waveformResizeObserverWindow=owner,this.waveformResizeTarget=target,observer.observe(target)}unbindWaveformResizeObserver(){this.waveformResizeObserver?.disconnect(),this.waveformResizeObserver=void 0,this.waveformResizeObserverWindow=void 0,this.waveformResizeTarget=void 0,this.lastWaveformAllocation=void 0}play(){return this.mediaController.play()}pause(){this.mediaController.pause()}toggle(){const media=this.mediaEl;if(media?.paused){const generation=this.mediaController.generation;this.play().catch(error=>{!this.isConnected||!this.mediaController.isCurrentGeneration(generation,media)||this.onPlaybackFailure(error)})}else this.pause()}seek(seconds){this.currentTime=seconds,this.emitTimeChange(!0,!0),this.pendingSeekEmission=this.currentTimeState,this.reconcileActiveCue()}async applyAnchor(anchor){return anchor.kind!=="time-range"||!this.metadataLoaded?!1:(this.seek(anchor.start),!0)}onLoadedMetadata(){this.metadataLoaded=!0,this.duration=this.mediaController.duration,this.currentTimeState=this.mediaController.currentTime,this.sourceError=!1,this.playbackError=!1,this.lastReportedSourceError=NO_REPORTED_ERROR,this.reconcileActiveCue(),this.emit("lr-load",{duration:this.duration,kind:this.detectedKind()})}onPlay(){this.playbackError=!1,this.emit("lr-play",null)}onPause(){this.emit("lr-pause",null)}onMediaError(){const error=this.mediaEl?.error??null,identity=error??"native-media-error-without-detail";identity!==this.lastReportedSourceError&&(this.lastReportedSourceError=identity,this.sourceError=!0,this.playbackError=!1,this.announceRenderError(),this.emit("lr-render-error",{error:error??new Error("The media failed to load.")}))}onNativeMediaEvent(event){switch(event.type){case"loadedmetadata":this.onLoadedMetadata();break;case"durationchange":this.duration=this.mediaController.duration,this.reconcileActiveCue();break;case"play":this.onPlay();break;case"pause":this.onPause();break;case"error":this.onMediaError();break;case"volumechange":{const nextVolume=this.mediaController.volume,nextMuted=this.mediaController.muted;this.volume!==nextVolume&&(this.volume=nextVolume),this.muted!==nextMuted&&(this.muted=nextMuted);break}case"ratechange":{const nextRate=this.mediaController.playbackRate;this.playbackRate!==nextRate&&(this.playbackRate=nextRate);break}case"timeupdate":this.onTimeUpdate();break;case"seeked":this.onSeeked();break;default:break}}emitTimeChange(force,allowDuplicate=!1){const now=Date.now();if(!force&&now-this.lastTimeChangeAt<TIME_CHANGE_THROTTLE_MS)return;const nextTime=this.currentTime;this.currentTimeState=nextTime,!(!allowDuplicate&&nextTime===this.lastEmittedTime)&&(this.lastTimeChangeAt=now,this.lastEmittedTime=nextTime,this.emit("lr-time-change",{currentTime:this.currentTimeState}))}onTimeUpdate(){this.emitTimeChange(!1),this.reconcileActiveCue()}reconcileActiveCue(){const time=this.currentTime;let active,activeIndex=-1;this.cues.forEach((cue,index)=>{const start=this.safeCueStart(cue),end=this.safeCueEnd(cue,start,index);time>=start&&time<end&&(!active||start>=this.safeCueStart(active))&&(active=cue,activeIndex=index)});const nextId=active?.cueId??null;this.setActiveCue(nextId,activeIndex)}setActiveCue(nextId,activeIndex){(nextId!==this.activeCueId||activeIndex!==this.activeCueIndex)&&(this.activeCueId=nextId,this.activeCueIndex=activeIndex,this.emit("lr-cue-change",Object.freeze({cueId:nextId,index:activeIndex})))}onSeeked(){const completedTime=this.currentTime;this.pendingSeekEmission===null||completedTime!==this.pendingSeekEmission?this.emitTimeChange(!0):this.currentTimeState=completedTime,this.pendingSeekEmission=null,this.reconcileActiveCue()}async search(query2){return this.searchQuery=query2,this.reconcileSearchMatches(),this.activeSearchIndex=this.searchMatches.length?0:-1,this.refreshTranscriptRenderItem(),this.emitSearchChange(),await this.revealActiveSearchMatch(),this.searchMatches.length}reconcileSearchMatches(previousCues){const locale=this.effectiveLocale,q=this.searchQuery.trim().toLocaleLowerCase(locale),previousMatchIndex=this.searchMatches[this.activeSearchIndex],previousActiveId=previousCues&&previousMatchIndex!==void 0?previousCues[previousMatchIndex]?.cueId:void 0;if(this.searchMatches=q?this.cues.reduce((acc,cue,index)=>((cue.text.toLocaleLowerCase(locale).includes(q)||(cue.speaker??"").toLocaleLowerCase(locale).includes(q))&&acc.push(index),acc),[]):[],this.searchMatchIndices=new Set(this.searchMatches),this.searchLocale=locale,!this.searchMatches.length){this.activeSearchIndex=-1;return}const retainedPosition=previousActiveId?this.searchMatches.findIndex(index=>this.cues[index]?.cueId===previousActiveId):-1;this.activeSearchIndex=retainedPosition>=0?retainedPosition:Math.min(Math.max(0,this.activeSearchIndex),this.searchMatches.length-1)}async searchNext(){return this.searchMatches.length?(this.activeSearchIndex=(this.activeSearchIndex+1)%this.searchMatches.length,this.refreshTranscriptRenderItem(),this.emitSearchChange(),await this.revealActiveSearchMatch(),!0):!1}async searchPrevious(){return this.searchMatches.length?(this.activeSearchIndex=(this.activeSearchIndex-1+this.searchMatches.length)%this.searchMatches.length,this.refreshTranscriptRenderItem(),this.emitSearchChange(),await this.revealActiveSearchMatch(),!0):!1}clearSearch(){this.searchQuery="",this.searchMatches=[],this.searchMatchIndices=new Set,this.activeSearchIndex=-1,this.refreshTranscriptRenderItem(),this.emitSearchChange()}emitSearchChange(){this.emit("lr-search-change",{query:this.searchQuery,matchCount:this.searchMatches.length,matchCountExact:!0,activeIndex:this.activeSearchIndex})}async revealActiveSearchMatch(){await this.updateComplete;const list=this.renderRoot.querySelector("lr-virtual-list");if(!list)return;await list.updateComplete;const index=this.searchMatches[this.activeSearchIndex];index!==void 0&&list.scrollToIndex(index,{align:"auto",behavior:"auto"})}drawWaveform(){const canvas=this.canvasEl,ownerWindow=this.ownerDocument.defaultView;if(!this.peaks.length){this.waveformDirty=!1;return}if(!this.isConnected||!canvas||!ownerWindow||!this.waveformVisible){this.waveformDirty=!0;return}this.cancelWaveformDrawFrame(),this.waveformDirty=!1,this.paintWaveform()}paintWaveform(){const canvas=this.canvasEl;if(!canvas||!this.peaks.length)return;const ownerWindow=this.ownerDocument.defaultView;if(!ownerWindow)return;const dpr=positiveFinite(ownerWindow.devicePixelRatio),width=positiveFinite(canvas.clientWidth),height=positiveFinite(canvas.clientHeight),allocation=resolveBoundedCanvasAllocation({cssWidth:width,cssHeight:height,desiredScale:dpr,maxDimension:MAX_CANVAS_DIMENSION,maxPixels:MAX_CANVAS_PIXELS});this.lastWaveformAllocation={target:canvas,width,height,dpr},canvas.width=allocation.pixelWidth,canvas.height=allocation.pixelHeight;const ctx=canvas.getContext("2d");if(!ctx)return;const scaleX=allocation.scaleX,scaleY=allocation.scaleY;ctx.setTransform(scaleX,0,0,scaleY,0,0),ctx.clearRect(0,0,width,height);const computed=ownerWindow.getComputedStyle(this),tokenColor=computed.getPropertyValue("--lr-color-brand").trim(),color=ownerWindow.CSS.supports("color",tokenColor)?tokenColor:computed.color;ctx.fillStyle=color;const peaks=waveformPaintPeaks(this.peaks,canvas.width),barWidth=width/peaks.length,physicalPixel=Math.min(barWidth,finiteNumber(1/scaleX,barWidth)),paintedBarWidth=Math.max(physicalPixel,barWidth-physicalPixel);peaks.forEach((peak,i)=>{const barHeight=Math.max(1,finiteRange(peak,0,0,1)*height);ctx.fillRect(i*barWidth,(height-barHeight)/2,paintedBarWidth,barHeight)})}scheduleWaveformDraw(){if(this.waveformDrawFrame)return;const owner=this.ownerDocument.defaultView;if(!owner||!this.isConnected)return;const request={owner,handle:0};request.handle=owner.requestAnimationFrame(()=>{this.waveformDrawFrame===request&&(this.waveformDrawFrame=void 0,this.isConnected&&this.ownerDocument.defaultView===owner&&this.drawWaveform())}),this.waveformDrawFrame=request}cancelWaveformDrawFrame(){const request=this.waveformDrawFrame;request&&request.owner.cancelAnimationFrame(request.handle),this.waveformDrawFrame=void 0}renderMarkers(){if(!this.duration)return nothing;const ranged=this.highlights.filter(h=>h.anchor.kind==="time-range");return ranged.length?html`${ranged.map(h=>{const startSeconds=finiteRange(h.anchor.start,0,0,this.duration),endSeconds=h.anchor.end==null?startSeconds:finiteRange(h.anchor.end,startSeconds,startSeconds,this.duration),start=startSeconds/this.duration*100,end=endSeconds/this.duration*100;return html`<button
+    </button>`},this.transcriptRenderItem=this.renderCue,new ThemeWatcher(this,()=>{this.peaks.length>0&&this.drawWaveform()})}get mediaEl(){return this.mediaController.element}focus(options){this.mediaEl?.focus(options)}blur(){this.mediaEl?.blur()}click(){this.mediaEl?.click()}get currentTime(){return this.mediaController.currentTime}set currentTime(value){this.mediaController.currentTime=value,this.currentTimeState=this.mediaController.currentTime}detectedKind(){return this.kind==="audio"||this.kind==="video"?this.kind:(this.mimeType??"").startsWith("audio/")?"audio":"video"}get effectivePreload(){return this.preload==="none"||this.preload==="auto"?this.preload:"metadata"}willUpdate(changed){super.willUpdate(changed),this.semanticInternals.role=hostAriaLabel(this)!==null?"region":null;const mayEmitConnectionTransition=this.isConnected&&!this.connectionEventBaselinePending,locale=this.effectiveLocale;let refreshTranscript=!1;if(changed.has("kind")&&this.kind!==void 0&&this.kind!=="audio"&&this.kind!=="video"&&(this.kind=void 0),changed.has("preload")&&this.preload!==this.effectivePreload&&(this.preload=this.effectivePreload),changed.has("cues")&&(this.rebuildCueKeys(),this.metadataLoaded&&this.reconcileActiveCue()),this.transcriptLocale!==locale&&(this.transcriptLocale=locale,refreshTranscript=!0),this.hasUpdated&&(changed.has("src")||changed.has("kind")||changed.has("mimeType"))&&(this.duration=0,this.currentTimeState=0,this.activeCueId=null,this.activeCueIndex=-1,this.metadataLoaded=!1,this.sourceError=!1,this.playbackError=!1,this.lastTimeChangeAt=0,this.pendingSeekEmission=null,this.lastEmittedTime=null,this.lastReportedSourceError=NO_REPORTED_ERROR,this.mediaController.startGeneration(),changed.has("src")&&this.src&&!safeMediaSrc(this.src))){const error=new TypeError("The media source URL is not allowed.");mayEmitConnectionTransition&&(this.announceRenderError(),this.emit("lr-render-error",{error}))}this.searchQuery&&(changed.has("cues")||this.searchLocale!==locale)&&(this.reconcileSearchMatches(changed.get("cues")),refreshTranscript=!0),refreshTranscript&&this.refreshTranscriptRenderItem()}updated(changed){super.updated(changed),changed.has("playbackRate")&&(this.mediaController.playbackRate=this.playbackRate,changed.get("playbackRate")!==void 0&&this.emit("lr-rate-change",{rate:this.playbackRate})),changed.has("volume")&&(this.mediaController.volume=this.volume),changed.has("muted")&&(this.mediaController.muted=this.muted),changed.has("peaks")&&(this.syncWaveformVisibilityObserver(),this.syncWaveformResizeObserver(),this.drawWaveform()),this.isConnected&&(this.connectionEventBaselinePending=!1)}connectedCallback(){super.connectedCallback(),this.connectionEventBaselinePending=!0,this.syncErrorAnnouncementSink(),this.mediaController.reconnect(),this.bindResizeWindow(),this.syncWaveformVisibilityObserver(),this.syncWaveformResizeObserver(),this.waveformDirty&&this.drawWaveform(),this.requestUpdate()}firstUpdated(changed){super.firstUpdated(changed),this.drawWaveform()}disconnectedCallback(){this.connectionEventBaselinePending=!0,this.mediaController.disconnect(),this.releaseErrorAnnouncementSink(),this.unbindResizeWindow(),this.unbindWaveformResizeObserver(),this.cancelWaveformDrawFrame(),this.waveformDetachedObserverWindow=this.waveformObserverWindow,this.unbindWaveformVisibilityObserver(),this.waveformDirty=this.peaks.length>0,super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.releaseErrorAnnouncementSink(),this.syncErrorAnnouncementSink(),this.bindResizeWindow(),this.syncWaveformVisibilityObserver(),this.syncWaveformResizeObserver(),this.isConnected&&this.waveformDirty&&this.drawWaveform()}syncErrorAnnouncementSink(){this.isConnected&&this.errorAnnouncementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseErrorAnnouncementSink(),this.errorAnnouncementSink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseErrorAnnouncementSink(){this.errorAnnouncementSink?.release(),this.errorAnnouncementSink=void 0}announceRenderError(){this.errorAnnouncementSink?.announce(this.localize("avPlayerFailedToLoad"))}bindResizeWindow(){const nextWindow=this.isConnected?this.ownerDocument.defaultView:null;this.resizeWindow!==nextWindow&&(this.unbindResizeWindow(),this.resizeWindow=nextWindow??void 0,this.resizeWindow?.addEventListener("resize",this.onWindowResize))}unbindResizeWindow(){this.resizeWindow?.removeEventListener("resize",this.onWindowResize),this.resizeWindow=void 0}syncWaveformVisibilityObserver(){const owner=this.isConnected&&this.peaks.length>0?this.ownerDocument.defaultView:null;if(this.waveformIntersectionObserver&&this.waveformObserverWindow===owner)return;const needsFreshSameRealmVisibility=owner!==null&&this.waveformDetachedObserverWindow===owner;if(owner!==null&&(this.waveformDetachedObserverWindow=void 0),this.cancelWaveformDrawFrame(),this.unbindWaveformVisibilityObserver(),!owner)return;const IntersectionObserverCtor=owner.IntersectionObserver;if(!IntersectionObserverCtor){this.waveformVisible=!0;return}needsFreshSameRealmVisibility&&(this.waveformVisible=!1),this.waveformDirty=!0;let observer;observer=new IntersectionObserverCtor(entries=>{if(!this.isConnected||this.ownerDocument.defaultView!==owner||this.waveformIntersectionObserver!==observer)return;const entry=entries.find(candidate=>candidate.target===this);!entry||entry.isIntersecting===this.waveformVisible||(this.waveformVisible=entry.isIntersecting,this.waveformVisible?this.waveformDirty&&this.scheduleWaveformDraw():this.cancelWaveformDrawFrame())}),this.waveformObserverWindow=owner,this.waveformIntersectionObserver=observer,observer.observe(this)}unbindWaveformVisibilityObserver(){this.waveformIntersectionObserver?.disconnect(),this.waveformIntersectionObserver=void 0,this.waveformObserverWindow=void 0}syncWaveformResizeObserver(){const target=this.isConnected&&this.peaks.length>0?this.canvasEl:void 0,owner=target?.ownerDocument.defaultView;if(target&&owner&&this.waveformResizeObserver&&this.waveformResizeObserverWindow===owner&&this.waveformResizeTarget===target||(this.unbindWaveformResizeObserver(),!target||!owner||typeof owner.ResizeObserver!="function"))return;let observer;observer=new owner.ResizeObserver(entries=>{if(!this.isConnected||this.ownerDocument.defaultView!==owner||this.waveformResizeObserver!==observer||this.waveformResizeTarget!==target||!entries.some(entry=>entry.target===target))return;const width=positiveFinite(target.clientWidth),height=positiveFinite(target.clientHeight),dpr=positiveFinite(owner.devicePixelRatio),previous=this.lastWaveformAllocation;previous?.target===target&&previous.width===width&&previous.height===height&&previous.dpr===dpr||this.drawWaveform()}),this.waveformResizeObserver=observer,this.waveformResizeObserverWindow=owner,this.waveformResizeTarget=target,observer.observe(target)}unbindWaveformResizeObserver(){this.waveformResizeObserver?.disconnect(),this.waveformResizeObserver=void 0,this.waveformResizeObserverWindow=void 0,this.waveformResizeTarget=void 0,this.lastWaveformAllocation=void 0}play(){return this.mediaController.play()}pause(){this.mediaController.pause()}toggle(){const media=this.mediaEl;if(media?.paused){const generation=this.mediaController.generation;this.play().catch(error=>{!this.isConnected||!this.mediaController.isCurrentGeneration(generation,media)||this.onPlaybackFailure(error)})}else this.pause()}seek(seconds){this.currentTime=seconds,this.emitTimeChange(!0,!0),this.pendingSeekEmission=this.currentTimeState,this.reconcileActiveCue()}async applyAnchor(anchor){return anchor.kind!=="time-range"||!this.metadataLoaded?!1:(this.seek(anchor.start),!0)}onLoadedMetadata(){this.metadataLoaded=!0,this.duration=this.mediaController.duration,this.currentTimeState=this.mediaController.currentTime,this.sourceError=!1,this.playbackError=!1,this.lastReportedSourceError=NO_REPORTED_ERROR,this.reconcileActiveCue(),this.emit("lr-load",{duration:this.duration,kind:this.detectedKind()})}onPlay(){this.playbackError=!1,this.emit("lr-play",null)}onPause(){this.emit("lr-pause",null)}onMediaError(){const error=this.mediaEl?.error??null,identity=error??"native-media-error-without-detail";identity!==this.lastReportedSourceError&&(this.lastReportedSourceError=identity,this.sourceError=!0,this.playbackError=!1,this.announceRenderError(),this.emit("lr-render-error",{error:error??new Error("The media failed to load.")}))}onNativeMediaEvent(event){switch(event.type){case"loadedmetadata":this.onLoadedMetadata();break;case"durationchange":this.duration=this.mediaController.duration,this.reconcileActiveCue();break;case"play":this.onPlay();break;case"pause":this.onPause();break;case"error":this.onMediaError();break;case"volumechange":{const nextVolume=this.mediaController.volume,nextMuted=this.mediaController.muted;this.volume!==nextVolume&&(this.volume=nextVolume),this.muted!==nextMuted&&(this.muted=nextMuted);break}case"ratechange":{const nextRate=this.mediaController.playbackRate;this.playbackRate!==nextRate&&(this.playbackRate=nextRate);break}case"timeupdate":this.onTimeUpdate();break;case"seeked":this.onSeeked();break;default:break}}emitTimeChange(force,allowDuplicate=!1){const now=Date.now();if(!force&&now-this.lastTimeChangeAt<TIME_CHANGE_THROTTLE_MS)return;const nextTime=this.currentTime;this.currentTimeState=nextTime,!(!allowDuplicate&&nextTime===this.lastEmittedTime)&&(this.lastTimeChangeAt=now,this.lastEmittedTime=nextTime,this.emit("lr-time-change",{currentTime:this.currentTimeState}))}onTimeUpdate(){this.emitTimeChange(!1),this.reconcileActiveCue()}reconcileActiveCue(){const time=this.currentTime;let active,activeIndex=-1;this.cues.forEach((cue,index)=>{const start=this.safeCueStart(cue),end=this.safeCueEnd(cue,start);time>=start&&time<end&&(!active||start>=this.safeCueStart(active))&&(active=cue,activeIndex=index)});const nextId=active?.cueId??null;this.setActiveCue(nextId,activeIndex)}setActiveCue(nextId,activeIndex){(nextId!==this.activeCueId||activeIndex!==this.activeCueIndex)&&(this.activeCueId=nextId,this.activeCueIndex=activeIndex,this.emit("lr-cue-change",Object.freeze({cueId:nextId,index:activeIndex})))}onSeeked(){const completedTime=this.currentTime;this.pendingSeekEmission===null||completedTime!==this.pendingSeekEmission?this.emitTimeChange(!0):this.currentTimeState=completedTime,this.pendingSeekEmission=null,this.reconcileActiveCue()}async search(query2){return this.searchQuery=query2,this.reconcileSearchMatches(),this.activeSearchIndex=this.searchMatches.length?0:-1,this.refreshTranscriptRenderItem(),this.emitSearchChange(),await this.revealActiveSearchMatch(),this.searchMatches.length}reconcileSearchMatches(previousCues){const locale=this.effectiveLocale,q=this.searchQuery.trim().toLocaleLowerCase(locale),previousMatchIndex=this.searchMatches[this.activeSearchIndex],previousActiveId=previousCues&&previousMatchIndex!==void 0?previousCues[previousMatchIndex]?.cueId:void 0;if(this.searchMatches=q?this.cues.reduce((acc,cue,index)=>((cue.text.toLocaleLowerCase(locale).includes(q)||(cue.speaker??"").toLocaleLowerCase(locale).includes(q))&&acc.push(index),acc),[]):[],this.searchMatchIndices=new Set(this.searchMatches),this.searchLocale=locale,!this.searchMatches.length){this.activeSearchIndex=-1;return}const retainedPosition=previousActiveId?this.searchMatches.findIndex(index=>this.cues[index]?.cueId===previousActiveId):-1;this.activeSearchIndex=retainedPosition>=0?retainedPosition:Math.min(Math.max(0,this.activeSearchIndex),this.searchMatches.length-1)}async searchNext(){return this.searchMatches.length?(this.activeSearchIndex=(this.activeSearchIndex+1)%this.searchMatches.length,this.refreshTranscriptRenderItem(),this.emitSearchChange(),await this.revealActiveSearchMatch(),!0):!1}async searchPrevious(){return this.searchMatches.length?(this.activeSearchIndex=(this.activeSearchIndex-1+this.searchMatches.length)%this.searchMatches.length,this.refreshTranscriptRenderItem(),this.emitSearchChange(),await this.revealActiveSearchMatch(),!0):!1}clearSearch(){this.searchQuery="",this.searchMatches=[],this.searchMatchIndices=new Set,this.activeSearchIndex=-1,this.refreshTranscriptRenderItem(),this.emitSearchChange()}emitSearchChange(){this.emit("lr-search-change",{query:this.searchQuery,matchCount:this.searchMatches.length,matchCountExact:!0,activeIndex:this.activeSearchIndex})}async revealActiveSearchMatch(){await this.updateComplete;const list=this.renderRoot.querySelector("lr-virtual-list");if(!list)return;await list.updateComplete;const index=this.searchMatches[this.activeSearchIndex];index!==void 0&&list.scrollToIndex(index,{align:"auto",behavior:"auto"})}drawWaveform(){const canvas=this.canvasEl,ownerWindow=this.ownerDocument.defaultView;if(!this.peaks.length){this.waveformDirty=!1;return}if(!this.isConnected||!canvas||!ownerWindow||!this.waveformVisible){this.waveformDirty=!0;return}this.cancelWaveformDrawFrame(),this.waveformDirty=!1,this.paintWaveform()}paintWaveform(){const canvas=this.canvasEl;if(!canvas||!this.peaks.length)return;const ownerWindow=this.ownerDocument.defaultView;if(!ownerWindow)return;const dpr=positiveFinite(ownerWindow.devicePixelRatio),width=positiveFinite(canvas.clientWidth),height=positiveFinite(canvas.clientHeight),allocation=resolveBoundedCanvasAllocation({cssWidth:width,cssHeight:height,desiredScale:dpr,maxDimension:MAX_CANVAS_DIMENSION,maxPixels:MAX_CANVAS_PIXELS});this.lastWaveformAllocation={target:canvas,width,height,dpr},canvas.width=allocation.pixelWidth,canvas.height=allocation.pixelHeight;const ctx=canvas.getContext("2d");if(!ctx)return;const scaleX=allocation.scaleX,scaleY=allocation.scaleY;ctx.setTransform(scaleX,0,0,scaleY,0,0),ctx.clearRect(0,0,width,height);const computed=ownerWindow.getComputedStyle(this),tokenColor=computed.getPropertyValue("--lr-color-brand").trim(),color=ownerWindow.CSS.supports("color",tokenColor)?tokenColor:computed.color;ctx.fillStyle=color;const peaks=waveformPaintPeaks(this.peaks,canvas.width),barWidth=width/peaks.length,physicalPixel=Math.min(barWidth,finiteNumber(1/scaleX,barWidth)),paintedBarWidth=Math.max(physicalPixel,barWidth-physicalPixel);peaks.forEach((peak,i)=>{const barHeight=Math.max(1,finiteRange(peak,0,0,1)*height);ctx.fillRect(i*barWidth,(height-barHeight)/2,paintedBarWidth,barHeight)})}scheduleWaveformDraw(){if(this.waveformDrawFrame)return;const owner=this.ownerDocument.defaultView;if(!owner||!this.isConnected)return;const request={owner,handle:0};request.handle=owner.requestAnimationFrame(()=>{this.waveformDrawFrame===request&&(this.waveformDrawFrame=void 0,this.isConnected&&this.ownerDocument.defaultView===owner&&this.drawWaveform())}),this.waveformDrawFrame=request}cancelWaveformDrawFrame(){const request=this.waveformDrawFrame;request&&request.owner.cancelAnimationFrame(request.handle),this.waveformDrawFrame=void 0}renderMarkers(){if(!this.duration)return nothing;const ranged=this.highlights.filter(h=>h.anchor.kind==="time-range");return ranged.length?html`${ranged.map(h=>{const startSeconds=finiteRange(h.anchor.start,0,0,this.duration),endSeconds=h.anchor.end==null?startSeconds:finiteRange(h.anchor.end,startSeconds,startSeconds,this.duration),start=startSeconds/this.duration*100,end=endSeconds/this.duration*100;return html`<button
         part="timeline-marker"
         type="button"
         data-tone=${h.tone??"accent"}
@@ -17,7 +17,7 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
         style="inset-inline-start:${start}%;inline-size:${Math.max(.5,end-start)}%"
         aria-label=${h.label||this.localize("viewerHighlightLabel")}
         @click=${event=>{event.stopPropagation(),this.onHighlightActivate(h.id,h.anchor.start)}}
-      ></button>`})}`:nothing}rateOptions(){const validRates=[...new Set((Array.isArray(this.rates)?this.rates:[]).filter(rate=>Number.isFinite(rate)&&rate>=MIN_PLAYBACK_RATE&&rate<=MAX_PLAYBACK_RATE))];return validRates.includes(this.playbackRate)?validRates:[...validRates,this.playbackRate].sort((a,b)=>a-b)}safeCueStart(cue){const max=this.duration>0?this.duration:1/0;return finiteRange(cue.start,0,0,max)}safeCueEnd(cue,start,cueIndex){if(cue.end==null){let nextStart=1/0;return this.cues.forEach((candidate,index)=>{if(index===cueIndex)return;const candidateStart=this.safeCueStart(candidate);candidateStart>start&&candidateStart<nextStart&&(nextStart=candidateStart)}),nextStart}const max=this.duration>0?this.duration:1/0;return finiteRange(cue.end,start,start,max)}rebuildCueKeys(){this.cueKeys=this.cues.map(cue=>`cue:${cue.cueId.length}:${cue.cueId}`)}refreshTranscriptRenderItem(){this.transcriptRenderItem=(cue,index)=>this.renderCue(cue,index)}renderTracks(){return this.tracks.map(t=>{const trackSrc=safeMediaSrc(t.src);return trackSrc?html`<track src=${trackSrc} kind=${t.kind} srclang=${t.srclang} label=${t.label} ?default=${t.default} />`:nothing})}render(){const explicitHostLabel=hostAriaLabel(this),aggregateLabel=explicitHostLabel??(this.name||this.localize("avPlayerLabel")),safeSrc=this.src?safeMediaSrc(this.src):null,safePoster=this.poster?safeMediaSrc(this.poster):null,kind=this.detectedKind(),baseOwnsAggregate=explicitHostLabel===null&&!!(this.name||!safeSrc&&this.src),mediaLabel=explicitHostLabel===""?"":this.localize("avPlayerLabel");return!safeSrc&&this.src?html`<div
+      ></button>`})}`:nothing}rateOptions(){const validRates=[...new Set((Array.isArray(this.rates)?this.rates:[]).filter(rate=>Number.isFinite(rate)&&rate>=MIN_PLAYBACK_RATE&&rate<=MAX_PLAYBACK_RATE))];return validRates.includes(this.playbackRate)?validRates:[...validRates,this.playbackRate].sort((a,b)=>a-b)}safeCueStart(cue){const max=this.duration>0?this.duration:1/0;return finiteRange(cue.start,0,0,max)}safeCueEnd(cue,start){const max=this.duration>0?this.duration:1/0;if(cue.end==null){const nextStart=this.nextCueStarts.get(cue.start)??1/0;return start>=max||nextStart===1/0?1/0:Math.min(nextStart,max)}return finiteRange(cue.end,start,start,max)}rebuildCueKeys(){this.cueKeys=this.cues.map(cue=>`cue:${cue.cueId.length}:${cue.cueId}`)}refreshTranscriptRenderItem(){this.transcriptRenderItem=(cue,index)=>this.renderCue(cue,index)}renderTracks(){return this.tracks.map(t=>{const trackSrc=safeMediaSrc(t.src);return trackSrc?html`<track src=${trackSrc} kind=${t.kind} srclang=${t.srclang} label=${t.label} ?default=${t.default} />`:nothing})}render(){const explicitHostLabel=hostAriaLabel(this),aggregateLabel=explicitHostLabel??(this.name||this.localize("avPlayerLabel")),safeSrc=this.src?safeMediaSrc(this.src):null,safePoster=this.poster?safeMediaSrc(this.poster):null,kind=this.detectedKind(),baseOwnsAggregate=explicitHostLabel===null&&!!(this.name||!safeSrc&&this.src),mediaLabel=explicitHostLabel===""?"":this.localize("avPlayerLabel");return!safeSrc&&this.src?html`<div
         part="base"
         role=${baseOwnsAggregate?"region":nothing}
         aria-label=${baseOwnsAggregate?aggregateLabel:nothing}

package/dist/components/media/av-player/av-player.styles.js

@@ -1 +1 @@
-import{css}from"lit";const styles=css`:host{contain-intrinsic-inline-size:var(--lr-size-20rem);--_lr-av-player-transcript-height:var(--lr-size-16rem);min-inline-size:0;display:block;container-type:inline-size}[part=base]{gap:var(--lr-space-s);flex-direction:column;min-inline-size:0;max-inline-size:100%;display:flex}[part=media]{border-radius:var(--lr-radius);background:var(--lr-color-surface-raised);inline-size:100%}[part=toolbar]{align-items:center;gap:var(--lr-space-xs);flex-wrap:wrap;display:flex}.rate-select-wrapper{align-items:center;min-inline-size:0;max-inline-size:100%;display:inline-flex;position:relative}[part=rate-select]{appearance:none;inline-size:100%;min-inline-size:0;max-inline-size:100%;padding-inline:var(--lr-space-s) var(--lr-space-l);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;overflow:hidden}@container (inline-size<=20rem){[part=rate-select]{max-inline-size:var(--lr-size-8rem)}}[part=rate-select] option{background:var(--lr-color-surface);color:var(--lr-color-text)}[part=rate-select]:hover{background:var(--lr-color-brand-quiet)}[part=rate-select]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=rate-select]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}.rate-select-chevron{color:var(--lr-color-text-quiet);line-height:var(--lr-line-height-none);pointer-events:none;display:inline-flex;position:absolute;inset-inline-end:var(--lr-space-xs)}.rate-select-chevron svg{transform:rotate(90deg)}.timeline-positioner{min-inline-size:0;max-inline-size:100%;position:relative}[part=timeline]{block-size:var(--lr-size-3rem);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);background:var(--lr-color-surface-raised);cursor:pointer;direction:ltr}[part=timeline]:hover{border-color:var(--lr-color-brand)}[part=timeline]:active{border-color:var(--lr-color-brand);background:color-mix(in oklab, var(--lr-color-surface-raised), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=timeline]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}[part=timeline][aria-disabled=true]{cursor:default}[part=timeline] canvas{block-size:100%;inline-size:100%;display:block}[part=timeline-marker]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);cursor:pointer;--_lr-av-player-marker-fill:var(--lr-av-player-marker-bg,color-mix(in srgb, var(--lr-color-brand) 35%, transparent));background:var(--lr-av-player-marker-fill,var(--_lr-av-player-marker-fill));border:none;padding:0;position:absolute;inset-block:0}.timeline-markers{pointer-events:none;direction:ltr;position:absolute;inset:0}.timeline-markers [part=timeline-marker]{pointer-events:auto}[part=timeline-marker]:hover{background:color-mix(in oklab, var(--lr-av-player-marker-fill,var(--_lr-av-player-marker-fill)), var(--lr-color-mix-partner) var(--lr-color-mix-hover))}[part=timeline-marker]:active{background:color-mix(in oklab, var(--lr-av-player-marker-fill,var(--_lr-av-player-marker-fill)), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=timeline-marker][data-tone=success]{--_lr-av-player-marker-fill:var(--lr-av-player-marker-success-bg,color-mix(in srgb, var(--lr-color-success) 35%, transparent))}[part=timeline-marker][data-tone=warning]{--_lr-av-player-marker-fill:var(--lr-av-player-marker-warning-bg,color-mix(in srgb, var(--lr-color-warning) 35%, transparent))}[part=timeline-marker][data-tone=danger]{--_lr-av-player-marker-fill:var(--lr-av-player-marker-danger-bg,color-mix(in srgb, var(--lr-color-danger) 35%, transparent))}[part=timeline-marker][data-tone=neutral]{--_lr-av-player-marker-fill:var(--lr-av-player-marker-neutral-bg,color-mix(in srgb, var(--lr-color-text) 25%, transparent))}[part=timeline-marker][data-active]{outline:var(--lr-border-width-medium) solid var(--lr-av-player-marker-active-color,var(--lr-color-brand));outline-offset:calc(-1 * var(--lr-border-width-medium))}[part=timeline-marker]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}[part=transcript]{--lr-virtual-list-height:var(--lr-av-player-transcript-height,var(--_lr-av-player-transcript-height))}lr-virtual-list::part(cue){text-align:start;inline-size:100%;padding:var(--lr-space-xs) var(--lr-space-s);cursor:pointer;color:var(--lr-color-text);font:inherit;overflow-wrap:anywhere;background:0 0;border:none;min-inline-size:0;max-inline-size:100%;display:block}lr-virtual-list::part(cue):hover{background:var(--lr-color-brand-quiet)}lr-virtual-list::part(cue):active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}lr-virtual-list::part(cue-current){background:var(--lr-av-player-cue-current-bg,var(--lr-color-brand-quiet))}lr-virtual-list::part(cue-match){outline:var(--lr-border-width-thin) dashed var(--lr-color-warning)}lr-virtual-list::part(cue-active-match){outline:var(--lr-border-width-medium) solid var(--lr-av-player-cue-active-match-color,var(--lr-color-warning))}lr-virtual-list::part(cue):focus-visible{outline:var(--lr-focus-ring);outline-offset:calc(-1 * var(--lr-focus-ring-offset))}lr-virtual-list::part(cue-time){color:var(--lr-color-text);font-size:var(--lr-font-size-xs);margin-inline-end:var(--lr-space-2xs)}lr-virtual-list::part(cue-speaker){font-weight:var(--lr-font-weight-semibold);margin-inline-end:var(--lr-space-2xs)}lr-virtual-list::part(cue-speaker),lr-virtual-list::part(cue-text){overflow-wrap:anywhere;min-inline-size:0}[part=error]{color:var(--lr-color-danger);padding:var(--lr-space-l);text-align:center}@media (forced-colors:active){[part=rate-select]:hover{outline:var(--lr-border-width-thin) solid Highlight;border-style:double}[part=timeline-marker]{border:var(--lr-border-width-thin) solid CanvasText;forced-color-adjust:auto}[part=timeline-marker][data-tone=success]{border-style:double}[part=timeline-marker][data-tone=warning]{border-style:dashed}[part=timeline-marker][data-tone=danger]{border-style:dotted}[part=timeline-marker][data-tone=neutral]{outline:var(--lr-border-width-thin) dashed CanvasText;outline-offset:calc(-1 * var(--lr-border-width-medium));border-style:solid}[part=timeline-marker][data-active]{outline:var(--lr-border-width-medium) solid Highlight}}`;export{styles};
+import{css}from"lit";const styles=css`:host{contain-intrinsic-inline-size:var(--lr-size-20rem);--_lr-av-player-transcript-height:var(--lr-size-16rem);min-inline-size:0;display:block;container-type:inline-size}[part=base]{gap:var(--lr-space-s);flex-direction:column;min-inline-size:0;max-inline-size:100%;display:flex}[part=media]{border-radius:var(--lr-radius);background:var(--lr-color-surface-raised);inline-size:100%}[part=toolbar]{align-items:center;gap:var(--lr-space-xs);flex-wrap:wrap;display:flex}.rate-select-wrapper{align-items:center;min-inline-size:0;max-inline-size:100%;display:inline-flex;position:relative}[part=rate-select]{appearance:none;inline-size:100%;min-inline-size:0;max-inline-size:100%;padding-inline:var(--lr-space-s) var(--lr-space-l);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;overflow:hidden}@container (inline-size<=20rem){[part=rate-select]{max-inline-size:var(--lr-size-8rem)}}[part=rate-select] option{background:var(--lr-color-surface);color:var(--lr-color-text)}[part=rate-select]:hover{background:var(--lr-color-brand-quiet)}[part=rate-select]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=rate-select]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}.rate-select-chevron{color:var(--lr-color-text-quiet);line-height:var(--lr-line-height-none);pointer-events:none;display:inline-flex;position:absolute;inset-inline-end:var(--lr-space-xs)}.rate-select-chevron svg{transform:rotate(90deg)}.timeline-positioner{min-inline-size:0;max-inline-size:100%;position:relative}[part=timeline]{block-size:var(--lr-size-3rem);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);background:var(--lr-color-surface-raised);cursor:pointer;direction:ltr}[part=timeline]:hover:where(:not([aria-disabled=true])){border-color:var(--lr-color-brand)}[part=timeline]:active:where(:not([aria-disabled=true])){border-color:var(--lr-color-brand);background:color-mix(in oklab, var(--lr-color-surface-raised), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=timeline]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}[part=timeline][aria-disabled=true]{cursor:default}[part=timeline] canvas{block-size:100%;inline-size:100%;display:block}[part=timeline-marker]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);cursor:pointer;--_lr-av-player-marker-fill:var(--lr-av-player-marker-bg,color-mix(in srgb, var(--lr-color-brand) 35%, transparent));background:var(--lr-av-player-marker-fill,var(--_lr-av-player-marker-fill));border:none;padding:0;position:absolute;inset-block:0}.timeline-markers{pointer-events:none;direction:ltr;position:absolute;inset:0}.timeline-markers [part=timeline-marker]{pointer-events:auto}[part=timeline-marker]:hover{background:color-mix(in oklab, var(--lr-av-player-marker-fill,var(--_lr-av-player-marker-fill)), var(--lr-color-mix-partner) var(--lr-color-mix-hover))}[part=timeline-marker]:active{background:color-mix(in oklab, var(--lr-av-player-marker-fill,var(--_lr-av-player-marker-fill)), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=timeline-marker][data-tone=success]{--_lr-av-player-marker-fill:var(--lr-av-player-marker-success-bg,color-mix(in srgb, var(--lr-color-success) 35%, transparent))}[part=timeline-marker][data-tone=warning]{--_lr-av-player-marker-fill:var(--lr-av-player-marker-warning-bg,color-mix(in srgb, var(--lr-color-warning) 35%, transparent))}[part=timeline-marker][data-tone=danger]{--_lr-av-player-marker-fill:var(--lr-av-player-marker-danger-bg,color-mix(in srgb, var(--lr-color-danger) 35%, transparent))}[part=timeline-marker][data-tone=neutral]{--_lr-av-player-marker-fill:var(--lr-av-player-marker-neutral-bg,color-mix(in srgb, var(--lr-color-text) 25%, transparent))}[part=timeline-marker][data-active]{outline:var(--lr-border-width-medium) solid var(--lr-av-player-marker-active-color,var(--lr-color-brand));outline-offset:calc(-1 * var(--lr-border-width-medium))}[part=timeline-marker]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}[part=transcript]{--lr-virtual-list-height:var(--lr-av-player-transcript-height,var(--_lr-av-player-transcript-height))}lr-virtual-list::part(cue){text-align:start;inline-size:100%;padding:var(--lr-space-xs) var(--lr-space-s);cursor:pointer;color:var(--lr-color-text);font:inherit;overflow-wrap:anywhere;background:0 0;border:none;min-inline-size:0;max-inline-size:100%;display:block}lr-virtual-list::part(cue):hover{background:var(--lr-color-brand-quiet)}lr-virtual-list::part(cue):active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}lr-virtual-list::part(cue-current){background:var(--lr-av-player-cue-current-bg,var(--lr-color-brand-quiet))}lr-virtual-list::part(cue-match){outline:var(--lr-border-width-thin) dashed var(--lr-color-warning)}lr-virtual-list::part(cue-active-match){outline:var(--lr-border-width-medium) solid var(--lr-av-player-cue-active-match-color,var(--lr-color-warning))}lr-virtual-list::part(cue):focus-visible{outline:var(--lr-focus-ring);outline-offset:calc(-1 * var(--lr-focus-ring-offset))}lr-virtual-list::part(cue-time){color:var(--lr-color-text);font-size:var(--lr-font-size-xs);margin-inline-end:var(--lr-space-2xs)}lr-virtual-list::part(cue-speaker){font-weight:var(--lr-font-weight-semibold);margin-inline-end:var(--lr-space-2xs)}lr-virtual-list::part(cue-speaker),lr-virtual-list::part(cue-text){overflow-wrap:anywhere;min-inline-size:0}[part=error]{color:var(--lr-color-danger);padding:var(--lr-space-l);text-align:center}@media (forced-colors:active){[part=rate-select]:hover{outline:var(--lr-border-width-thin) solid Highlight;border-style:double}[part=timeline-marker]{border:var(--lr-border-width-thin) solid CanvasText;forced-color-adjust:auto}[part=timeline-marker][data-tone=success]{border-style:double}[part=timeline-marker][data-tone=warning]{border-style:dashed}[part=timeline-marker][data-tone=danger]{border-style:dotted}[part=timeline-marker][data-tone=neutral]{outline:var(--lr-border-width-thin) dashed CanvasText;outline-offset:calc(-1 * var(--lr-border-width-medium));border-style:solid}[part=timeline-marker][data-active]{outline:var(--lr-border-width-medium) solid Highlight}}`;export{styles};

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

@@ -44,7 +44,8 @@ initials:string;
 *  `image` to match `wa-avatar`; it used to be `src`, which a mechanical rename left unset —
 *  silently falling back to initials. */
 image:string;
-/** Accessible description matching the upstream avatar contract. A host `aria-label` wins. */
+/** Accessible description matching the upstream avatar contract. A host `aria-label` wins.
+* Attribute removal is consumed as an absent label without changing its null readback. */
 label:string;
 /** Native `<img loading>` passthrough. `'lazy'` defers the request until the avatar approaches
 *  the viewport — worth setting for avatars far down a long list, never for one above the fold. */

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

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{styles}from"./avatar.styles.js";class LyraAvatar extends LyraElement{static{this.styles=[LyraElement.styles,styles]}constructor(){super(),this.initials="",this.image="",this.label="",this.loading="eager",this.size="medium",this.shape="circle",this.variant="neutral",this.hasIconSlot=!1,this.connectionEventBaselinePending=!0,this.onDecorativeGlyphFocusIn=event=>{const focusEvent=event,target=event.target;if(target===this||target?.nodeType!==1||!this.contains(target))return;const previous=focusEvent.relatedTarget;if(previous?.nodeType===1&&!this.contains(previous)&&typeof previous.focus=="function"){previous.focus();return}target.blur?.()},this.onImageError=event=>{const image=event.currentTarget,failedSrc=image?.getAttribute("src"),currentSrc=this.safeImage();!this.isConnected||!image||image!==this.renderRoot.querySelector('[part="image"]')||!failedSrc||failedSrc!==currentSrc||this.failedSrc!==failedSrc&&(this.failedSrc=failedSrc,this.emit("lr-error",{image:failedSrc}))},this.onNamedIconSlotChange=e=>{this.hasIconSlot=e.target.assignedNodes({flatten:!0}).length>0},this.addEventListener("focusin",this.onDecorativeGlyphFocusIn)}safeImage(){return safeMediaSrc(this.image,this.ownerDocument?.defaultView?.URL??URL)}hasIconSlotContent(nodes){return Array.from(nodes).some(node=>node.nodeType===1&&node.getAttribute("slot")==="icon")}willUpdate(changed){super.willUpdate(changed);const mayEmitConnectionTransition=this.isConnected&&!this.connectionEventBaselinePending;changed.has("loading")&&this.loading!=="eager"&&this.loading!=="lazy"&&(this.loading="eager"),changed.has("size")&&this.size!=="2xs"&&this.size!=="xs"&&this.size!=="s"&&this.size!=="m"&&this.size!=="l"&&this.size!=="xl"&&this.size!=="small"&&this.size!=="medium"&&this.size!=="large"&&(this.size="medium"),changed.has("shape")&&this.shape!=="circle"&&this.shape!=="rounded"&&this.shape!=="square"&&(this.shape="circle"),changed.has("variant")&&this.variant!=="neutral"&&this.variant!=="brand"&&this.variant!=="success"&&this.variant!=="warning"&&this.variant!=="danger"&&(this.variant="neutral"),changed.has("image")&&(this.failedSrc=void 0,this.hasUpdated&&this.image&&!this.safeImage()&&mayEmitConnectionTransition&&this.emit("lr-error",{image:this.image})),this.seedFirstRenderState(()=>{this.hasIconSlot=this.hasIconSlotContent(this.childNodes)})}connectedCallback(){super.connectedCallback(),this.connectionEventBaselinePending=!0,this.requestUpdate()}updated(changed){super.updated(changed),this.isConnected&&(this.connectionEventBaselinePending=!1)}disconnectedCallback(){this.connectionEventBaselinePending=!0,this.failedSrc=void 0,super.disconnectedCallback()}render(){const safeImage=this.safeImage(),showImage=!!safeImage&&safeImage!==this.failedSrc,showGlyph=!showImage&&this.hasIconSlot,showInitials=!showGlyph&&!showImage,explicitHostLabel=hostAriaLabel(this),accessibleName=explicitHostLabel??this.label,suppressFallbackSemantics=explicitHostLabel!==null||this.label.length>0,hasAccessibleFallback=(showGlyph||showInitials)&&accessibleName.length>0;return html`
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{styles}from"./avatar.styles.js";class LyraAvatar extends LyraElement{static{this.styles=[LyraElement.styles,styles]}constructor(){super(),this.initials="",this.image="",this.label="",this.loading="eager",this.size="medium",this.shape="circle",this.variant="neutral",this.hasIconSlot=!1,this.connectionEventBaselinePending=!0,this.onDecorativeGlyphFocusIn=event=>{const focusEvent=event,target=event.target;if(target===this||target?.nodeType!==1||!this.contains(target))return;const previous=focusEvent.relatedTarget;if(previous?.nodeType===1&&!this.contains(previous)&&typeof previous.focus=="function"){previous.focus();return}target.blur?.()},this.onImageError=event=>{const image=event.currentTarget,failedSrc=image?.getAttribute("src"),currentSrc=this.safeImage();!this.isConnected||!image||image!==this.renderRoot.querySelector('[part="image"]')||!failedSrc||failedSrc!==currentSrc||this.failedSrc!==failedSrc&&(this.failedSrc=failedSrc,this.emit("lr-error",{image:failedSrc}))},this.onNamedIconSlotChange=e=>{this.hasIconSlot=e.target.assignedNodes({flatten:!0}).length>0},this.addEventListener("focusin",this.onDecorativeGlyphFocusIn)}safeImage(){return safeMediaSrc(this.image,this.ownerDocument?.defaultView?.URL??URL)}hasIconSlotContent(nodes){return Array.from(nodes).some(node=>node.nodeType===1&&node.getAttribute("slot")==="icon")}willUpdate(changed){super.willUpdate(changed);const mayEmitConnectionTransition=this.isConnected&&!this.connectionEventBaselinePending;changed.has("loading")&&this.loading!=="eager"&&this.loading!=="lazy"&&(this.loading="eager"),changed.has("size")&&this.size!=="2xs"&&this.size!=="xs"&&this.size!=="s"&&this.size!=="m"&&this.size!=="l"&&this.size!=="xl"&&this.size!=="small"&&this.size!=="medium"&&this.size!=="large"&&(this.size="medium"),changed.has("shape")&&this.shape!=="circle"&&this.shape!=="rounded"&&this.shape!=="square"&&(this.shape="circle"),changed.has("variant")&&this.variant!=="neutral"&&this.variant!=="brand"&&this.variant!=="success"&&this.variant!=="warning"&&this.variant!=="danger"&&(this.variant="neutral"),changed.has("image")&&(this.failedSrc=void 0,this.hasUpdated&&this.image&&!this.safeImage()&&mayEmitConnectionTransition&&this.emit("lr-error",{image:this.image})),this.seedFirstRenderState(()=>{this.hasIconSlot=this.hasIconSlotContent(this.childNodes)})}connectedCallback(){super.connectedCallback(),this.connectionEventBaselinePending=!0,this.requestUpdate()}updated(changed){super.updated(changed),this.isConnected&&(this.connectionEventBaselinePending=!1)}disconnectedCallback(){this.connectionEventBaselinePending=!0,this.failedSrc=void 0,super.disconnectedCallback()}render(){const safeImage=this.safeImage(),showImage=!!safeImage&&safeImage!==this.failedSrc,showGlyph=!showImage&&this.hasIconSlot,showInitials=!showGlyph&&!showImage,explicitHostLabel=hostAriaLabel(this),label=this.label??"",accessibleName=explicitHostLabel??label,suppressFallbackSemantics=explicitHostLabel!==null||label.length>0,hasAccessibleFallback=(showGlyph||showInitials)&&accessibleName.length>0;return html`
       <span
         part="base"
         role=${hasAccessibleFallback?"img":nothing}

package/dist/components/media/file-input/file-input.class.d.ts

@@ -141,8 +141,10 @@ directory:boolean;
 /** Enables files pasted from the clipboard into the dropzone. `true`-defaulting, so a plain
 *  `paste="false"` attribute (not just a `.paste=${false}` property binding) actually disables it. */
 paste:boolean;
-/** Form-control label. Empty leaves the localized dropzone instruction as the visible fallback. */
-label:string;hint:string;
+/** Form-control label. Empty or removed leaves the localized dropzone instruction as the visible fallback. */
+label:string;
+/** Optional hint copy. Removing the attribute removes its text and description association. */
+hint:string;
 /** Plain-text validation error. A custom-validity message is shown when this is empty. */
 errorText:string;
 /** SSR slot-presence hint for label content. */

package/dist/components/media/file-input/file-input.class.js

@@ -13,7 +13,7 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
         aria-label=${this.localize("removeWithContext",void 0,{label:file.name})}
         @click=${()=>this.removeFile(index)}
       >${closeIcon()}</button>
-    </div>`}render(){const label=this.effectiveLabel,hasLabel=this.withLabel||this.slotPresence.has("label")||this.label.length>0,explicitHostLabel=hostAriaLabel(this),explicitAccessibleLabel=this.hasAttribute("accessible-label")||this.accessibleLabel?this.accessibleLabel:null,accessibleLabel=explicitHostLabel??explicitAccessibleLabel,labelledBy=accessibleLabel==null&&hasLabel?"file-input-label":void 0,fallbackAriaLabel=accessibleLabel??(hasLabel?void 0:label),hasHint=this.withHint||this.slotPresence.has("hint")||this.hint.length>0,renderedError=this.errorText||this.customError||(this.touched?this.validationMessage:""),hasError=this.withError||this.slotPresence.has("error")||renderedError.length>0,describedBy=[hasError?"file-input-error":"",hasHint?"file-input-hint":""].filter(Boolean).join(" "),invalid=hasError||this.touched&&!this.internals.validity.valid;return html`
+    </div>`}render(){const label=this.effectiveLabel,hasLabel=this.withLabel||this.slotPresence.has("label")||(this.label??"").length>0,explicitHostLabel=hostAriaLabel(this),explicitAccessibleLabel=this.hasAttribute("accessible-label")||this.accessibleLabel?this.accessibleLabel:null,accessibleLabel=explicitHostLabel??explicitAccessibleLabel,labelledBy=accessibleLabel==null&&hasLabel?"file-input-label":void 0,fallbackAriaLabel=accessibleLabel??(hasLabel?void 0:label),hasHint=this.withHint||this.slotPresence.has("hint")||(this.hint??"").length>0,renderedError=this.errorText||this.customError||(this.touched?this.validationMessage:""),hasError=this.withError||this.slotPresence.has("error")||renderedError.length>0,describedBy=[hasError?"file-input-error":"",hasHint?"file-input-hint":""].filter(Boolean).join(" "),invalid=hasError||this.touched&&!this.internals.validity.valid;return html`
       <div part="form-control">
         <label
           id="file-input-label"

package/dist/components/media/file-input/file-input.styles.js

@@ -1 +1 @@
-import{css}from"lit";import{formControlRequiredMarker}from"../../../internal/form-control.styles.js";const styles=css` :host { display: block; min-inline-size: 0; max-inline-size: 100%; --_lr-file-input-font-size: var(--lr-form-control-font-size); --_lr-file-input-dropzone-font-size: var(--lr-font-size-md-sm); --_lr-file-input-dropzone-icon-size: var(--lr-font-size-xl); --_lr-file-input-dropzone-padding: var(--lr-space-l); --_lr-file-input-detail-font-size: var(--lr-font-size-sm); } :host([size="2xs"]), :host([size="xs"]) { --_lr-file-input-dropzone-font-size: var(--lr-font-size-xs); --_lr-file-input-dropzone-icon-size: var(--lr-font-size-md-sm); --_lr-file-input-dropzone-padding: var(--lr-space-s); --_lr-file-input-detail-font-size: var(--lr-font-size-2xs); } :host([size="s"]), :host([size="small"]) { --_lr-file-input-dropzone-font-size: var(--lr-font-size-sm); --_lr-file-input-dropzone-icon-size: var(--lr-font-size-lg); --_lr-file-input-dropzone-padding: var(--lr-space-m); --_lr-file-input-detail-font-size: var(--lr-font-size-xs); } :host([size="l"]), :host([size="large"]) { --_lr-file-input-dropzone-font-size: var(--lr-font-size-lg); --_lr-file-input-dropzone-icon-size: var(--lr-font-size-2xl); --_lr-file-input-dropzone-padding: var(--lr-space-2xl); --_lr-file-input-detail-font-size: var(--lr-font-size-md-sm); } :host([size="xl"]) { --_lr-file-input-dropzone-font-size: var(--lr-font-size-xl); --_lr-file-input-dropzone-icon-size: var(--lr-font-size-3xl); --_lr-file-input-dropzone-padding: var(--lr-space-2xl); --_lr-file-input-detail-font-size: var(--lr-font-size-m); } [part="form-control"] { min-inline-size: 0; max-inline-size: 100%; block-size: 100%; } [part~="form-control-label"] { display: block; min-inline-size: 0; margin-block-end: var(--lr-space-xs); font-size: var(--lr-file-input-font-size, var(--_lr-file-input-font-size)); font-weight: var(--lr-font-weight-semibold); overflow-wrap: anywhere; } [part~="form-control-label"][hidden], [part="hint"][hidden], [part="error"][hidden] { display: none; } ${formControlRequiredMarker} .dropzone { position: relative; display: grid; min-inline-size: 0; block-size: 100%; } [part~="base"] { grid-area: 1 / 1; inline-size: 100%; block-size: 100%; min-inline-size: var(--lr-icon-button-size); min-block-size: var(--lr-icon-button-size); box-sizing: border-box; font: inherit; cursor: pointer; appearance: none; padding: var( --lr-file-input-dropzone-padding, var(--_lr-file-input-dropzone-padding) ); border: var(--lr-border-width-medium) dashed var(--lr-color-border); border-radius: var(--lr-file-input-radius, var(--lr-radius)); background: var(--lr-color-surface); color: var(--lr-color-text-quiet); font-size: var( --lr-file-input-dropzone-font-size, var(--_lr-file-input-dropzone-font-size) ); } .dropzone-content { grid-area: 1 / 1; z-index: var(--lr-layer-content); min-inline-size: 0; max-inline-size: 100%; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--lr-file-input-gap, var(--lr-space-xs)); padding: var( --lr-file-input-dropzone-padding, var(--_lr-file-input-dropzone-padding) ); color: var(--lr-color-text-quiet); text-align: center; font-size: var( --lr-file-input-dropzone-font-size, var(--_lr-file-input-dropzone-font-size) ); overflow-wrap: anywhere; pointer-events: none; } [part="dropzone-icon"] { display: inline-flex; align-items: center; justify-content: center; font-size: var( --lr-file-input-dropzone-icon-size, var(--_lr-file-input-dropzone-icon-size) ); } [part="dropzone-text"] { min-inline-size: 0; max-inline-size: 100%; overflow-wrap: anywhere; } ::slotted(*) { max-inline-size: 100%; min-inline-size: 0; pointer-events: auto; } :host([compact]) [part~="base"] { padding: var(--lr-file-input-compact-padding, var(--lr-space-s)); font-size: var(--lr-file-input-compact-font-size, var(--lr-font-size-sm)); } :host([compact]) .dropzone-content { padding: var(--lr-file-input-compact-padding, var(--lr-space-s)); gap: var( --lr-file-input-compact-gap, var(--lr-file-input-gap, var(--lr-space-2xs)) ); font-size: var(--lr-file-input-compact-font-size, var(--lr-font-size-sm)); } [part~="base"][data-drag-state="accept"] { border-color: var( --lr-file-input-accept-border-color, var(--lr-color-success) ); background: var( --lr-file-input-accept-bg, color-mix(in srgb, var(--lr-color-success) 8%, transparent) ); } [part~="base"][data-drag-state="reject"] { border-color: var( --lr-file-input-reject-border-color, var(--lr-color-danger) ); background: var( --lr-file-input-reject-bg, color-mix(in srgb, var(--lr-color-danger) 8%, transparent) ); } @media (forced-colors: active) { [part~="base"][data-drag-state="accept"] { border-color: Highlight; border-style: double; outline: var(--lr-border-width-thin) solid Highlight; outline-offset: calc(-1 * var(--lr-border-width-medium)); } [part~="base"][data-drag-state="reject"] { border-color: CanvasText; border-style: dotted; outline: var(--lr-border-width-medium) double CanvasText; outline-offset: calc(-1 * var(--lr-border-width-medium)); } } :host(:not(:disabled)) [part~="base"]:hover { border-color: var(--lr-color-brand); } :host(:not(:disabled)) .dropzone:hover [part~="base"] { border-color: var(--lr-color-brand); } :host(:not(:disabled)) [part~="base"]:active { border-color: var(--lr-color-brand); background: color-mix( in oklab, var(--lr-color-surface), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } :host(:not(:disabled)) .dropzone:active [part~="base"] { border-color: var(--lr-color-brand); background: color-mix( in oklab, var(--lr-color-surface), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part~="base"]:focus-visible { outline: var(--lr-focus-ring); outline-offset: var(--lr-focus-ring-offset); } :host(:disabled) [part~="base"] { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="rejection"] { min-inline-size: 0; max-inline-size: 100%; margin-block: var(--lr-space-2xs) 0; color: var(--lr-color-danger); font-size: var(--lr-font-size-sm); text-align: start; overflow-wrap: anywhere; } [part="rejection"] ul { margin: 0; padding-inline-start: var(--lr-space-m); } [part="file-list"] { display: grid; gap: var(--lr-space-xs); margin-block-start: var(--lr-space-xs); } [part="file"] { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--lr-space-s); min-inline-size: 0; padding: var(--lr-space-xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid var(--lr-color-border); border-radius: var(--lr-radius); background: var(--lr-color-surface-raised); } [part="file-thumbnail"] { display: inline-flex; align-items: center; justify-content: center; inline-size: var(--lr-icon-button-size); block-size: var(--lr-icon-button-size); overflow: hidden; border-radius: var(--lr-radius-xs); color: var(--lr-color-text-quiet); } [part="file-image"] { inline-size: 100%; block-size: 100%; object-fit: cover; } [part="file-icon"] { display: inline-flex; font-size: var(--lr-font-size-xl); } [part="file-details"] { display: flex; flex-direction: column; min-inline-size: 0; } [part="file-name"] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--lr-color-text); font-size: var(--lr-file-input-font-size, var(--_lr-file-input-font-size)); } [part="file-size"] { color: var(--lr-color-text-quiet); font-size: var( --lr-file-input-detail-font-size, var(--_lr-file-input-detail-font-size) ); } [part="remove-button"] { display: inline-flex; align-items: center; justify-content: center; min-inline-size: var(--lr-icon-button-size); min-block-size: var(--lr-icon-button-size); padding: 0; border: none; border-radius: var(--lr-radius); background: transparent; color: var(--lr-color-text-quiet); cursor: pointer; } [part="remove-button"]:hover { background: var(--lr-color-brand-quiet); color: var(--lr-color-text); } [part="remove-button"]:active { background: color-mix( in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="remove-button"]:focus-visible { outline: var(--lr-focus-ring); outline-offset: var(--lr-focus-ring-offset); } [part="remove-button"]:disabled { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="hint"] { min-inline-size: 0; margin-block-start: var(--lr-space-xs); color: var(--lr-color-text-quiet); font-size: var( --lr-file-input-detail-font-size, var(--_lr-file-input-detail-font-size) ); overflow-wrap: anywhere; } [part="error"] { min-inline-size: 0; margin-block-start: var(--lr-space-xs); color: var(--lr-color-danger); font-size: var( --lr-file-input-detail-font-size, var(--_lr-file-input-detail-font-size) ); overflow-wrap: anywhere; } `;export{styles};
+import{css}from"lit";import{formControlRequiredMarker}from"../../../internal/form-control.styles.js";const styles=css` :host { display: block; min-inline-size: 0; max-inline-size: 100%; --_lr-file-input-font-size: var(--lr-form-control-font-size); --_lr-file-input-dropzone-font-size: var(--lr-font-size-md-sm); --_lr-file-input-dropzone-icon-size: var(--lr-font-size-xl); --_lr-file-input-dropzone-padding: var(--lr-space-l); --_lr-file-input-detail-font-size: var(--lr-font-size-sm); } :host([size="2xs"]), :host([size="xs"]) { --_lr-file-input-dropzone-font-size: var(--lr-font-size-xs); --_lr-file-input-dropzone-icon-size: var(--lr-font-size-md-sm); --_lr-file-input-dropzone-padding: var(--lr-space-s); --_lr-file-input-detail-font-size: var(--lr-font-size-2xs); } :host([size="s"]), :host([size="small"]) { --_lr-file-input-dropzone-font-size: var(--lr-font-size-sm); --_lr-file-input-dropzone-icon-size: var(--lr-font-size-lg); --_lr-file-input-dropzone-padding: var(--lr-space-m); --_lr-file-input-detail-font-size: var(--lr-font-size-xs); } :host([size="l"]), :host([size="large"]) { --_lr-file-input-dropzone-font-size: var(--lr-font-size-lg); --_lr-file-input-dropzone-icon-size: var(--lr-font-size-2xl); --_lr-file-input-dropzone-padding: var(--lr-space-2xl); --_lr-file-input-detail-font-size: var(--lr-font-size-md-sm); } :host([size="xl"]) { --_lr-file-input-dropzone-font-size: var(--lr-font-size-xl); --_lr-file-input-dropzone-icon-size: var(--lr-font-size-3xl); --_lr-file-input-dropzone-padding: var(--lr-space-2xl); --_lr-file-input-detail-font-size: var(--lr-font-size-m); } [part="form-control"] { min-inline-size: 0; max-inline-size: 100%; block-size: 100%; } [part~="form-control-label"] { display: block; min-inline-size: 0; margin-block-end: var(--lr-space-xs); font-size: var(--lr-file-input-font-size, var(--_lr-file-input-font-size)); font-weight: var(--lr-font-weight-semibold); overflow-wrap: anywhere; } [part~="form-control-label"][hidden], [part="hint"][hidden], [part="error"][hidden] { display: none; } ${formControlRequiredMarker} .dropzone { position: relative; display: grid; min-inline-size: 0; block-size: 100%; } [part~="base"] { grid-area: 1 / 1; inline-size: 100%; block-size: 100%; min-inline-size: var(--lr-icon-button-size); min-block-size: var(--lr-icon-button-size); box-sizing: border-box; font: inherit; cursor: pointer; appearance: none; padding: var( --lr-file-input-dropzone-padding, var(--_lr-file-input-dropzone-padding) ); border: var(--lr-border-width-medium) dashed var(--lr-color-border); border-radius: var(--lr-file-input-radius, var(--lr-radius)); background: var(--lr-color-surface); color: var(--lr-color-text-quiet); font-size: var( --lr-file-input-dropzone-font-size, var(--_lr-file-input-dropzone-font-size) ); } .dropzone-content { grid-area: 1 / 1; z-index: var(--lr-layer-content); min-inline-size: 0; max-inline-size: 100%; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--lr-file-input-gap, var(--lr-space-xs)); padding: var( --lr-file-input-dropzone-padding, var(--_lr-file-input-dropzone-padding) ); color: var(--lr-color-text-quiet); text-align: center; font-size: var( --lr-file-input-dropzone-font-size, var(--_lr-file-input-dropzone-font-size) ); overflow-wrap: anywhere; pointer-events: none; } [part="dropzone-icon"] { display: inline-flex; align-items: center; justify-content: center; font-size: var( --lr-file-input-dropzone-icon-size, var(--_lr-file-input-dropzone-icon-size) ); } [part="dropzone-text"] { min-inline-size: 0; max-inline-size: 100%; overflow-wrap: anywhere; } ::slotted(*) { max-inline-size: 100%; min-inline-size: 0; pointer-events: auto; } :host([compact]) [part~="base"] { padding: var(--lr-file-input-compact-padding, var(--lr-space-s)); font-size: var(--lr-file-input-compact-font-size, var(--lr-font-size-sm)); } :host([compact]) .dropzone-content { padding: var(--lr-file-input-compact-padding, var(--lr-space-s)); gap: var( --lr-file-input-compact-gap, var(--lr-file-input-gap, var(--lr-space-2xs)) ); font-size: var(--lr-file-input-compact-font-size, var(--lr-font-size-sm)); } [part~="base"][data-drag-state="accept"] { border-color: var( --lr-file-input-accept-border-color, var(--lr-color-success) ); background: var( --lr-file-input-accept-bg, color-mix(in srgb, var(--lr-color-success) 8%, transparent) ); } [part~="base"][data-drag-state="reject"] { border-color: var( --lr-file-input-reject-border-color, var(--lr-color-danger) ); background: var( --lr-file-input-reject-bg, color-mix(in srgb, var(--lr-color-danger) 8%, transparent) ); } @media (forced-colors: active) { [part~="base"][data-drag-state="accept"] { border-color: Highlight; border-style: double; outline: var(--lr-border-width-thin) solid Highlight; outline-offset: calc(-1 * var(--lr-border-width-medium)); } [part~="base"][data-drag-state="reject"] { border-color: CanvasText; border-style: dotted; outline: var(--lr-border-width-medium) double CanvasText; outline-offset: calc(-1 * var(--lr-border-width-medium)); } } :host(:not(:disabled)) [part~="base"]:hover { border-color: var(--lr-color-brand); } :host(:not(:disabled)) .dropzone:hover [part~="base"] { border-color: var(--lr-color-brand); } :host(:not(:disabled)) [part~="base"]:active { border-color: var(--lr-color-brand); background: color-mix( in oklab, var(--lr-color-surface), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } :host(:not(:disabled)) .dropzone:active [part~="base"] { border-color: var(--lr-color-brand); background: color-mix( in oklab, var(--lr-color-surface), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part~="base"]:focus-visible { outline: var(--lr-focus-ring); outline-offset: var(--lr-focus-ring-offset); } :host(:disabled) [part~="base"] { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="rejection"] { min-inline-size: 0; max-inline-size: 100%; margin-block: var(--lr-space-2xs) 0; color: var(--lr-color-danger); font-size: var(--lr-font-size-sm); text-align: start; overflow-wrap: anywhere; } [part="rejection"] ul { margin: 0; padding-inline-start: var(--lr-space-m); } [part="file-list"] { display: grid; gap: var(--lr-space-xs); margin-block-start: var(--lr-space-xs); } [part="file"] { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--lr-space-s); min-inline-size: 0; padding: var(--lr-space-xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid var(--lr-color-border); border-radius: var(--lr-radius); background: var(--lr-color-surface-raised); } [part="file-thumbnail"] { display: inline-flex; align-items: center; justify-content: center; inline-size: var(--lr-icon-button-size); block-size: var(--lr-icon-button-size); overflow: hidden; border-radius: var(--lr-radius-xs); color: var(--lr-color-text-quiet); } [part="file-image"] { inline-size: 100%; block-size: 100%; object-fit: cover; } [part="file-icon"] { display: inline-flex; font-size: var(--lr-font-size-xl); } [part="file-details"] { display: flex; flex-direction: column; min-inline-size: 0; } [part="file-name"] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--lr-color-text); font-size: var(--lr-file-input-font-size, var(--_lr-file-input-font-size)); } [part="file-size"] { color: var(--lr-color-text-quiet); font-size: var( --lr-file-input-detail-font-size, var(--_lr-file-input-detail-font-size) ); } [part="remove-button"] { display: inline-flex; align-items: center; justify-content: center; min-inline-size: var(--lr-icon-button-size); min-block-size: var(--lr-icon-button-size); padding: 0; border: none; border-radius: var(--lr-radius); background: transparent; color: var(--lr-color-text-quiet); font: inherit; cursor: pointer; } [part="remove-button"]:hover:where(:not(:disabled)) { background: var(--lr-color-brand-quiet); color: var(--lr-color-text); } [part="remove-button"]:active:where(:not(:disabled)) { background: color-mix( in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="remove-button"]:focus-visible { outline: var(--lr-focus-ring); outline-offset: var(--lr-focus-ring-offset); } [part="remove-button"]:disabled { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="hint"] { min-inline-size: 0; margin-block-start: var(--lr-space-xs); color: var(--lr-color-text-quiet); font-size: var( --lr-file-input-detail-font-size, var(--_lr-file-input-detail-font-size) ); overflow-wrap: anywhere; } [part="error"] { min-inline-size: 0; margin-block-start: var(--lr-space-xs); color: var(--lr-color-danger); font-size: var( --lr-file-input-detail-font-size, var(--_lr-file-input-detail-font-size) ); overflow-wrap: anywhere; } `;export{styles};

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

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{keyed}from"lit/directives/keyed.js";import{LyraElement}from"../../../internal/lyra-element.js";import{getDisplayNames}from"../../../internal/intl-cache.js";import{hostAriaLabel,srOnly}from"../../../internal/a11y.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{styles}from"./flag.styles.js";import{ALPHA2_RE,alpha3ToAlpha2,languageToCountry}from"./language-map.js";import"../../overlays/skeleton/skeleton.class.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{LYRA_DEFAULT_collapse,LYRA_DEFAULT_details,LYRA_DEFAULT_flagLoadError,LYRA_DEFAULT_loading,LYRA_DEFAULT_map,LYRA_DEFAULT_navigation,LYRA_DEFAULT_open,LYRA_DEFAULT_popover,LYRA_DEFAULT_search,LYRA_DEFAULT_select}from"../../../internal/default-strings.generated.js";const FLAG_LOAD_ERROR_KEY="flagLoadError",FLAG_FIDELITIES=new Set(["compact","standard","detailed"]),FLAG_SHAPES=new Set(["rect","circle"]);function normalizeFlagFidelity(value){return FLAG_FIDELITIES.has(value)?value:"standard"}function normalizeFlagShape(value){return FLAG_SHAPES.has(value)?value:"rect"}function resolverFromModule(module){try{if(typeof module=="object"&&module!==null||typeof module=="function"){const named=module.flagUrl;if(typeof named=="function")return named;const fallback=module.default??module;if(typeof fallback=="function")return fallback;if(typeof fallback=="object"&&fallback!==null){const defaultNamed=fallback.flagUrl;if(typeof defaultNamed=="function")return defaultNamed}}}catch{}return null}function warnFlagPeerMissing(){console.warn("<lr-flag> needs the optional peer dependency '@aceshooting/lyra-flags' to render flag images \u2014 install it with `pnpm add @aceshooting/lyra-flags`.")}function warnFlagPeerIncapable(capability){console.warn(`<lr-flag> loaded '@aceshooting/lyra-flags' but it does not expose \`${capability}\`. The package is installed, so this is a version mismatch rather than a missing dependency: upgrade it to a release that provides that capability, and check the peer range in <lr-flag>'s own package metadata for the floor it expects.`)}async function loadFlagUrl(importFlags){let peerModule;try{peerModule=await importFlags()}catch{return warnFlagPeerMissing(),null}try{const resolver=resolverFromModule(peerModule);if(resolver)return resolver}catch{}return warnFlagPeerIncapable("flagUrl"),null}function resolverFactoryFromModule(module){try{if(typeof module=="object"&&module!==null||typeof module=="function"){const named=module.createFlagUrlResolver;if(typeof named=="function")return named;const fallback=module.default??module;if(typeof fallback=="object"&&fallback!==null){const defaultNamed=fallback.createFlagUrlResolver;if(typeof defaultNamed=="function")return defaultNamed}}}catch{}return null}async function loadBulkFlagUrl(importFlags){let peerModule;try{peerModule=await importFlags()}catch{return warnFlagPeerMissing(),null}const factory=resolverFactoryFromModule(peerModule);if(!factory)return warnFlagPeerIncapable("createFlagUrlResolver"),null;try{return factory()}catch{return warnFlagPeerIncapable("createFlagUrlResolver"),null}}function displayNameFor(code,locale){try{return getDisplayNames(locale,{type:"region"}).of(code.toUpperCase())??code.toUpperCase()}catch{return code.toUpperCase()}}let flagUrlResolver,flagResolverGeneration=0;const flagResolverSubscribers=new Set;let warnedMissingFlagResolver=!1;function warnMissingFlagResolver(code){warnedMissingFlagResolver||(warnedMissingFlagResolver=!0,console.warn(`<lr-flag> could not resolve the code "${code}" because no flag resolver is registered. Import the optional peer entry once at startup -- import '@aceshooting/lyra-ui/components/media/flag/flag-peer.js' -- and install '@aceshooting/lyra-flags', or pass an already-resolved URL through 'src' instead.`))}function setFlagUrlResolver(value){flagUrlResolver=value===null?Promise.resolve(null):Promise.resolve(value),warnedMissingFlagResolver=!1,flagResolverGeneration++;for(const subscriber of[...flagResolverSubscribers])subscriber(flagResolverGeneration)}function loadFlagUrlResolver(){return flagUrlResolver||(flagUrlResolver=Promise.resolve(null)),flagUrlResolver}class LyraFlag extends LyraElement{constructor(){super(...arguments),this._shape="rect",this._fidelity="standard",this.sourceState=Object.freeze({status:"idle",identity:"idle"}),this.resolverGeneration=flagResolverGeneration,this.sourceRestartPending=!0,this.activeSourceRequest=0,this.resolveToken=0,this.onResolverGeneration=generation=>{!this.isConnected||generation===this.resolverGeneration||(this.resolverGeneration=generation)}}static{this.defaultStrings={...super.defaultStrings,collapse:LYRA_DEFAULT_collapse,details:LYRA_DEFAULT_details,flagLoadError:LYRA_DEFAULT_flagLoadError,loading:LYRA_DEFAULT_loading,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,open:LYRA_DEFAULT_open,popover:LYRA_DEFAULT_popover,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select}}static{this.styles=[LyraElement.styles,styles,srOnly]}get shape(){return this._shape}set shape(value){const old=this._shape;this._shape=normalizeFlagShape(value),this.requestUpdate("shape",old)}get fidelity(){return this._fidelity}set fidelity(value){const old=this._fidelity;this._fidelity=normalizeFlagFidelity(value),this.requestUpdate("fidelity",old)}get effectiveFidelity(){return normalizeFlagFidelity(this.fidelity)}get loading(){return this.sourceState.status==="loading"}get code(){if(this.country)return ALPHA2_RE.test(this.country)?this.country.toLowerCase():alpha3ToAlpha2(this.country);if(this.language)return languageToCountry(this.language)}get unresolved(){return this.src||!this.country&&!this.language?!1:this.code===void 0}connectedCallback(){super.connectedCallback(),this.sourceRestartPending=!0,flagResolverSubscribers.add(this.onResolverGeneration),this.syncErrorAnnouncementSink(),this.resolverGeneration!==flagResolverGeneration&&(this.resolverGeneration=flagResolverGeneration),this.requestUpdate()}disconnectedCallback(){this.resolveToken++,this.sourceRestartPending=!0,flagResolverSubscribers.delete(this.onResolverGeneration),this.releaseErrorAnnouncementSink(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.resolveToken++,this.sourceRestartPending=!0,this.releaseErrorAnnouncementSink(),this.syncErrorAnnouncementSink(),this.requestUpdate()}syncErrorAnnouncementSink(){this.isConnected&&this.errorAnnouncementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseErrorAnnouncementSink(),this.errorAnnouncementSink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseErrorAnnouncementSink(){this.errorAnnouncementSink?.release(),this.errorAnnouncementSink=void 0}announceLoadError(){this.errorAnnouncementSink?.announce(this.localize(FLAG_LOAD_ERROR_KEY))}setSourceState(state2,announceError=!1){this.sourceState=Object.freeze(state2),this.toggleAttribute("data-error",state2.status==="error"),this.toggleAttribute("data-unresolved",this.unresolved),this.setAttribute("aria-busy",String(state2.status==="loading")),announceError&&this.isConnected&&this.announceLoadError()}failSource(identity,announce=!0){this.setSourceState({status:"error",identity},announce)}onImageLoad(event,identity,url,request){const image=event.currentTarget;!this.isConnected||request!==this.activeSourceRequest||!image||image!==this.renderRoot.querySelector('[part="image"]')||this.sourceState.status!=="loading"||this.sourceState.identity!==identity||this.sourceState.url!==url||this.setSourceState({status:"loaded",identity,url})}onImageError(event,identity,request){const image=event.currentTarget;!this.isConnected||request!==this.activeSourceRequest||!image||image!==this.renderRoot.querySelector('[part="image"]')||this.sourceState.status!=="loading"||this.sourceState.identity!==identity||this.failSource(identity)}willUpdate(changed){super.willUpdate(changed);const sourceChanged=changed.has("country")||changed.has("language")||changed.has("src")||changed.has("fidelity")||changed.has("resolverGeneration");if(typeof Node<"u"&&!this.isConnected){sourceChanged&&(this.resolveToken++,this.sourceRestartPending=!0);return}if(this.hasUpdated&&!sourceChanged&&!this.sourceRestartPending)return;const connectionBaseline=this.sourceRestartPending;this.sourceRestartPending=!1;const token=++this.resolveToken,request=++this.activeSourceRequest,URLCtor=this.ownerDocument?.defaultView?.URL??globalThis.URL,directValue=typeof this.src=="string"?this.src.trim():"";if(directValue){const identity2=`direct:${directValue}`,url=safeMediaSrc(directValue,URLCtor);if(!url){this.failSource(identity2,!connectionBaseline);return}this.setSourceState({status:"loading",identity:identity2,url});return}const code=this.code;if(!code){this.setSourceState({status:"idle",identity:"idle"});return}const fidelity=this.effectiveFidelity,identity=`peer:${code}:${fidelity}:${this.resolverGeneration}`;this.setSourceState({status:"loading",identity}),loadFlagUrlResolver().then(async resolve=>{if(token!==this.resolveToken||request!==this.activeSourceRequest||!this.isConnected)return;if(typeof resolve!="function"){warnMissingFlagResolver(code),this.failSource(identity);return}const candidate=await resolve(code,fidelity==="standard"?void 0:{variant:fidelity});if(token!==this.resolveToken||request!==this.activeSourceRequest||!this.isConnected)return;if(candidate===void 0){this.setSourceState({status:"idle",identity});return}const url=safeMediaSrc(candidate,URLCtor);if(!url){this.failSource(identity);return}this.setSourceState({status:"loading",identity,url})}).catch(err=>{token!==this.resolveToken||request!==this.activeSourceRequest||!this.isConnected||(console.warn(`<lr-flag> failed to resolve a flag URL for "${code}":`,err),this.failSource(identity))})}updated(changed){super.updated(changed),this.setAttribute("aria-busy",String(this.sourceState.status==="loading")),this.toggleAttribute("data-unresolved",this.unresolved)}render(){const state2=this.sourceState,request=this.activeSourceRequest;if(this.unresolved){const fallbackUrl=this.fallback?safeMediaSrc(this.fallback,this.ownerDocument?.defaultView?.URL??globalThis.URL):null,fallbackAlt=hostAriaLabel(this)??this.label??"";return html`<slot name="fallback"
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{keyed}from"lit/directives/keyed.js";import{LyraElement}from"../../../internal/lyra-element.js";import{getDisplayNames}from"../../../internal/intl-cache.js";import{hostAriaLabel,srOnly}from"../../../internal/a11y.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{styles}from"./flag.styles.js";import{ALPHA2_RE,alpha3ToAlpha2,languageToCountry}from"./language-map.js";import"../../overlays/skeleton/skeleton.class.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{LYRA_DEFAULT_collapse,LYRA_DEFAULT_details,LYRA_DEFAULT_flagLoadError,LYRA_DEFAULT_loading,LYRA_DEFAULT_map,LYRA_DEFAULT_navigation,LYRA_DEFAULT_open,LYRA_DEFAULT_popover,LYRA_DEFAULT_search,LYRA_DEFAULT_select}from"../../../internal/default-strings.generated.js";const FLAG_LOAD_ERROR_KEY="flagLoadError",FLAG_FIDELITIES=new Set(["compact","standard","detailed"]),FLAG_SHAPES=new Set(["rect","circle"]);function normalizeFlagFidelity(value){return FLAG_FIDELITIES.has(value)?value:"standard"}function normalizeFlagShape(value){return FLAG_SHAPES.has(value)?value:"rect"}function resolverFromModule(module){try{if(typeof module=="object"&&module!==null||typeof module=="function"){const named=module.flagUrl;if(typeof named=="function")return named;const fallback=module.default??module;if(typeof fallback=="function")return fallback;if(typeof fallback=="object"&&fallback!==null){const defaultNamed=fallback.flagUrl;if(typeof defaultNamed=="function")return defaultNamed}}}catch{}return null}function warnFlagPeerMissing(){console.warn("<lr-flag> needs the optional peer dependency '@aceshooting/lyra-flags' to render flag images — install it with `pnpm add @aceshooting/lyra-flags`.")}function warnFlagPeerIncapable(capability){console.warn(`<lr-flag> loaded '@aceshooting/lyra-flags' but it does not expose \`${capability}\`. The package is installed, so this is a version mismatch rather than a missing dependency: upgrade it to a release that provides that capability, and check the peer range in <lr-flag>'s own package metadata for the floor it expects.`)}async function loadFlagUrl(importFlags){let peerModule;try{peerModule=await importFlags()}catch{return warnFlagPeerMissing(),null}try{const resolver=resolverFromModule(peerModule);if(resolver)return resolver}catch{}return warnFlagPeerIncapable("flagUrl"),null}function resolverFactoryFromModule(module){try{if(typeof module=="object"&&module!==null||typeof module=="function"){const named=module.createFlagUrlResolver;if(typeof named=="function")return named;const fallback=module.default??module;if(typeof fallback=="object"&&fallback!==null){const defaultNamed=fallback.createFlagUrlResolver;if(typeof defaultNamed=="function")return defaultNamed}}}catch{}return null}async function loadBulkFlagUrl(importFlags){let peerModule;try{peerModule=await importFlags()}catch{return warnFlagPeerMissing(),null}const factory=resolverFactoryFromModule(peerModule);if(!factory)return warnFlagPeerIncapable("createFlagUrlResolver"),null;try{return factory()}catch{return warnFlagPeerIncapable("createFlagUrlResolver"),null}}function displayNameFor(code,locale){try{return getDisplayNames(locale,{type:"region"}).of(code.toUpperCase())??code.toUpperCase()}catch{return code.toUpperCase()}}let flagUrlResolver,flagResolverGeneration=0;const flagResolverSubscribers=new Set;let warnedMissingFlagResolver=!1;function warnMissingFlagResolver(code){warnedMissingFlagResolver||(warnedMissingFlagResolver=!0,console.warn(`<lr-flag> could not resolve the code "${code}" because no flag resolver is registered. Import the optional peer entry once at startup -- import '@aceshooting/lyra-ui/components/media/flag/flag-peer.js' -- and install '@aceshooting/lyra-flags', or pass an already-resolved URL through 'src' instead.`))}function setFlagUrlResolver(value){flagUrlResolver=value===null?Promise.resolve(null):Promise.resolve(value),warnedMissingFlagResolver=!1,flagResolverGeneration++;for(const subscriber of[...flagResolverSubscribers])subscriber(flagResolverGeneration)}function loadFlagUrlResolver(){return flagUrlResolver||(flagUrlResolver=Promise.resolve(null)),flagUrlResolver}class LyraFlag extends LyraElement{constructor(){super(...arguments),this._shape="rect",this._fidelity="standard",this.sourceState=Object.freeze({status:"idle",identity:"idle"}),this.resolverGeneration=flagResolverGeneration,this.sourceRestartPending=!0,this.activeSourceRequest=0,this.resolveToken=0,this.onResolverGeneration=generation=>{!this.isConnected||generation===this.resolverGeneration||(this.resolverGeneration=generation)}}static{this.defaultStrings={...super.defaultStrings,collapse:LYRA_DEFAULT_collapse,details:LYRA_DEFAULT_details,flagLoadError:LYRA_DEFAULT_flagLoadError,loading:LYRA_DEFAULT_loading,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,open:LYRA_DEFAULT_open,popover:LYRA_DEFAULT_popover,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select}}static{this.styles=[LyraElement.styles,styles,srOnly]}get shape(){return this._shape}set shape(value){const old=this._shape;this._shape=normalizeFlagShape(value),this.requestUpdate("shape",old)}get fidelity(){return this._fidelity}set fidelity(value){const old=this._fidelity;this._fidelity=normalizeFlagFidelity(value),this.requestUpdate("fidelity",old)}get effectiveFidelity(){return normalizeFlagFidelity(this.fidelity)}get loading(){return this.sourceState.status==="loading"}get code(){if(this.country)return ALPHA2_RE.test(this.country)?this.country.toLowerCase():alpha3ToAlpha2(this.country);if(this.language)return languageToCountry(this.language)}get unresolved(){return this.src||!this.country&&!this.language?!1:this.code===void 0}connectedCallback(){super.connectedCallback(),this.sourceRestartPending=!0,flagResolverSubscribers.add(this.onResolverGeneration),this.syncErrorAnnouncementSink(),this.resolverGeneration!==flagResolverGeneration&&(this.resolverGeneration=flagResolverGeneration),this.requestUpdate()}disconnectedCallback(){this.resolveToken++,this.sourceRestartPending=!0,flagResolverSubscribers.delete(this.onResolverGeneration),this.releaseErrorAnnouncementSink(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.resolveToken++,this.sourceRestartPending=!0,this.releaseErrorAnnouncementSink(),this.syncErrorAnnouncementSink(),this.requestUpdate()}syncErrorAnnouncementSink(){this.isConnected&&this.errorAnnouncementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseErrorAnnouncementSink(),this.errorAnnouncementSink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseErrorAnnouncementSink(){this.errorAnnouncementSink?.release(),this.errorAnnouncementSink=void 0}announceLoadError(){this.errorAnnouncementSink?.announce(this.localize(FLAG_LOAD_ERROR_KEY))}setSourceState(state2,announceError=!1){this.sourceState=Object.freeze(state2),this.toggleAttribute("data-error",state2.status==="error"),this.toggleAttribute("data-unresolved",this.unresolved),this.setAttribute("aria-busy",String(state2.status==="loading")),announceError&&this.isConnected&&this.announceLoadError()}failSource(identity,announce=!0){this.setSourceState({status:"error",identity},announce)}onImageLoad(event,identity,url,request){const image=event.currentTarget;!this.isConnected||request!==this.activeSourceRequest||!image||image!==this.renderRoot.querySelector('[part="image"]')||this.sourceState.status!=="loading"||this.sourceState.identity!==identity||this.sourceState.url!==url||this.setSourceState({status:"loaded",identity,url})}onImageError(event,identity,request){const image=event.currentTarget;!this.isConnected||request!==this.activeSourceRequest||!image||image!==this.renderRoot.querySelector('[part="image"]')||this.sourceState.status!=="loading"||this.sourceState.identity!==identity||this.failSource(identity)}willUpdate(changed){super.willUpdate(changed);const sourceChanged=changed.has("country")||changed.has("language")||changed.has("src")||changed.has("fidelity")||changed.has("resolverGeneration");if(typeof Node<"u"&&!this.isConnected){sourceChanged&&(this.resolveToken++,this.sourceRestartPending=!0);return}if(this.hasUpdated&&!sourceChanged&&!this.sourceRestartPending)return;const connectionBaseline=this.sourceRestartPending;this.sourceRestartPending=!1;const token=++this.resolveToken,request=++this.activeSourceRequest,URLCtor=this.ownerDocument?.defaultView?.URL??globalThis.URL,directValue=typeof this.src=="string"?this.src.trim():"";if(directValue){const identity2=`direct:${directValue}`,url=safeMediaSrc(directValue,URLCtor);if(!url){this.failSource(identity2,!connectionBaseline);return}this.setSourceState({status:"loading",identity:identity2,url});return}const code=this.code;if(!code){this.setSourceState({status:"idle",identity:"idle"});return}const fidelity=this.effectiveFidelity,identity=`peer:${code}:${fidelity}:${this.resolverGeneration}`;this.setSourceState({status:"loading",identity}),loadFlagUrlResolver().then(async resolve=>{if(token!==this.resolveToken||request!==this.activeSourceRequest||!this.isConnected)return;if(typeof resolve!="function"){warnMissingFlagResolver(code),this.failSource(identity);return}const candidate=await resolve(code,fidelity==="standard"?void 0:{variant:fidelity});if(token!==this.resolveToken||request!==this.activeSourceRequest||!this.isConnected)return;if(candidate===void 0){this.setSourceState({status:"idle",identity});return}const url=safeMediaSrc(candidate,URLCtor);if(!url){this.failSource(identity);return}this.setSourceState({status:"loading",identity,url})}).catch(err=>{token!==this.resolveToken||request!==this.activeSourceRequest||!this.isConnected||(console.warn(`<lr-flag> failed to resolve a flag URL for "${code}":`,err),this.failSource(identity))})}updated(changed){super.updated(changed),this.setAttribute("aria-busy",String(this.sourceState.status==="loading")),this.toggleAttribute("data-unresolved",this.unresolved)}render(){const state2=this.sourceState,request=this.activeSourceRequest;if(this.unresolved){const fallbackUrl=this.fallback?safeMediaSrc(this.fallback,this.ownerDocument?.defaultView?.URL??globalThis.URL):null,fallbackAlt=hostAriaLabel(this)??this.label??"";return html`<slot name="fallback"
         >${fallbackUrl?html`<img part="fallback-image" src=${fallbackUrl} alt=${fallbackAlt} />`:nothing}</slot
       >`}if(state2.status==="error")return html`<span part="error">${this.localize(FLAG_LOAD_ERROR_KEY)}</span>`;const url=state2.status==="loading"||state2.status==="loaded"?state2.url:void 0;if(!url&&state2.status!=="loading")return html``;const code=this.code,alt=hostAriaLabel(this)??this.label??(code?displayNameFor(code,this.effectiveLocale):"");return html`
       ${state2.status==="loading"?html`

package/dist/components/media/image-viewer/image-viewer.class.d.ts

@@ -116,7 +116,8 @@ maxZoom:number;
 zoomStep:number;
 /** Clockwise rotation in 90-degree steps. */
 private _rotation;get rotation():LyraImageRotation;set rotation(value:LyraImageRotation);
-/** Enables region drawing via pointer or keyboard. */
+/** Enables region drawing via pointer or keyboard. The focused image wrapper owns drawing
+* commands and shows the shared focus ring inside its clipped viewport; descendant highlights retain activation. */
 annotatable:boolean;
 /** From `DocumentAnchorTarget` — only `region` anchors resolve here. */
 readonly anchorKinds:readonly LyraAnchorKind[];private loadState;private draft;private revealTarget;private highlightFocusId;private mediaLayoutSize;private errorAnnouncementSink?;private geometryObserver?;private observedWrapper?;private geometryFrame?;private geometryFrameOwner?;private frameEl?;private liveRegion?;private wrapperEl?;

package/dist/components/media/image-viewer/image-viewer.class.js

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{keyed}from"lit/directives/keyed.js";import{LyraElement}from"../../../internal/lyra-element.js";import{DocumentAnchorTarget}from"../../../internal/anchor-target.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{hostAriaLabel,srOnly}from"../../../internal/a11y.js";import{finiteNumber}from"../../../internal/numbers.js";import{chevronIcon}from"../../../internal/icons.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{styles}from"./image-viewer.styles.js";import{sanitizePercentRect}from"../../../internal/safe-css.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{LYRA_DEFAULT_anchorJumped,LYRA_DEFAULT_anchorJumpedToPage,LYRA_DEFAULT_anchorNotFound,LYRA_DEFAULT_documentPreviewEmpty,LYRA_DEFAULT_documentPreviewTypeImage,LYRA_DEFAULT_imageViewerAnnotate,LYRA_DEFAULT_imageViewerAnnotationAdded,LYRA_DEFAULT_imageViewerAnnotationBoxPosition,LYRA_DEFAULT_imageViewerAnnotationCancelled,LYRA_DEFAULT_imageViewerAnnotationHint,LYRA_DEFAULT_imageViewerFailedToLoad,LYRA_DEFAULT_imageViewerFitActual,LYRA_DEFAULT_imageViewerFitContain,LYRA_DEFAULT_imageViewerFitLabel,LYRA_DEFAULT_imageViewerFitWidth,LYRA_DEFAULT_imageViewerHighlightsLabel,LYRA_DEFAULT_imageViewerLabel,LYRA_DEFAULT_imageViewerRotate,LYRA_DEFAULT_imageViewerUnlabeledHighlight}from"../../../internal/default-strings.generated.js";const MIN_REGION_PERCENT=2,ARROW_STEP_PERCENT=2,IMAGE_VIEWER_HIGHLIGHT_LIMIT=200,IMAGE_FITS=new Set(["contain","width","actual"]);function normalizeImageFit(value){return IMAGE_FITS.has(value)?value:"contain"}function normalizeImageRotation(value){const degrees=typeof value=="number"?finiteNumber(value,0):0;return(Math.round(degrees/90)%4+4)%4*90}function normalizeImageRegionRect(value){const rect=sanitizePercentRect(value);if(!(!rect||rect.x<0||rect.y<0||rect.width<=0||rect.height<=0||rect.x+rect.width>100||rect.y+rect.height>100))return rect}function normalizeHighlightTone(value){return value==="success"||value==="warning"||value==="danger"||value==="neutral"?value:"accent"}function clamp(value,min,max){return Math.min(max,Math.max(min,value))}function screenPercentToImagePercent(px,py,rotation){switch(rotation){case 90:return{x:py,y:100-px};case 180:return{x:100-px,y:100-py};case 270:return{x:100-py,y:px};default:return{x:px,y:py}}}class LyraImageViewerBase extends LyraElement{}class LyraImageViewer extends DocumentAnchorTarget(LyraImageViewerBase){constructor(){super(...arguments),this.src="",this.name="",this._fit="contain",this.zoom=1,this.minZoom=.5,this.maxZoom=4,this.zoomStep=.25,this._rotation=0,this.annotatable=!1,this.anchorKinds=["region"],this.loadState={kind:"idle"},this.draft=null,this.revealTarget=null,this.highlightFocusId=null,this.mediaLayoutSize=null,this.zoomIn=()=>this.frameEl?.zoomIn(),this.zoomOut=()=>this.frameEl?.zoomOut(),this.resetZoom=()=>this.frameEl?.resetZoom(),this.onImgLoad=event=>{const img=event.target;img===this.shadowRoot?.querySelector('[part="image"]')&&(this.loadState={kind:"loaded"},this.emit("lr-load",{naturalWidth:img.naturalWidth,naturalHeight:img.naturalHeight}))},this.onImgError=event=>{event.target===this.shadowRoot?.querySelector('[part="image"]')&&(this.cancelPointerDraft(),this.revealTarget=null,this.loadState={kind:"error"},this.announceLoadError(),this.emit("lr-render-error",{error:new Error("The image failed to load.")}))},this.onFrameZoomChange=event=>{this.zoom=event.detail.zoom},this.toggleAnnotatable=()=>{this.hasOperableContent&&(this.annotatable=!this.annotatable)},this.onFitChange=event=>{this.fit=event.target.value},this.onWrapperKeyDown=event=>{if(!(!this.annotatable||!this.hasOperableContent)){if(!this.draft){event.key==="Enter"&&(event.preventDefault(),this.draft={x:37.5,y:37.5,width:25,height:25},this.announceDraftPosition());return}switch(event.key){case"ArrowLeft":event.preventDefault(),event.shiftKey?this.draft={...this.draft,width:clamp(this.draft.width-ARROW_STEP_PERCENT,MIN_REGION_PERCENT,100-this.draft.x)}:this.draft={...this.draft,x:clamp(this.draft.x-ARROW_STEP_PERCENT,0,100-this.draft.width)};break;case"ArrowRight":event.preventDefault(),event.shiftKey?this.draft={...this.draft,width:clamp(this.draft.width+ARROW_STEP_PERCENT,MIN_REGION_PERCENT,100-this.draft.x)}:this.draft={...this.draft,x:clamp(this.draft.x+ARROW_STEP_PERCENT,0,100-this.draft.width)};break;case"ArrowUp":event.preventDefault(),event.shiftKey?this.draft={...this.draft,height:clamp(this.draft.height-ARROW_STEP_PERCENT,MIN_REGION_PERCENT,100-this.draft.y)}:this.draft={...this.draft,y:clamp(this.draft.y-ARROW_STEP_PERCENT,0,100-this.draft.height)};break;case"ArrowDown":event.preventDefault(),event.shiftKey?this.draft={...this.draft,height:clamp(this.draft.height+ARROW_STEP_PERCENT,MIN_REGION_PERCENT,100-this.draft.y)}:this.draft={...this.draft,y:clamp(this.draft.y+ARROW_STEP_PERCENT,0,100-this.draft.height)};break;case"Enter":event.preventDefault(),this.commitDraft();return;case"Escape":event.preventDefault(),this.draft=null,this.liveRegion?.announce(this.localize("imageViewerAnnotationCancelled"),{force:!0});return;default:return}this.announceDraftPosition()}},this.pointerDraftId=null,this.pointerOrigin=null,this.onWrapperPointerDown=event=>{if(!this.annotatable||!this.hasOperableContent||!this.wrapperEl||!event.isPrimary||event.button!==0||this.pointerDraftId!==null)return;const rect=this.wrapperEl.getBoundingClientRect(),px=clamp((event.clientX-rect.left)/rect.width*100,0,100),py=clamp((event.clientY-rect.top)/rect.height*100,0,100),origin=screenPercentToImagePercent(px,py,this.safeRotation);this.pointerOrigin=origin,this.pointerDraftId=event.pointerId;try{this.wrapperEl.setPointerCapture(event.pointerId)}catch{}this.draft={x:origin.x,y:origin.y,width:0,height:0},event.preventDefault()},this.onWrapperPointerMove=event=>{if(this.pointerDraftId!==event.pointerId||!this.pointerOrigin||!this.wrapperEl)return;const rect=this.wrapperEl.getBoundingClientRect(),px=clamp((event.clientX-rect.left)/rect.width*100,0,100),py=clamp((event.clientY-rect.top)/rect.height*100,0,100),point=screenPercentToImagePercent(px,py,this.safeRotation),x=Math.min(this.pointerOrigin.x,point.x),y=Math.min(this.pointerOrigin.y,point.y),width=Math.abs(point.x-this.pointerOrigin.x),height=Math.abs(point.y-this.pointerOrigin.y);this.draft={x,y,width,height}},this.onWrapperPointerUp=event=>{if(this.pointerDraftId!==event.pointerId)return;const draft=this.draft;this.cancelPointerDraft(event.pointerId),draft&&draft.width>=MIN_REGION_PERCENT&&draft.height>=MIN_REGION_PERCENT&&(this.draft=draft,this.commitDraft())}}static{this.defaultStrings={...super.defaultStrings,anchorJumped:LYRA_DEFAULT_anchorJumped,anchorJumpedToPage:LYRA_DEFAULT_anchorJumpedToPage,anchorNotFound:LYRA_DEFAULT_anchorNotFound,documentPreviewEmpty:LYRA_DEFAULT_documentPreviewEmpty,documentPreviewTypeImage:LYRA_DEFAULT_documentPreviewTypeImage,imageViewerAnnotate:LYRA_DEFAULT_imageViewerAnnotate,imageViewerAnnotationAdded:LYRA_DEFAULT_imageViewerAnnotationAdded,imageViewerAnnotationBoxPosition:LYRA_DEFAULT_imageViewerAnnotationBoxPosition,imageViewerAnnotationCancelled:LYRA_DEFAULT_imageViewerAnnotationCancelled,imageViewerAnnotationHint:LYRA_DEFAULT_imageViewerAnnotationHint,imageViewerFailedToLoad:LYRA_DEFAULT_imageViewerFailedToLoad,imageViewerFitActual:LYRA_DEFAULT_imageViewerFitActual,imageViewerFitContain:LYRA_DEFAULT_imageViewerFitContain,imageViewerFitLabel:LYRA_DEFAULT_imageViewerFitLabel,imageViewerFitWidth:LYRA_DEFAULT_imageViewerFitWidth,imageViewerHighlightsLabel:LYRA_DEFAULT_imageViewerHighlightsLabel,imageViewerLabel:LYRA_DEFAULT_imageViewerLabel,imageViewerRotate:LYRA_DEFAULT_imageViewerRotate,imageViewerUnlabeledHighlight:LYRA_DEFAULT_imageViewerUnlabeledHighlight}}static{this.styles=[LyraElement.styles,styles,srOnly]}static{this.immutableEventDetails=Object.freeze(["lr-annotation-create"])}get fit(){return this._fit}set fit(value){const old=this._fit;this._fit=normalizeImageFit(value),this.requestUpdate("fit",old)}get rotation(){return this._rotation}set rotation(value){const old=this._rotation;this._rotation=normalizeImageRotation(value),this.requestUpdate("rotation",old)}get safeRotation(){return this.rotation}get hasOperableContent(){return this.loadState.kind==="loaded"}willUpdate(changed){if(super.willUpdate(changed),changed.has("src")){this.cancelPointerDraft(),this.revealTarget=null,this.mediaLayoutSize=null;const safeSrc=this.src?safeMediaSrc(this.src):null;this.loadState=safeSrc?{kind:"loading"}:this.src?{kind:"error"}:{kind:"idle"},this.hasUpdated&&this.src&&!safeSrc&&this.announceLoadError()}changed.has("annotatable")&&(!this.annotatable||!this.hasOperableContent)&&this.cancelPointerDraft()}updated(changed){super.updated(changed),changed.has("rotation")&&changed.get("rotation")!==void 0&&this.emit("lr-rotation-change",{rotation:this.safeRotation}),changed.has("fit")&&changed.get("fit")!==void 0&&this.emit("lr-fit-change",{fit:this.fit}),(changed.has("annotatable")||changed.has("loadState"))&&this.annotatable&&this.hasOperableContent&&(changed.has("loadState")||changed.get("annotatable")!==void 0)&&this.liveRegion?.announce(this.localize("imageViewerAnnotationHint"),{force:!0}),this.syncGeometryObserver()}rotate(){this.rotation=(this.safeRotation+90)%360}async applyAnchor(anchor){if(anchor.kind!=="region"||!this.hasOperableContent)return!1;const rect=normalizeImageRegionRect(anchor.rect);if(!rect)return!1;this.revealTarget=rect,await this.updateComplete;const target=this.shadowRoot?.querySelector("[data-reveal-target]"),viewport=this.frameEl?.shadowRoot?.querySelector('[part="viewport"]');if(!target||!viewport||target.getClientRects().length===0)return!1;target.scrollIntoView({block:"center",inline:"center"}),await new Promise(resolve=>{const view=this.ownerDocument.defaultView;view?view.requestAnimationFrame(()=>resolve()):resolve()});const targetRect=target.getBoundingClientRect(),viewportRect=viewport.getBoundingClientRect();return targetRect.right>viewportRect.left&&targetRect.left<viewportRect.right&&targetRect.bottom>viewportRect.top&&targetRect.top<viewportRect.bottom}connectedCallback(){super.connectedCallback(),this.syncErrorAnnouncementSink()}adoptedCallback(){super.adoptedCallback(),this.disconnectGeometryObserver(),this.releaseErrorAnnouncementSink(),this.syncErrorAnnouncementSink(),this.scheduleAfterUpdate(()=>this.syncGeometryObserver())}disconnectGeometryObserver(){this.geometryObserver?.disconnect(),this.geometryObserver=void 0,this.observedWrapper=void 0,this.geometryFrame!==void 0&&this.geometryFrameOwner?.cancelAnimationFrame(this.geometryFrame),this.geometryFrame=void 0,this.geometryFrameOwner=void 0}updateMediaLayoutSize(width,height){!Number.isFinite(width)||!Number.isFinite(height)||width<=0||height<=0||this.mediaLayoutSize?.width===width&&this.mediaLayoutSize.height===height||(this.mediaLayoutSize={width,height})}scheduleMediaLayoutSize(width,height){const view=this.ownerDocument.defaultView;if(!view){this.updateMediaLayoutSize(width,height);return}this.geometryFrame!==void 0&&this.geometryFrameOwner?.cancelAnimationFrame(this.geometryFrame),this.geometryFrameOwner=view,this.geometryFrame=view.requestAnimationFrame(()=>{this.geometryFrame=void 0,this.geometryFrameOwner=void 0,this.updateMediaLayoutSize(Math.round(width*100)/100,Math.round(height*100)/100)})}syncGeometryObserver(){const wrapper=this.wrapperEl;if(wrapper===this.observedWrapper||(this.disconnectGeometryObserver(),!wrapper))return;this.observedWrapper=wrapper,this.scheduleMediaLayoutSize(wrapper.offsetWidth,wrapper.offsetHeight);const ResizeObserverConstructor=this.ownerDocument.defaultView?.ResizeObserver;ResizeObserverConstructor&&(this.geometryObserver=new ResizeObserverConstructor(entries=>{const entry=entries.find(candidate=>candidate.target===this.observedWrapper);entry&&this.scheduleMediaLayoutSize(entry.contentRect.width,entry.contentRect.height)}),this.geometryObserver.observe(wrapper))}syncErrorAnnouncementSink(){this.isConnected&&this.errorAnnouncementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseErrorAnnouncementSink(),this.errorAnnouncementSink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseErrorAnnouncementSink(){this.errorAnnouncementSink?.release(),this.errorAnnouncementSink=void 0}announceLoadError(){this.errorAnnouncementSink?.announce(this.localize("imageViewerFailedToLoad"))}onHighlightActivate(id){this.activeHighlightId=id,this.emit("lr-highlight-activate",{highlightId:id})}announceDraftPosition(){if(!this.draft)return;const formatter=getNumberFormat(this.effectiveLocale,{maximumFractionDigits:0,useGrouping:!1});this.liveRegion?.announce(this.localize("imageViewerAnnotationBoxPosition",void 0,{x:formatter.format(Math.round(this.draft.x)),y:formatter.format(Math.round(this.draft.y)),width:formatter.format(Math.round(this.draft.width)),height:formatter.format(Math.round(this.draft.height))}))}commitDraft(){if(!this.draft)return;const rect={x:this.draft.x,y:this.draft.y,width:this.draft.width,height:this.draft.height};this.draft=null,this.emit("lr-annotation-create",{anchor:{kind:"region",rect}}),this.liveRegion?.announce(this.localize("imageViewerAnnotationAdded"),{force:!0})}cancelPointerDraft(pointerId=this.pointerDraftId,releaseCapture=!0){if(pointerId!=null&&this.pointerDraftId!==pointerId)return;const wrapper=this.wrapperEl,capturedPointerId=this.pointerDraftId;if(this.pointerDraftId=null,this.pointerOrigin=null,this.draft=null,releaseCapture&&wrapper&&capturedPointerId!=null)try{wrapper.releasePointerCapture(capturedPointerId)}catch{}}canonicalRegionHighlights(){const ids=new Set,result=[];for(const highlight of this.highlights){if(!highlight||typeof highlight.id!="string"||highlight.id.trim().length===0||ids.has(highlight.id)||highlight.anchor.kind!=="region")continue;const rect=normalizeImageRegionRect(highlight.anchor.rect);rect&&(ids.add(highlight.id),result.push({highlight,rect}))}return result}boundedRegionHighlights(){const all=this.canonicalRegionHighlights();if(all.length<=IMAGE_VIEWER_HIGHLIGHT_LIMIT)return{all,visible:all};const visible=all.slice(0,IMAGE_VIEWER_HIGHLIGHT_LIMIT),active=this.activeHighlightId?all.find(entry=>entry.highlight.id===this.activeHighlightId):void 0;return active&&!visible.includes(active)&&(visible[visible.length-1]=active),{all,visible}}onHighlightFocus(id){this.highlightFocusId=id}onHighlightKeyDown(event,id){const buttons=[...this.shadowRoot.querySelectorAll('[part="highlight"]')];if(buttons.length<2)return;const current=buttons.findIndex(button=>button.dataset.highlightId===id),rtl=this.effectiveDirection==="rtl";let next=current;if(event.key==="Home")next=0;else if(event.key==="End")next=buttons.length-1;else if(event.key==="ArrowDown"||event.key===(rtl?"ArrowLeft":"ArrowRight"))next=(current+1)%buttons.length;else if(event.key==="ArrowUp"||event.key===(rtl?"ArrowRight":"ArrowLeft"))next=(current-1+buttons.length)%buttons.length;else return;event.preventDefault();const target=buttons[next];this.highlightFocusId=target.dataset.highlightId??null,target.focus(),this.requestUpdate()}renderHighlights(){if(!this.hasOperableContent)return nothing;const{all:regionHighlights,visible}=this.boundedRegionHighlights();if(!regionHighlights.length)return nothing;const formatter=getNumberFormat(this.effectiveLocale,{maximumFractionDigits:0,useGrouping:!1}),preferredFocusId=visible.some(({highlight})=>highlight.id===this.highlightFocusId)?this.highlightFocusId:visible.some(({highlight})=>highlight.id===this.activeHighlightId)?this.activeHighlightId:visible[0]?.highlight.id??null;return html`<div
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{keyed}from"lit/directives/keyed.js";import{LyraElement}from"../../../internal/lyra-element.js";import{DocumentAnchorTarget}from"../../../internal/anchor-target.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{hostAriaLabel,srOnly}from"../../../internal/a11y.js";import{finiteNumber}from"../../../internal/numbers.js";import{chevronIcon}from"../../../internal/icons.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{styles}from"./image-viewer.styles.js";import{sanitizePercentRect}from"../../../internal/safe-css.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{LYRA_DEFAULT_anchorJumped,LYRA_DEFAULT_anchorJumpedToPage,LYRA_DEFAULT_anchorNotFound,LYRA_DEFAULT_documentPreviewEmpty,LYRA_DEFAULT_documentPreviewTypeImage,LYRA_DEFAULT_imageViewerAnnotate,LYRA_DEFAULT_imageViewerAnnotationAdded,LYRA_DEFAULT_imageViewerAnnotationBoxPosition,LYRA_DEFAULT_imageViewerAnnotationCancelled,LYRA_DEFAULT_imageViewerAnnotationHint,LYRA_DEFAULT_imageViewerFailedToLoad,LYRA_DEFAULT_imageViewerFitActual,LYRA_DEFAULT_imageViewerFitContain,LYRA_DEFAULT_imageViewerFitLabel,LYRA_DEFAULT_imageViewerFitWidth,LYRA_DEFAULT_imageViewerHighlightsLabel,LYRA_DEFAULT_imageViewerLabel,LYRA_DEFAULT_imageViewerRotate,LYRA_DEFAULT_imageViewerUnlabeledHighlight}from"../../../internal/default-strings.generated.js";const MIN_REGION_PERCENT=2,ARROW_STEP_PERCENT=2,IMAGE_VIEWER_HIGHLIGHT_LIMIT=200,IMAGE_FITS=new Set(["contain","width","actual"]);function normalizeImageFit(value){return IMAGE_FITS.has(value)?value:"contain"}function normalizeImageRotation(value){const degrees=typeof value=="number"?finiteNumber(value,0):0;return(Math.round(degrees/90)%4+4)%4*90}function normalizeImageRegionRect(value){const rect=sanitizePercentRect(value);if(!(!rect||rect.x<0||rect.y<0||rect.width<=0||rect.height<=0||rect.x+rect.width>100||rect.y+rect.height>100))return rect}function normalizeHighlightTone(value){return value==="success"||value==="warning"||value==="danger"||value==="neutral"?value:"accent"}function clamp(value,min,max){return Math.min(max,Math.max(min,value))}function screenPercentToImagePercent(px,py,rotation){switch(rotation){case 90:return{x:py,y:100-px};case 180:return{x:100-px,y:100-py};case 270:return{x:100-py,y:px};default:return{x:px,y:py}}}class LyraImageViewerBase extends LyraElement{}class LyraImageViewer extends DocumentAnchorTarget(LyraImageViewerBase){constructor(){super(...arguments),this.src="",this.name="",this._fit="contain",this.zoom=1,this.minZoom=.5,this.maxZoom=4,this.zoomStep=.25,this._rotation=0,this.annotatable=!1,this.anchorKinds=["region"],this.loadState={kind:"idle"},this.draft=null,this.revealTarget=null,this.highlightFocusId=null,this.mediaLayoutSize=null,this.zoomIn=()=>this.frameEl?.zoomIn(),this.zoomOut=()=>this.frameEl?.zoomOut(),this.resetZoom=()=>this.frameEl?.resetZoom(),this.onImgLoad=event=>{const img=event.target;img===this.shadowRoot?.querySelector('[part="image"]')&&(this.loadState={kind:"loaded"},this.emit("lr-load",{naturalWidth:img.naturalWidth,naturalHeight:img.naturalHeight}))},this.onImgError=event=>{event.target===this.shadowRoot?.querySelector('[part="image"]')&&(this.cancelPointerDraft(),this.revealTarget=null,this.loadState={kind:"error"},this.announceLoadError(),this.emit("lr-render-error",{error:new Error("The image failed to load.")}))},this.onFrameZoomChange=event=>{this.zoom=event.detail.zoom},this.toggleAnnotatable=()=>{this.hasOperableContent&&(this.annotatable=!this.annotatable)},this.onFitChange=event=>{this.fit=event.target.value},this.onWrapperKeyDown=event=>{if(event.target===event.currentTarget&&!(!this.annotatable||!this.hasOperableContent)){if(!this.draft){event.key==="Enter"&&(event.preventDefault(),this.draft={x:37.5,y:37.5,width:25,height:25},this.announceDraftPosition());return}switch(event.key){case"ArrowLeft":event.preventDefault(),event.shiftKey?this.draft={...this.draft,width:clamp(this.draft.width-ARROW_STEP_PERCENT,MIN_REGION_PERCENT,100-this.draft.x)}:this.draft={...this.draft,x:clamp(this.draft.x-ARROW_STEP_PERCENT,0,100-this.draft.width)};break;case"ArrowRight":event.preventDefault(),event.shiftKey?this.draft={...this.draft,width:clamp(this.draft.width+ARROW_STEP_PERCENT,MIN_REGION_PERCENT,100-this.draft.x)}:this.draft={...this.draft,x:clamp(this.draft.x+ARROW_STEP_PERCENT,0,100-this.draft.width)};break;case"ArrowUp":event.preventDefault(),event.shiftKey?this.draft={...this.draft,height:clamp(this.draft.height-ARROW_STEP_PERCENT,MIN_REGION_PERCENT,100-this.draft.y)}:this.draft={...this.draft,y:clamp(this.draft.y-ARROW_STEP_PERCENT,0,100-this.draft.height)};break;case"ArrowDown":event.preventDefault(),event.shiftKey?this.draft={...this.draft,height:clamp(this.draft.height+ARROW_STEP_PERCENT,MIN_REGION_PERCENT,100-this.draft.y)}:this.draft={...this.draft,y:clamp(this.draft.y+ARROW_STEP_PERCENT,0,100-this.draft.height)};break;case"Enter":event.preventDefault(),this.commitDraft();return;case"Escape":event.preventDefault(),this.draft=null,this.liveRegion?.announce(this.localize("imageViewerAnnotationCancelled"),{force:!0});return;default:return}this.announceDraftPosition()}},this.pointerDraftId=null,this.pointerOrigin=null,this.onWrapperPointerDown=event=>{if(!this.annotatable||!this.hasOperableContent||!this.wrapperEl||!event.isPrimary||event.button!==0||this.pointerDraftId!==null)return;const rect=this.wrapperEl.getBoundingClientRect(),px=clamp((event.clientX-rect.left)/rect.width*100,0,100),py=clamp((event.clientY-rect.top)/rect.height*100,0,100),origin=screenPercentToImagePercent(px,py,this.safeRotation);this.pointerOrigin=origin,this.pointerDraftId=event.pointerId;try{this.wrapperEl.setPointerCapture(event.pointerId)}catch{}this.draft={x:origin.x,y:origin.y,width:0,height:0},event.preventDefault()},this.onWrapperPointerMove=event=>{if(this.pointerDraftId!==event.pointerId||!this.pointerOrigin||!this.wrapperEl)return;const rect=this.wrapperEl.getBoundingClientRect(),px=clamp((event.clientX-rect.left)/rect.width*100,0,100),py=clamp((event.clientY-rect.top)/rect.height*100,0,100),point=screenPercentToImagePercent(px,py,this.safeRotation),x=Math.min(this.pointerOrigin.x,point.x),y=Math.min(this.pointerOrigin.y,point.y),width=Math.abs(point.x-this.pointerOrigin.x),height=Math.abs(point.y-this.pointerOrigin.y);this.draft={x,y,width,height}},this.onWrapperPointerUp=event=>{if(this.pointerDraftId!==event.pointerId)return;const draft=this.draft;this.cancelPointerDraft(event.pointerId),draft&&draft.width>=MIN_REGION_PERCENT&&draft.height>=MIN_REGION_PERCENT&&(this.draft=draft,this.commitDraft())}}static{this.defaultStrings={...super.defaultStrings,anchorJumped:LYRA_DEFAULT_anchorJumped,anchorJumpedToPage:LYRA_DEFAULT_anchorJumpedToPage,anchorNotFound:LYRA_DEFAULT_anchorNotFound,documentPreviewEmpty:LYRA_DEFAULT_documentPreviewEmpty,documentPreviewTypeImage:LYRA_DEFAULT_documentPreviewTypeImage,imageViewerAnnotate:LYRA_DEFAULT_imageViewerAnnotate,imageViewerAnnotationAdded:LYRA_DEFAULT_imageViewerAnnotationAdded,imageViewerAnnotationBoxPosition:LYRA_DEFAULT_imageViewerAnnotationBoxPosition,imageViewerAnnotationCancelled:LYRA_DEFAULT_imageViewerAnnotationCancelled,imageViewerAnnotationHint:LYRA_DEFAULT_imageViewerAnnotationHint,imageViewerFailedToLoad:LYRA_DEFAULT_imageViewerFailedToLoad,imageViewerFitActual:LYRA_DEFAULT_imageViewerFitActual,imageViewerFitContain:LYRA_DEFAULT_imageViewerFitContain,imageViewerFitLabel:LYRA_DEFAULT_imageViewerFitLabel,imageViewerFitWidth:LYRA_DEFAULT_imageViewerFitWidth,imageViewerHighlightsLabel:LYRA_DEFAULT_imageViewerHighlightsLabel,imageViewerLabel:LYRA_DEFAULT_imageViewerLabel,imageViewerRotate:LYRA_DEFAULT_imageViewerRotate,imageViewerUnlabeledHighlight:LYRA_DEFAULT_imageViewerUnlabeledHighlight}}static{this.styles=[LyraElement.styles,styles,srOnly]}static{this.immutableEventDetails=Object.freeze(["lr-annotation-create"])}get fit(){return this._fit}set fit(value){const old=this._fit;this._fit=normalizeImageFit(value),this.requestUpdate("fit",old)}get rotation(){return this._rotation}set rotation(value){const old=this._rotation;this._rotation=normalizeImageRotation(value),this.requestUpdate("rotation",old)}get safeRotation(){return this.rotation}get hasOperableContent(){return this.loadState.kind==="loaded"}willUpdate(changed){if(super.willUpdate(changed),changed.has("src")){this.cancelPointerDraft(),this.revealTarget=null,this.mediaLayoutSize=null;const safeSrc=this.src?safeMediaSrc(this.src):null;this.loadState=safeSrc?{kind:"loading"}:this.src?{kind:"error"}:{kind:"idle"},this.hasUpdated&&this.src&&!safeSrc&&this.announceLoadError()}changed.has("annotatable")&&(!this.annotatable||!this.hasOperableContent)&&this.cancelPointerDraft()}updated(changed){super.updated(changed),changed.has("rotation")&&changed.get("rotation")!==void 0&&this.emit("lr-rotation-change",{rotation:this.safeRotation}),changed.has("fit")&&changed.get("fit")!==void 0&&this.emit("lr-fit-change",{fit:this.fit}),(changed.has("annotatable")||changed.has("loadState"))&&this.annotatable&&this.hasOperableContent&&(changed.has("loadState")||changed.get("annotatable")!==void 0)&&this.liveRegion?.announce(this.localize("imageViewerAnnotationHint"),{force:!0}),this.syncGeometryObserver()}rotate(){this.rotation=(this.safeRotation+90)%360}async applyAnchor(anchor){if(anchor.kind!=="region"||!this.hasOperableContent)return!1;const rect=normalizeImageRegionRect(anchor.rect);if(!rect)return!1;this.revealTarget=rect,await this.updateComplete;const target=this.shadowRoot?.querySelector("[data-reveal-target]"),viewport=this.frameEl?.shadowRoot?.querySelector('[part="viewport"]');if(!target||!viewport||target.getClientRects().length===0)return!1;target.scrollIntoView({block:"center",inline:"center"}),await new Promise(resolve=>{const view=this.ownerDocument.defaultView;view?view.requestAnimationFrame(()=>resolve()):resolve()});const targetRect=target.getBoundingClientRect(),viewportRect=viewport.getBoundingClientRect();return targetRect.right>viewportRect.left&&targetRect.left<viewportRect.right&&targetRect.bottom>viewportRect.top&&targetRect.top<viewportRect.bottom}connectedCallback(){super.connectedCallback(),this.syncErrorAnnouncementSink()}adoptedCallback(){super.adoptedCallback(),this.disconnectGeometryObserver(),this.releaseErrorAnnouncementSink(),this.syncErrorAnnouncementSink(),this.scheduleAfterUpdate(()=>this.syncGeometryObserver())}disconnectGeometryObserver(){this.geometryObserver?.disconnect(),this.geometryObserver=void 0,this.observedWrapper=void 0,this.geometryFrame!==void 0&&this.geometryFrameOwner?.cancelAnimationFrame(this.geometryFrame),this.geometryFrame=void 0,this.geometryFrameOwner=void 0}updateMediaLayoutSize(width,height){!Number.isFinite(width)||!Number.isFinite(height)||width<=0||height<=0||this.mediaLayoutSize?.width===width&&this.mediaLayoutSize.height===height||(this.mediaLayoutSize={width,height})}scheduleMediaLayoutSize(width,height){const view=this.ownerDocument.defaultView;if(!view){this.updateMediaLayoutSize(width,height);return}this.geometryFrame!==void 0&&this.geometryFrameOwner?.cancelAnimationFrame(this.geometryFrame),this.geometryFrameOwner=view,this.geometryFrame=view.requestAnimationFrame(()=>{this.geometryFrame=void 0,this.geometryFrameOwner=void 0,this.updateMediaLayoutSize(Math.round(width*100)/100,Math.round(height*100)/100)})}syncGeometryObserver(){const wrapper=this.wrapperEl;if(wrapper===this.observedWrapper||(this.disconnectGeometryObserver(),!wrapper))return;this.observedWrapper=wrapper,this.scheduleMediaLayoutSize(wrapper.offsetWidth,wrapper.offsetHeight);const ResizeObserverConstructor=this.ownerDocument.defaultView?.ResizeObserver;ResizeObserverConstructor&&(this.geometryObserver=new ResizeObserverConstructor(entries=>{const entry=entries.find(candidate=>candidate.target===this.observedWrapper);entry&&this.scheduleMediaLayoutSize(entry.contentRect.width,entry.contentRect.height)}),this.geometryObserver.observe(wrapper))}syncErrorAnnouncementSink(){this.isConnected&&this.errorAnnouncementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseErrorAnnouncementSink(),this.errorAnnouncementSink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseErrorAnnouncementSink(){this.errorAnnouncementSink?.release(),this.errorAnnouncementSink=void 0}announceLoadError(){this.errorAnnouncementSink?.announce(this.localize("imageViewerFailedToLoad"))}onHighlightActivate(id){this.activeHighlightId=id,this.emit("lr-highlight-activate",{highlightId:id})}announceDraftPosition(){if(!this.draft)return;const formatter=getNumberFormat(this.effectiveLocale,{maximumFractionDigits:0,useGrouping:!1});this.liveRegion?.announce(this.localize("imageViewerAnnotationBoxPosition",void 0,{x:formatter.format(Math.round(this.draft.x)),y:formatter.format(Math.round(this.draft.y)),width:formatter.format(Math.round(this.draft.width)),height:formatter.format(Math.round(this.draft.height))}))}commitDraft(){if(!this.draft)return;const rect={x:this.draft.x,y:this.draft.y,width:this.draft.width,height:this.draft.height};this.draft=null,this.emit("lr-annotation-create",{anchor:{kind:"region",rect}}),this.liveRegion?.announce(this.localize("imageViewerAnnotationAdded"),{force:!0})}cancelPointerDraft(pointerId=this.pointerDraftId,releaseCapture=!0){if(pointerId!=null&&this.pointerDraftId!==pointerId)return;const wrapper=this.wrapperEl,capturedPointerId=this.pointerDraftId;if(this.pointerDraftId=null,this.pointerOrigin=null,this.draft=null,releaseCapture&&wrapper&&capturedPointerId!=null)try{wrapper.releasePointerCapture(capturedPointerId)}catch{}}canonicalRegionHighlights(){const ids=new Set,result=[];for(const highlight of this.highlights){if(!highlight||typeof highlight.id!="string"||highlight.id.trim().length===0||ids.has(highlight.id)||highlight.anchor.kind!=="region")continue;const rect=normalizeImageRegionRect(highlight.anchor.rect);rect&&(ids.add(highlight.id),result.push({highlight,rect}))}return result}boundedRegionHighlights(){const all=this.canonicalRegionHighlights();if(all.length<=IMAGE_VIEWER_HIGHLIGHT_LIMIT)return{all,visible:all};const visible=all.slice(0,IMAGE_VIEWER_HIGHLIGHT_LIMIT),active=this.activeHighlightId?all.find(entry=>entry.highlight.id===this.activeHighlightId):void 0;return active&&!visible.includes(active)&&(visible[visible.length-1]=active),{all,visible}}onHighlightFocus(id){this.highlightFocusId=id}onHighlightKeyDown(event,id){const buttons=[...this.shadowRoot.querySelectorAll('[part="highlight"]')];if(buttons.length<2)return;const current=buttons.findIndex(button=>button.dataset.highlightId===id),rtl=this.effectiveDirection==="rtl";let next=current;if(event.key==="Home")next=0;else if(event.key==="End")next=buttons.length-1;else if(event.key==="ArrowDown"||event.key===(rtl?"ArrowLeft":"ArrowRight"))next=(current+1)%buttons.length;else if(event.key==="ArrowUp"||event.key===(rtl?"ArrowRight":"ArrowLeft"))next=(current-1+buttons.length)%buttons.length;else return;event.preventDefault();const target=buttons[next];this.highlightFocusId=target.dataset.highlightId??null,target.focus(),this.requestUpdate()}renderHighlights(){if(!this.hasOperableContent)return nothing;const{all:regionHighlights,visible}=this.boundedRegionHighlights();if(!regionHighlights.length)return nothing;const formatter=getNumberFormat(this.effectiveLocale,{maximumFractionDigits:0,useGrouping:!1}),preferredFocusId=visible.some(({highlight})=>highlight.id===this.highlightFocusId)?this.highlightFocusId:visible.some(({highlight})=>highlight.id===this.activeHighlightId)?this.activeHighlightId:visible[0]?.highlight.id??null;return html`<div
       part="highlight-layer"
       role="group"
       aria-label=${this.localize("imageViewerHighlightsLabel")}

package/dist/components/media/image-viewer/image-viewer.styles.js

@@ -1 +1 @@
-import{css}from"lit";const styles=css`:host{min-inline-size:0;display:block}[part=base]{gap:var(--lr-space-s);flex-direction:column;min-inline-size:0;max-inline-size:100%;display:flex}[part=toolbar]{align-items:center;gap:var(--lr-space-xs);flex-wrap:wrap;display:flex}.fit-control-wrapper{align-items:center;min-inline-size:0;max-inline-size:100%;display:inline-flex;position:relative}[part=fit-control],[part=rotate-button],[part=annotate-toggle]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit;cursor:pointer}[part=fit-control]:disabled,[part=rotate-button]:disabled,[part=annotate-toggle]:disabled{opacity:var(--lr-opacity-disabled);cursor:not-allowed}[part=fit-control]{appearance:none;max-inline-size:100%;padding-inline:var(--lr-space-s) var(--lr-space-l);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}[part=fit-control] option{background:var(--lr-color-surface);color:var(--lr-color-text)}[part=fit-control]:hover,[part=rotate-button]:hover,[part=annotate-toggle]:hover{background:var(--lr-color-brand-quiet)}[part=fit-control]:active,[part=rotate-button]:active,[part=annotate-toggle]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=fit-control]:focus-visible,[part=rotate-button]:focus-visible,[part=annotate-toggle]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}.fit-control-chevron{color:var(--lr-color-text-quiet);line-height:var(--lr-line-height-none);pointer-events:none;display:inline-flex;position:absolute;inset-inline-end:var(--lr-space-xs)}.fit-control-chevron svg{transform:rotate(90deg)}[part=annotate-toggle][aria-pressed=true]{background:var(--lr-image-viewer-annotate-active-bg,var(--lr-color-brand-quiet));border-color:var(--lr-image-viewer-annotate-active-border,var(--lr-color-brand))}[part=annotate-toggle][aria-pressed=true]:active{background:color-mix(in oklab, var(--lr-image-viewer-annotate-active-bg,var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=rotation-frame]{max-inline-size:100%;display:inline-block;position:relative}:host([fit=actual]) [part=rotation-frame]{max-inline-size:none}[part=rotation-frame][data-measured] [part=image-wrapper]{position:absolute;top:50%;left:50%}[part=image-wrapper]{max-inline-size:100%;transition:transform var(--lr-transition-base);outline:none;display:inline-block;position:relative}:host([fit=actual]) [part=image-wrapper]{max-inline-size:none}@media (prefers-reduced-motion:reduce){[part=image-wrapper]{transition:none}}:host([fit=contain]) [part=frame]::part(content),:host([fit=width]) [part=frame]::part(content){inline-size:100%}[part=image]{display:block}:host(:not([fit=actual])) [part=image]{max-inline-size:100%}:host([fit=width]) [part=image]{block-size:auto;inline-size:100%}:host([fit=contain]) [part=image]{max-block-size:var(--lr-pan-zoom-min-block-size,var(--lr-size-10rem));object-fit:contain;block-size:auto}[part=highlight-layer]{position:absolute;inset:0}[part=highlight]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);border:var(--lr-border-width-medium) solid var(--lr-image-viewer-highlight-border,var(--lr-color-brand));--_lr-image-viewer-highlight-fill:var(--lr-image-viewer-highlight-bg,color-mix(in srgb, var(--lr-color-brand) 20%, transparent));background:var(--lr-image-viewer-highlight-fill,var(--_lr-image-viewer-highlight-fill));cursor:pointer;padding:0;position:absolute}[part=highlight]:where([data-tone=success]){border-style:double;border-color:var(--lr-image-viewer-highlight-success-border,var(--lr-color-success));--_lr-image-viewer-highlight-fill:var(--lr-image-viewer-highlight-success-bg,color-mix(in srgb, var(--lr-color-success) 20%, transparent))}[part=highlight]:where([data-tone=warning]){border-style:dashed;border-color:var(--lr-image-viewer-highlight-warning-border,var(--lr-color-warning));--_lr-image-viewer-highlight-fill:var(--lr-image-viewer-highlight-warning-bg,color-mix(in srgb, var(--lr-color-warning) 20%, transparent))}[part=highlight]:where([data-tone=danger]){border-style:dotted;border-color:var(--lr-image-viewer-highlight-danger-border,var(--lr-color-danger));--_lr-image-viewer-highlight-fill:var(--lr-image-viewer-highlight-danger-bg,color-mix(in srgb, var(--lr-color-danger) 20%, transparent))}[part=highlight]:where([data-tone=neutral]){border-style:groove;border-color:var(--lr-image-viewer-highlight-neutral-border,var(--lr-color-border));--_lr-image-viewer-highlight-fill:var(--lr-image-viewer-highlight-neutral-bg,color-mix(in srgb, var(--lr-color-text) 12%, transparent))}[part=highlight]:where([data-active]){border-width:var(--lr-image-viewer-highlight-active-border-width,var(--lr-border-width-thick));outline:var(--lr-image-viewer-highlight-active-outline-width,var(--lr-focus-ring-width)) solid var(--lr-image-viewer-highlight-active-color,var(--lr-color-brand));outline-offset:var(--lr-image-viewer-highlight-active-outline-offset,var(--lr-focus-ring-offset))}[part=highlight]:hover{background:color-mix(in oklab, var(--lr-image-viewer-highlight-fill,var(--_lr-image-viewer-highlight-fill)), var(--lr-color-mix-partner) var(--lr-color-mix-hover))}[part=highlight]:active{background:color-mix(in oklab, var(--lr-image-viewer-highlight-fill,var(--_lr-image-viewer-highlight-fill)), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=highlight]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}[part=highlight-label]{inset-block-start:calc(var(--lr-size-1-5em) * -1);font-size:var(--lr-font-size-xs);color:var(--lr-color-text);background:var(--lr-color-surface);padding-inline:var(--lr-space-2xs);max-inline-size:min(var(--lr-size-16rem), 100%);white-space:normal;overflow-wrap:anywhere;position:absolute;left:0}[part=annotation-box]{border:var(--lr-border-width-medium) dashed var(--lr-color-brand);background:color-mix(in srgb, var(--lr-color-brand) 15%, transparent);pointer-events:none;position:absolute}.reveal-target{pointer-events:none;position:absolute}@media (forced-colors:active){[part=fit-control]:hover:not(:disabled),[part=rotate-button]:hover:not(:disabled),[part=annotate-toggle]:hover:not(:disabled){outline:var(--lr-border-width-thin) dashed Highlight;outline-offset:calc(-1 * var(--lr-border-width-thin))}[part=fit-control]:active:not(:disabled),[part=rotate-button]:active:not(:disabled),[part=annotate-toggle]:active:not(:disabled){outline-style:double;outline-width:var(--lr-border-width-medium)}[part=annotate-toggle][aria-pressed=true]{border-style:double;border-color:highlight}[part=highlight]{forced-color-adjust:none;background:0 0;border-color:canvastext}[part=highlight]:where([data-active]){outline-color:highlight}}.empty-note,[part=error]{color:var(--lr-color-text-quiet);font-size:var(--lr-font-size-md-sm);text-align:center;padding:var(--lr-space-l);margin:0}[part=error]{color:var(--lr-color-danger)}`;export{styles};
+import{css}from"lit";const styles=css`:host{min-inline-size:0;display:block}[part=base]{gap:var(--lr-space-s);flex-direction:column;min-inline-size:0;max-inline-size:100%;display:flex}[part=toolbar]{align-items:center;gap:var(--lr-space-xs);flex-wrap:wrap;display:flex}.fit-control-wrapper{align-items:center;min-inline-size:0;max-inline-size:100%;display:inline-flex;position:relative}[part=fit-control],[part=rotate-button],[part=annotate-toggle]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit;cursor:pointer}[part=fit-control]:disabled,[part=rotate-button]:disabled,[part=annotate-toggle]:disabled{opacity:var(--lr-opacity-disabled);cursor:not-allowed}[part=fit-control]{appearance:none;max-inline-size:100%;padding-inline:var(--lr-space-s) var(--lr-space-l);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}[part=fit-control] option{background:var(--lr-color-surface);color:var(--lr-color-text)}[part=fit-control]:where(:not(:disabled)):hover,[part=rotate-button]:where(:not(:disabled)):hover,[part=annotate-toggle]:where(:not(:disabled)):hover{background:var(--lr-color-brand-quiet)}[part=fit-control]:where(:not(:disabled)):active,[part=rotate-button]:where(:not(:disabled)):active,[part=annotate-toggle]:where(:not(:disabled)):active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=fit-control]:focus-visible,[part=rotate-button]:focus-visible,[part=annotate-toggle]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}.fit-control-chevron{color:var(--lr-color-text-quiet);line-height:var(--lr-line-height-none);pointer-events:none;display:inline-flex;position:absolute;inset-inline-end:var(--lr-space-xs)}.fit-control-chevron svg{transform:rotate(90deg)}[part=annotate-toggle][aria-pressed=true]{background:var(--lr-image-viewer-annotate-active-bg,var(--lr-color-brand-quiet));border-color:var(--lr-image-viewer-annotate-active-border,var(--lr-color-brand))}[part=annotate-toggle][aria-pressed=true]:where(:not(:disabled)):active{background:color-mix(in oklab, var(--lr-image-viewer-annotate-active-bg,var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=rotation-frame]{max-inline-size:100%;display:inline-block;position:relative}:host([fit=actual]) [part=rotation-frame]{max-inline-size:none}[part=rotation-frame][data-measured] [part=image-wrapper]{position:absolute;top:50%;left:50%}[part=image-wrapper]{max-inline-size:100%;transition:transform var(--lr-transition-base);outline:none;display:inline-block;position:relative}[part=image-wrapper]:focus-visible{outline:var(--lr-focus-ring);outline-offset:calc(-1 * max(var(--lr-focus-ring-width), var(--lr-focus-ring-width) + var(--lr-focus-ring-offset)))}:host([fit=actual]) [part=image-wrapper]{max-inline-size:none}@media (prefers-reduced-motion:reduce){[part=image-wrapper]{transition:none}}:host([fit=contain]) [part=frame]::part(content),:host([fit=width]) [part=frame]::part(content){inline-size:100%}[part=image]{display:block}:host(:not([fit=actual])) [part=image]{max-inline-size:100%}:host([fit=width]) [part=image]{block-size:auto;inline-size:100%}:host([fit=contain]) [part=image]{max-block-size:var(--lr-pan-zoom-min-block-size,var(--lr-size-10rem));object-fit:contain;block-size:auto}[part=highlight-layer]{position:absolute;inset:0}[part=highlight]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);border:var(--lr-border-width-medium) solid var(--lr-image-viewer-highlight-border,var(--lr-color-brand));--_lr-image-viewer-highlight-fill:var(--lr-image-viewer-highlight-bg,color-mix(in srgb, var(--lr-color-brand) 20%, transparent));background:var(--lr-image-viewer-highlight-fill,var(--_lr-image-viewer-highlight-fill));cursor:pointer;padding:0;position:absolute}[part=highlight]:where([data-tone=success]){border-style:double;border-color:var(--lr-image-viewer-highlight-success-border,var(--lr-color-success));--_lr-image-viewer-highlight-fill:var(--lr-image-viewer-highlight-success-bg,color-mix(in srgb, var(--lr-color-success) 20%, transparent))}[part=highlight]:where([data-tone=warning]){border-style:dashed;border-color:var(--lr-image-viewer-highlight-warning-border,var(--lr-color-warning));--_lr-image-viewer-highlight-fill:var(--lr-image-viewer-highlight-warning-bg,color-mix(in srgb, var(--lr-color-warning) 20%, transparent))}[part=highlight]:where([data-tone=danger]){border-style:dotted;border-color:var(--lr-image-viewer-highlight-danger-border,var(--lr-color-danger));--_lr-image-viewer-highlight-fill:var(--lr-image-viewer-highlight-danger-bg,color-mix(in srgb, var(--lr-color-danger) 20%, transparent))}[part=highlight]:where([data-tone=neutral]){border-style:groove;border-color:var(--lr-image-viewer-highlight-neutral-border,var(--lr-color-border));--_lr-image-viewer-highlight-fill:var(--lr-image-viewer-highlight-neutral-bg,color-mix(in srgb, var(--lr-color-text) 12%, transparent))}[part=highlight]:where([data-active]){border-width:var(--lr-image-viewer-highlight-active-border-width,var(--lr-border-width-thick));outline:var(--lr-image-viewer-highlight-active-outline-width,var(--lr-focus-ring-width)) solid var(--lr-image-viewer-highlight-active-color,var(--lr-color-brand));outline-offset:var(--lr-image-viewer-highlight-active-outline-offset,var(--lr-focus-ring-offset))}[part=highlight]:hover{background:color-mix(in oklab, var(--lr-image-viewer-highlight-fill,var(--_lr-image-viewer-highlight-fill)), var(--lr-color-mix-partner) var(--lr-color-mix-hover))}[part=highlight]:active{background:color-mix(in oklab, var(--lr-image-viewer-highlight-fill,var(--_lr-image-viewer-highlight-fill)), var(--lr-color-mix-partner) var(--lr-color-mix-active))}[part=highlight]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}[part=highlight-label]{inset-block-start:calc(var(--lr-size-1-5em) * -1);font-size:var(--lr-font-size-xs);color:var(--lr-color-text);background:var(--lr-color-surface);padding-inline:var(--lr-space-2xs);max-inline-size:min(var(--lr-size-16rem), 100%);white-space:normal;overflow-wrap:anywhere;position:absolute;left:0}[part=annotation-box]{border:var(--lr-border-width-medium) dashed var(--lr-color-brand);background:color-mix(in srgb, var(--lr-color-brand) 15%, transparent);pointer-events:none;position:absolute}.reveal-target{pointer-events:none;position:absolute}@media (forced-colors:active){[part=fit-control]:hover:not(:disabled),[part=rotate-button]:hover:not(:disabled),[part=annotate-toggle]:hover:not(:disabled){outline:var(--lr-border-width-thin) dashed Highlight;outline-offset:calc(-1 * var(--lr-border-width-thin))}[part=fit-control]:active:not(:disabled),[part=rotate-button]:active:not(:disabled),[part=annotate-toggle]:active:not(:disabled){outline-style:double;outline-width:var(--lr-border-width-medium)}[part=annotate-toggle][aria-pressed=true]{border-style:double;border-color:highlight}[part=highlight]{forced-color-adjust:none;background:0 0;border-color:canvastext}[part=highlight]:where([data-active]){outline-color:highlight}}.empty-note,[part=error]{color:var(--lr-color-text-quiet);font-size:var(--lr-font-size-md-sm);text-align:center;padding:var(--lr-space-l);margin:0}[part=error]{color:var(--lr-color-danger)}`;export{styles};

package/dist/components/media/lightbox/lightbox.styles.js

@@ -1 +1 @@
-import{css}from"lit";const styles=css`:host{--_lr-lightbox-overlay-color:var(--lr-color-overlay-strong);--_lr-lightbox-control-bg:var(--lr-color-neutral);--_lr-lightbox-control-color:var(--lr-color-on-neutral);z-index:var(--lr-overlay-stack-index,var(--lr-layer-modal));contain-intrinsic-inline-size:var(--lr-size-20rem);padding-block-start:max(var(--lr-space-l), var(--lr-safe-area-top));padding-block-end:max(var(--lr-space-l), var(--lr-safe-area-bottom));padding-inline-start:max(var(--lr-space-l), var(--lr-safe-area-inline-start));padding-inline-end:max(var(--lr-space-l), var(--lr-safe-area-inline-end));display:none;position:fixed;inset:0;container-type:inline-size}:host([open]){display:flex}[part=backdrop]{background:var(--lr-lightbox-overlay-color,var(--_lr-lightbox-overlay-color));position:absolute;inset:0}[part=panel]{gap:var(--lr-space-s);outline:none;flex-direction:column;block-size:100%;min-block-size:0;inline-size:100%;min-inline-size:0;display:flex;position:relative}[part=toolbar]{align-items:center;gap:var(--lr-space-s);flex-wrap:wrap;flex:none;display:flex}[part=counter]{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;max-inline-size:60%;padding:var(--lr-space-xs) var(--lr-space-s);border-radius:var(--lr-radius);background:var(--lr-lightbox-control-bg,var(--_lr-lightbox-control-bg));color:var(--lr-lightbox-control-color,var(--_lr-lightbox-control-color));font-size:var(--lr-font-size-sm);display:inline-block;overflow:hidden}[part=actions]{justify-content:flex-end;align-items:center;gap:var(--lr-space-xs);flex-wrap:wrap;flex:1 1 0;min-inline-size:0;max-inline-size:100%;margin-inline-start:auto;display:flex}slot[name=actions]::slotted(*){box-sizing:border-box;overflow-wrap:anywhere;min-inline-size:0;max-inline-size:100%}[part=actions][hidden]{display:none}[part=close-button],[part=previous-button],[part=next-button]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);border-radius:var(--lr-radius-pill);background:var(--lr-lightbox-control-bg,var(--_lr-lightbox-control-bg));color:var(--lr-lightbox-control-color,var(--_lr-lightbox-control-color));cursor:pointer;border:none;flex:none;justify-content:center;align-items:center;display:inline-flex}[part=close-button]{margin-inline-start:var(--lr-space-xs)}:where([part=close-button]):hover,:where([part=previous-button]):hover:where(:not(:disabled)),:where([part=next-button]):hover:where(:not(:disabled)){background:var(--lr-color-brand-quiet);color:var(--lr-color-brand)}:where([part=close-button]):active,:where([part=previous-button]):active:where(:not(:disabled)),:where([part=next-button]):active:where(:not(:disabled)){background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active));color:var(--lr-color-brand)}[part=close-button]:focus-visible,[part=previous-button]:focus-visible,[part=next-button]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}[part=previous-button]:disabled,[part=next-button]:disabled{opacity:var(--lr-opacity-disabled);cursor:not-allowed}[part=close-button] svg,[part=previous-glyph],[part=next-glyph]{display:block}[part=stage]{flex:auto;min-block-size:0;min-inline-size:0;position:relative}lr-pan-zoom[part=frame]{block-size:100%;inline-size:100%;display:block}lr-pan-zoom[part=frame]::part(base),lr-pan-zoom[part=frame]::part(viewport){block-size:100%}[part=previous-button],[part=next-button]{z-index:var(--lr-layer-content);position:absolute;inset-block-start:50%;transform:translateY(-50%)}[part=previous-button]{inset-inline-start:var(--lr-space-s)}[part=next-button]{inset-inline-end:var(--lr-space-s)}[part=previous-glyph]{transform:rotate(180deg)}[part=next-glyph],:host(:dir(rtl)) [part=previous-glyph]{transform:rotate(0)}:host(:dir(rtl)) [part=next-glyph]{transform:rotate(180deg)}[part=caption]{max-inline-size:100%;max-block-size:var(--lr-size-8rem);padding:var(--lr-space-xs) var(--lr-space-s);border-radius:var(--lr-radius);background:var(--lr-lightbox-control-bg,var(--_lr-lightbox-control-bg));color:var(--lr-lightbox-control-color,var(--_lr-lightbox-control-color));text-align:center;overflow-wrap:anywhere;flex:none;align-self:center;margin:0;overflow-y:auto}@container (inline-size<=20rem){[part=counter]{max-inline-size:45%}}`;export{styles};
+import{css}from"lit";const styles=css`:host{--_lr-lightbox-overlay-color:var(--lr-color-overlay-strong);--_lr-lightbox-control-bg:var(--lr-color-neutral);--_lr-lightbox-control-color:var(--lr-color-on-neutral);z-index:var(--lr-overlay-stack-index,var(--lr-layer-modal));contain-intrinsic-inline-size:var(--lr-size-20rem);padding-block-start:max(var(--lr-space-l), var(--lr-safe-area-top));padding-block-end:max(var(--lr-space-l), var(--lr-safe-area-bottom));padding-inline-start:max(var(--lr-space-l), var(--lr-safe-area-inline-start));padding-inline-end:max(var(--lr-space-l), var(--lr-safe-area-inline-end));display:none;position:fixed;inset:0;container-type:inline-size}:host([open]){display:flex}[part=backdrop]{background:var(--lr-lightbox-overlay-color,var(--_lr-lightbox-overlay-color));position:absolute;inset:0}[part=panel]{gap:var(--lr-space-s);outline:none;flex-direction:column;block-size:100%;min-block-size:0;inline-size:100%;min-inline-size:0;display:flex;position:relative}[part=toolbar]{align-items:center;gap:var(--lr-space-s);flex-wrap:wrap;flex:none;display:flex}[part=counter]{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;max-inline-size:60%;padding:var(--lr-space-xs) var(--lr-space-s);border-radius:var(--lr-radius);background:var(--lr-lightbox-control-bg,var(--_lr-lightbox-control-bg));color:var(--lr-lightbox-control-color,var(--_lr-lightbox-control-color));font-size:var(--lr-font-size-sm);display:inline-block;overflow:hidden}[part=actions]{justify-content:flex-end;align-items:center;gap:var(--lr-space-xs);flex-wrap:wrap;flex:1 1 0;min-inline-size:0;max-inline-size:100%;margin-inline-start:auto;display:flex}slot[name=actions]::slotted(*){box-sizing:border-box;overflow-wrap:anywhere;min-inline-size:0;max-inline-size:100%}[part=actions][hidden]{display:none}[part=close-button],[part=previous-button],[part=next-button]{font:inherit;min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);border-radius:var(--lr-radius-pill);background:var(--lr-lightbox-control-bg,var(--_lr-lightbox-control-bg));color:var(--lr-lightbox-control-color,var(--_lr-lightbox-control-color));cursor:pointer;border:none;flex:none;justify-content:center;align-items:center;display:inline-flex}[part=close-button]{margin-inline-start:var(--lr-space-xs)}:where([part=close-button]):hover,:where([part=previous-button]):hover:where(:not(:disabled)),:where([part=next-button]):hover:where(:not(:disabled)){background:var(--lr-color-brand-quiet);color:var(--lr-color-brand)}:where([part=close-button]):active,:where([part=previous-button]):active:where(:not(:disabled)),:where([part=next-button]):active:where(:not(:disabled)){background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active));color:var(--lr-color-brand)}[part=close-button]:focus-visible,[part=previous-button]:focus-visible,[part=next-button]:focus-visible{outline:var(--lr-focus-ring);outline-offset:var(--lr-focus-ring-offset)}[part=previous-button]:disabled,[part=next-button]:disabled{opacity:var(--lr-opacity-disabled);cursor:not-allowed}[part=close-button] svg,[part=previous-glyph],[part=next-glyph]{display:block}[part=stage]{flex:auto;min-block-size:0;min-inline-size:0;position:relative}lr-pan-zoom[part=frame]{block-size:100%;inline-size:100%;display:block}lr-pan-zoom[part=frame]::part(base),lr-pan-zoom[part=frame]::part(viewport){block-size:100%}[part=previous-button],[part=next-button]{z-index:var(--lr-layer-content);position:absolute;inset-block-start:50%;transform:translateY(-50%)}[part=previous-button]{inset-inline-start:var(--lr-space-s)}[part=next-button]{inset-inline-end:var(--lr-space-s)}[part=previous-glyph]{transform:rotate(180deg)}[part=next-glyph],:host(:dir(rtl)) [part=previous-glyph]{transform:rotate(0)}:host(:dir(rtl)) [part=next-glyph]{transform:rotate(180deg)}[part=caption]{max-inline-size:100%;max-block-size:var(--lr-size-8rem);padding:var(--lr-space-xs) var(--lr-space-s);border-radius:var(--lr-radius);background:var(--lr-lightbox-control-bg,var(--_lr-lightbox-control-bg));color:var(--lr-lightbox-control-color,var(--_lr-lightbox-control-color));text-align:center;overflow-wrap:anywhere;flex:none;align-self:center;margin:0;overflow-y:auto}@container (inline-size<=20rem){[part=counter]{max-inline-size:45%}}`;export{styles};

package/dist/components/media/map/map-loader.js

@@ -1 +1 @@
-import{resolveOptionalPeerCapability,unwrapOptionalPeerDefault}from"../../../internal/optional-peer-capabilities.js";const MAP_METHODS=["getCanvas","getCenter","getZoom","setCenter","setZoom","resize","remove","on","once","setStyle","getSource","addSource","removeSource","getLayer","addLayer","removeLayer","setPaintProperty","queryRenderedFeatures"],MARKER_METHODS=["setLngLat","setPopup","getPopup","addTo","remove"],POPUP_METHODS=["setHTML","setText"];function isObjectLike(value){return(typeof value=="object"||typeof value=="function")&&value!==null}function isConstructor(value){if(typeof value!="function")return!1;try{return Reflect.construct(Object,[],value),!0}catch{return!1}}function missingConstructorCapability(module,name,methods){const Constructor=module[name];if(!isConstructor(Constructor))return name;const prototype=Constructor.prototype;if(!isObjectLike(prototype))return`${name}.prototype`;for(const method of methods)if(typeof prototype[method]!="function")return`${name}.prototype.${method}`}function missingMaplibreCapability(candidate){return isObjectLike(candidate)?missingConstructorCapability(candidate,"Map",MAP_METHODS)??missingConstructorCapability(candidate,"Marker",MARKER_METHODS)??missingConstructorCapability(candidate,"Popup",POPUP_METHODS):"module namespace"}function isMaplibreModule(candidate){return missingMaplibreCapability(candidate)===void 0}function resolveMaplibreModule(value){const module=resolveOptionalPeerCapability(value,isMaplibreModule);if(module)return module;const candidate=unwrapOptionalPeerDefault(value),missing=missingMaplibreCapability(candidate)??"module namespace";throw new Error(`Invalid optional peer \`maplibre-gl\`: missing or invalid \`${missing}\` capability.`)}let maplibre;async function loadMaplibreModule(importer=()=>import("maplibre-gl")){try{return resolveMaplibreModule(await importer())}catch(error){return console.warn("<lr-map> needs the optional peer dependency `maplibre-gl` \u2014 install it with `pnpm add maplibre-gl`.",error),null}}function loadMaplibre(){return maplibre||(maplibre=loadMaplibreModule()),maplibre}export{loadMaplibre,loadMaplibreModule};
+import{resolveOptionalPeerCapability,unwrapOptionalPeerDefault}from"../../../internal/optional-peer-capabilities.js";const MAP_METHODS=["getCanvas","getCenter","getZoom","setCenter","setZoom","resize","remove","on","once","setStyle","getSource","addSource","removeSource","getLayer","addLayer","removeLayer","setPaintProperty","queryRenderedFeatures"],MARKER_METHODS=["setLngLat","setPopup","getPopup","addTo","remove"],POPUP_METHODS=["setHTML","setText"];function isObjectLike(value){return(typeof value=="object"||typeof value=="function")&&value!==null}function isConstructor(value){if(typeof value!="function")return!1;try{return Reflect.construct(Object,[],value),!0}catch{return!1}}function missingConstructorCapability(module,name,methods){const Constructor=module[name];if(!isConstructor(Constructor))return name;const prototype=Constructor.prototype;if(!isObjectLike(prototype))return`${name}.prototype`;for(const method of methods)if(typeof prototype[method]!="function")return`${name}.prototype.${method}`}function missingMaplibreCapability(candidate){return isObjectLike(candidate)?missingConstructorCapability(candidate,"Map",MAP_METHODS)??missingConstructorCapability(candidate,"Marker",MARKER_METHODS)??missingConstructorCapability(candidate,"Popup",POPUP_METHODS):"module namespace"}function isMaplibreModule(candidate){return missingMaplibreCapability(candidate)===void 0}function resolveMaplibreModule(value){const module=resolveOptionalPeerCapability(value,isMaplibreModule);if(module)return module;const candidate=unwrapOptionalPeerDefault(value),missing=missingMaplibreCapability(candidate)??"module namespace";throw new Error(`Invalid optional peer \`maplibre-gl\`: missing or invalid \`${missing}\` capability.`)}let maplibre;async function loadMaplibreModule(importer=()=>import("maplibre-gl")){try{return resolveMaplibreModule(await importer())}catch(error){return console.warn("<lr-map> needs the optional peer dependency `maplibre-gl` — install it with `pnpm add maplibre-gl`.",error),null}}function loadMaplibre(){return maplibre||(maplibre=loadMaplibreModule()),maplibre}export{loadMaplibre,loadMaplibreModule};