npm - @videojs/html - Versions diffs - 10.0.0-beta.30 → 10.0.0-beta.31 - Mend

@videojs/html 10.0.0-beta.30 → 10.0.0-beta.31

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (357) hide show

package/cdn/audio.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"audio.js","names":[],"sources":["../inline-css:src/define/audio/skin.js","../src/define/audio/skin.ts"],"sourcesContent":["export default \"video-player,live-video-player,media-i18n{display:contents}video-player video,video-player [slot=poster],live-video-player video,live-video-player [slot=poster]{width:100%;height:100%;display:block}video-player video::-webkit-media-text-track-container,live-video-player video::-webkit-media-text-track-container{z-index:1;scale:.98;translate:0 var(--media-caption-track-y,0);transition:translate var(--media-caption-track-duration,0) ease-out;transition-delay:var(--media-caption-track-delay,0);font-family:inherit}media-tooltip-group{display:contents}:host{width:100%;display:grid}media-container{min-width:0;min-height:0}.media-popover--volume:has(media-volume-slider[data-hidden]){display:none}.media-sr-only{white-space:nowrap;clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.media-default-skin ,.media-default-skin :before,.media-default-skin :after{box-sizing:border-box}.media-default-skin img,.media-default-skin video,.media-default-skin svg{max-width:100%;display:block}.media-default-skin button{font:inherit}.media-default-skin [hidden][hidden]{display:none}@media (prefers-reduced-motion:no-preference){.media-default-skin{interpolate-size:allow-keywords}}.media-default-skin{--accent-color:var(--media-accent-color,var(--default-accent-color));--accent-contrast-color:contrast-color(var(--accent-color));--accent-background-color:var(--media-accent-color,oklch(from var(--default-accent-color) l c h / calc(alpha .1)));--accent-text-color:var(--media-accent-text-color,contrast-color(var(--media-accent-color,oklch(0% 0 0))));--shadow-current-color:oklch(from currentColor 0 0 0 / clamp(0, calc((l - .5) * .5), .15));--shadow-subtle-current-color:oklch(from var(--shadow-current-color) l c h / calc(alpha * .4));--scrollbar-thumb-color:oklch(from currentColor l c h / .3);--scale:1;--scale-unit:var(--media-scale-unit,16px);--size:calc(var(--scale-unit) * var(--scale));--spacing:calc(var(--size) / 4);--font-size-medium:calc(.9375 * var(--size));--font-size-base:calc(.8125 * var(--size));--font-size-small:calc(.6875 * var(--size));--font-size-tiny:calc(.5625 * var(--size));--media-icon-size:calc(1.125 * var(--size));--container-border-radius:var(--media-border-radius,1.75rem);width:100%;height:100%;font-family:Inter Variable,Inter,ui-sans-serif,system-ui,sans-serif;font-size:var(--font-size-base);-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;letter-spacing:normal;outline-offset:-4px;scrollbar-color:var(--scrollbar-thumb-color) transparent;scrollbar-width:thin;border-radius:var(--container-border-radius,1.75rem);isolation:isolate;outline:2px solid #0000;line-height:1.5;transition-property:outline-offset,outline-color;transition-duration:.1s;transition-timing-function:ease-out;display:block;position:relative;container:media-root/inline-size;&:focus-visible{outline-color:var(--focus-ring-color);outline-offset:2px}&::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-color);border-radius:9999px}@media (prefers-reduced-transparency:reduce) or (prefers-contrast:more){--scrollbar-thumb-color:oklch(from currentColor l c h / .8);scrollbar-width:auto}}.media-default-skin .media-surface{background-color:var(--surface-background-color);box-shadow:0 0 0 1px var(--surface-outer-border-color), 0 1px 3px 0 var(--surface-shadow-color), 0 1px 2px -1px var(--surface-shadow-color);backdrop-filter:var(--surface-backdrop-filter);&:after{z-index:10;pointer-events:none;content:\\\"\\\";border-radius:inherit;box-shadow:inset 0 1px 0 0 var(--surface-inner-border-color), inset 0 0 0 1px oklch(from var(--surface-inner-border-color) l c h / calc(alpha * .5));position:absolute;inset:0}}.media-default-skin .media-buffering-indicator{z-index:10;color:oklch(100% 0 0);pointer-events:none;place-content:center;display:none;position:absolute;inset:0;&:not([data-visible]){--media-spinner-animation:none}&[data-visible]{display:grid}@media (prefers-reduced-motion:reduce){--media-spinner-animation:none}}.media-default-skin .media-error{outline:none}.media-default-skin .media-error:not([data-open]){display:none}.media-default-skin .media-error__title{font-weight:600;line-height:1.25}.media-default-skin .media-error__description{overflow-wrap:anywhere;opacity:.7}.media-default-skin .media-error__actions{gap:calc(var(--spacing) * 2);display:flex;&>{flex:1}}.media-default-skin .media-error[data-open]~.media-controls {visibility:hidden}.media-default-skin .media-controls{--media-popover-side-offset:calc(var(--spacing) * (var(--base-side-offset,2) + 1));--media-tooltip-side-offset:var(--media-popover-side-offset);--media-popover-boundary-offset:calc(var(--spacing) * var(--base-boundary-offset,2));--media-tooltip-boundary-offset:var(--media-popover-boundary-offset);padding:calc(var(--spacing) * 1);text-shadow:0 1px 0 var(--shadow-current-color);border-radius:3.40282e38px;align-items:center;display:flex;container:media-controls/inline-size}.media-default-skin .media-time-controls{gap:calc(var(--spacing) * 2.5);flex:1;align-items:center;display:flex;container:media-time-controls/inline-size;&>.media-time:last-child{@container media-time-controls (width<16rem){display:none}}}.media-default-skin .media-time{font-variant-numeric:tabular-nums}.media-default-skin .media-time[role=button]{cursor:pointer;outline-offset:-2px;border-radius:calc(var(--spacing) * 1);outline:2px solid #0000;transition-property:outline-color,outline-offset;transition-duration:.1s;transition-timing-function:ease-out;&:focus-visible{outline-color:var(--focus-ring-color);outline-offset:2px}}.media-default-skin .media-button{height:calc(var(--spacing) * 9);min-height:0;padding:calc(var(--spacing) * 2) calc(var(--spacing) * 4);text-align:center;touch-action:manipulation;cursor:pointer;user-select:none;outline-offset:-2px;will-change:scale;border:none;border-radius:3.40282e38px;outline:2px solid #0000;flex-shrink:0;justify-content:center;align-items:center;transition-property:background-color,color,outline-offset,scale;transition-duration:.15s;transition-timing-function:ease-out;display:flex;&:focus-visible{outline-color:var(--focus-ring-color);outline-offset:2px}&:active:not([aria-disabled=true]){scale:.97}&[aria-disabled=true]{cursor:not-allowed;opacity:.5}}.media-default-skin .media-button--primary{color:var(--accent-contrast-color);text-shadow:none;background:var(--accent-color);font-weight:500}.media-default-skin .media-button--subtle{color:inherit;text-shadow:inherit;background:0 0;&:not([aria-disabled=true]){&:hover,&:focus-visible,&[aria-expanded=true]{color:var(--accent-text-color);background-color:var(--accent-background-color);text-decoration:none}}}.media-default-skin .media-button--icon{aspect-ratio:1;padding:0;display:grid;&:active:not([aria-disabled=true]){scale:.97}& .media-icon__container{display:grid}& .media-icon{filter:drop-shadow(0 1px 0 var(--shadow-current-color));grid-area:1/1;transition-property:opacity,scale;transition-duration:.15s;transition-timing-function:ease-out}}.media-default-skin .media-button--seek{& .media-icon__label{font-variant-numeric:tabular-nums;letter-spacing:-.05em;font-size:.715em;font-weight:500;position:absolute;bottom:-3px;right:-1px}&:has(.media-icon--flipped) .media-icon__label{right:unset;left:-1px}}.media-default-skin .media-button--playback-rate{font-variant-numeric:tabular-nums;padding:0;&:after{content:attr(data-rate) \\\"×\\\";width:4ch}&[data-inline-rate-label]:after{content:none}}.media-default-skin .media-button--settings{& .media-icon--settings{transition:transform .15s ease-in-out;@media (prefers-reduced-motion:reduce){transition-duration:0s}}&[aria-expanded=true] .media-icon--settings{transform:rotate(90deg)}}.media-default-skin .media-button--live{gap:calc(var(--spacing) * 1.5);aspect-ratio:auto;width:auto;padding:calc(var(--spacing) * 2) calc(var(--spacing) * 3);font-size:var(--font-size-small);text-transform:uppercase;letter-spacing:.05em;align-items:center;font-weight:600;line-height:1;display:inline-flex;&:before{width:calc(var(--spacing) * 2);height:calc(var(--spacing) * 2);content:\\\"\\\";background-color:oklch(from currentColor l c h / .4);border-radius:50%;flex-shrink:0;transition:background-color .15s ease-out;display:inline-block}&[data-live-edge]:before{background-color:oklch(65% .22 27)}}@media (prefers-reduced-motion:reduce){.media-default-skin .media-button{will-change:auto;transition-property:background-color,color;scale:1}}.media-default-skin .media-button-group{align-items:center;gap:1px;display:flex}.media-default-skin .media-badge{padding:calc(var(--spacing) * .5) calc(var(--spacing) * 1.5);font-size:var(--font-size-small);color:oklch(from currentColor l c h / .85);white-space:nowrap;background-color:oklch(from currentColor l c h / .1);border-radius:3.40282e38px;font-weight:500;line-height:1}.media-default-skin .media-icon__container{position:relative}.media-default-skin .media-icon{width:var(--media-icon-size);height:var(--media-icon-size);flex-shrink:0}.media-default-skin .media-icon--flipped{scale:-1 1}.media-default-skin .media-slider{--track-size:calc(var(--spacing) * 1);--track-highlighted-size:calc(var(--spacing) * 1.75);--track-border-radius:99px;--thumb-size:calc(var(--spacing) * 3);--chapter-gap:calc(var(--spacing) * 1);--chapter-inset-start:calc(var(--chapter-gap) / 2);--chapter-inset-end:calc(var(--chapter-gap) / 2);cursor:pointer;outline:none;flex:1;justify-content:center;align-items:center;display:flex;position:relative;&[data-orientation=horizontal]{width:var(--slider-width,100%);min-width:calc(var(--spacing) * 20);height:var(--slider-height,calc(var(--spacing) * 8))}&[data-orientation=vertical]{width:var(--slider-width,calc(var(--spacing) * 8));height:var(--slider-height,calc(var(--spacing) * 20))}& .media-slider__track{user-select:none;background-color:oklch(from currentColor l c h / .2);border-radius:var(--track-border-radius);isolation:isolate;position:relative;overflow:hidden;&[data-orientation=horizontal]{width:100%;height:var(--track-size)}&[data-orientation=vertical]{width:var(--track-size);height:100%}}& .media-slider__buffer,& .media-slider__fill{pointer-events:none;border-radius:inherit;position:absolute;&[data-orientation=horizontal]{inset-block:0;width:100%;left:0}&[data-orientation=vertical]{inset-inline:0;height:100%;bottom:0}@media (prefers-reduced-motion:no-preference){transition:clip-path .2s ease-out}}&[data-dragging],&[data-seeking]{& .media-slider__fill,& .media-slider__buffer{transition-duration:0s}}& .media-slider__buffer{background-color:oklch(from currentColor l c h / .2);&[data-orientation=horizontal]{clip-path:inset(0 calc(100% - var(--media-slider-buffer)) 0 0 round var(--track-border-radius))}&[data-orientation=vertical]{clip-path:inset(calc(100% - var(--media-slider-buffer)) 0 0 0 round var(--track-border-radius))}}& .media-slider__fill{background-color:var(--accent-color);&[data-orientation=horizontal]{clip-path:inset(0 calc(100% - var(--media-slider-fill)) 0 0 round var(--track-border-radius))}&[data-orientation=vertical]{clip-path:inset(calc(100% - var(--media-slider-fill)) 0 0 0 round var(--track-border-radius))}}&[data-dragging]{& .media-slider__fill[data-orientation=horizontal]{clip-path:inset(0 calc(100% - var(--media-slider-pointer)) 0 0 round var(--track-border-radius))}& .media-slider__fill[data-orientation=vertical]{clip-path:inset(calc(100% - var(--media-slider-pointer)) 0 0 0 round var(--track-border-radius))}}& .media-slider__chapters{border-radius:inherit;flex:1;align-items:center;min-width:0;min-height:0;display:flex;position:relative;&[data-orientation=horizontal]{width:100%;height:100%}&[data-orientation=vertical]{flex-direction:column-reverse;width:100%;height:100%}}& .media-slider__chapter{border-radius:inherit;justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;position:absolute;inset:0;&:first-child{--chapter-inset-start:0px}&:last-child{--chapter-inset-end:0px}& .media-slider__chapter-track{border-radius:inherit;@media (prefers-reduced-motion:no-preference){transition:height .2s ease-out,width .2s ease-out}}&[data-orientation=horizontal]{clip-path:inset(0 calc(100% - var(--media-slider-chapter-end)) 0 var(--media-slider-chapter-start));& .media-slider__chapter-track{height:var(--track-size);clip-path:inset(0 calc(100% - var(--media-slider-chapter-end) + var(--chapter-inset-end)) 0 calc(var(--media-slider-chapter-start) + var(--chapter-inset-start)) round var(--track-border-radius))}&[data-highlighted] .media-slider__chapter-track{height:var(--track-highlighted-size)}}&[data-orientation=vertical]{clip-path:inset(calc(100% - var(--media-slider-chapter-end)) 0 var(--media-slider-chapter-start) 0);& .media-slider__chapter-track{width:var(--track-size);clip-path:inset(calc(100% - var(--media-slider-chapter-end) + var(--chapter-inset-end)) 0 calc(var(--media-slider-chapter-start) + var(--chapter-inset-start)) 0 round var(--track-border-radius))}&[data-highlighted] .media-slider__chapter-track{width:var(--track-highlighted-size)}}}& .media-slider__thumb{z-index:10;width:var(--thumb-size);height:var(--thumb-size);user-select:none;outline-offset:-4px;box-shadow:0 0 0 1px var(--shadow-current-color,oklch(0% 0 0/.1)), 0 1px 3px 0 oklch(0% 0 0/.35), 0 1px 2px -1px oklch(0% 0 0/.35);opacity:0;background-color:currentColor;border-radius:3.40282e38px;outline:4px solid #0000;position:absolute;translate:-50% -50%;scale:.8;&[data-orientation=horizontal]{top:50%;left:var(--media-slider-fill)}&[data-orientation=vertical]{top:calc(100% - var(--media-slider-fill));left:50%}&:focus-visible{outline-color:oklch(from currentColor l c h / .15);outline-offset:0;opacity:1}&:after{content:\\\"\\\";border-radius:inherit;position:absolute;inset:-4px;box-shadow:0 0 0 2px}&:not(:focus-visible):after{opacity:0;scale:.5}&.media-slider__thumb--persistent{opacity:1;scale:1}@media (hover:hover) and (pointer:fine){&:hover{outline-color:oklch(from currentColor l c h / .15);outline-offset:0}}@media (prefers-reduced-motion:no-preference){transition-property:opacity,outline-offset,left,top,scale;transition-duration:.15s;transition-timing-function:ease-out;&:after{transition-property:opacity,scale;transition-duration:.15s;transition-timing-function:ease-out}}}@media (hover:hover) and (pointer:fine){&:hover .media-slider__thumb{opacity:1;scale:1}}&[data-dragging] .media-slider__thumb{opacity:1;scale:.9;@media (prefers-reduced-motion:no-preference){transition-property:opacity,outline-offset,scale}&[data-orientation=horizontal]{left:var(--media-slider-pointer)}&[data-orientation=vertical]{top:calc(100% - var(--media-slider-pointer))}}& .media-slider__preview{--max-size-factor:36;--max-size:min(calc(var(--spacing) * var(--max-size-factor)), 100cqi);min-width:var(--max-size);height:calc(var(--spacing) * 1);@container media-root (width>42rem){--max-size-factor:48}& .media-slider__thumbnail,& .media-slider__value{max-width:var(--max-size);opacity:0;filter:blur(8px);transform-origin:bottom;scale:.8;translate:-50% calc(var(--spacing) * 2);transition-duration:.15s;transition-timing-function:ease-out;position:absolute;left:50%}& .media-slider__thumbnail{--thumbnail-max-width:var(--max-size);--thumbnail-max-height:var(--max-size);bottom:calc(100% + (var(--spacing) * 9))}& .media-slider__value{bottom:calc(100% + (var(--spacing) * 10.5));text-shadow:0 1px 0 var(--shadow-current-color);flex-direction:column;align-items:center;display:flex}& .media-slider__chapter-title{min-width:0;max-width:var(--max-size);padding-inline:calc(var(--spacing) * 6);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;&:empty{display:none}}&:before{z-index:1;width:calc(var(--spacing) * 1);height:calc(var(--spacing) * 1);pointer-events:none;content:\\\"\\\";box-shadow:0 0 0 1px var(--shadow-current-color,oklch(0% 0 0/.15)), 0 1px 2px 0 oklch(0% 0 0/.35);opacity:0;background-color:currentColor;border-radius:100%;transition-property:opacity,scale;transition-duration:.2s;transition-timing-function:ease-out;position:absolute;top:50%;left:50%;translate:-50% -50%;scale:.5}}&:is([data-pointing],:has(:focus-visible)) .media-slider__preview :is(.media-slider__value,.media-slider__thumbnail),& .media-slider__preview[data-pointing]:not([data-dragging]):before{opacity:1;filter:blur();scale:1}}.media-default-skin{--popup-transition:opacity var(--popup-transition-timing-function) var(--popup-transition-duration), filter var(--popup-transition-timing-function) var(--popup-transition-duration), transform var(--popup-transition-timing-function) var(--popup-transition-duration), scale var(--popup-transition-timing-function) var(--popup-transition-duration)}.media-default-skin .media-popover,.media-default-skin .media-tooltip{--popup-translate-distance:calc(.5 * var(--scale-unit));color:inherit;transition:var(--popup-transition);border:0;margin:0;overflow:visible;&[data-starting-style],&[data-ending-style]{opacity:0;filter:blur(4px);transform:translate(var(--popup-translate-x-distance,0), var(--popup-translate-y-distance,0));scale:.95}&[data-ending-style]{transition-duration:max(0s, calc(var(--popup-transition-duration) - 50ms));transform:none}&[data-side=top]{--popup-translate-y-distance:var(--popup-translate-distance);transform-origin:bottom}&[data-side=bottom]{--popup-translate-y-distance:calc(var(--popup-translate-distance) * -1);transform-origin:top}&[data-side=left]{--popup-translate-x-distance:var(--popup-translate-distance);transform-origin:100%}&[data-side=right]{--popup-translate-x-distance:calc(var(--popup-translate-distance) * -1);transform-origin:0}&:before{pointer-events:inherit;content:\\\"\\\";position:absolute}&[data-side=top]:before,&[data-side=bottom]:before{width:100%;inset-inline:0}&[data-side=top]:before{top:100%}&[data-side=bottom]:before{bottom:100%}&[data-side=left]:before,&[data-side=right]:before{height:100%;inset-block:0}&[data-side=left]:before{left:100%}&[data-side=right]:before{right:100%}}.media-default-skin .media-popover{&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-popover-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-popover-side-offset)}}.media-default-skin .media-popover--volume{padding:calc(var(--spacing) * 3) 0;border-radius:3.40282e38px;&:has(media-volume-slider[data-hidden]){display:none}}.media-default-skin .media-tooltip{padding:calc(var(--spacing) * 1) calc(var(--spacing) * 2.5);font-size:var(--font-size-base);white-space:nowrap;border-radius:3.40282e38px;&[data-open]{column-gap:calc(var(--spacing) * 1);align-items:center;display:flex}&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-tooltip-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-tooltip-side-offset)}& .media-tooltip__kbd{min-width:1.5em;font-family:inherit;font-size:var(--font-size-small);text-align:center;background-color:oklch(from currentColor l c h / .3);border-radius:calc(var(--spacing) * 1);padding:.1em;font-weight:600;line-height:1.25}}.media-default-skin .media-menu{--menu-transition-duration:.25s;--menu-max-height:calc(var(--spacing) * 56);--menu-padding:calc(var(--spacing) * 1);--menu-border-radius:calc(var(--spacing) * 3);--menu-item-border-radius:calc(var(--menu-border-radius) - var(--menu-padding));box-sizing:border-box;min-width:max-content;max-width:var(--media-popover-available-width,none);max-height:min(var(--media-popover-available-height,var(--menu-max-height)), var(--menu-max-height));padding:var(--menu-padding);overscroll-behavior:none;border-radius:var(--menu-border-radius);overflow:auto;@media (prefers-reduced-motion:reduce){--menu-transition-duration:0s}&>.media-menu__panel{inset-inline:0;z-index:10;max-height:inherit;padding:var(--menu-padding);overscroll-behavior:none;transition-timing-function:ease-out;transition-duration:var(--menu-transition-duration);outline:none;transition-property:translate,filter;position:absolute;top:0;overflow:auto;translate:0;&:where([data-starting-style],[data-ending-style]){pointer-events:none;filter:blur(8px);overflow:hidden;translate:100%}}& .media-menu__separator{margin-block:calc(var(--spacing) * 1);border-bottom:1px solid oklch(0% 0 0/.1);box-shadow:0 1px oklch(100% 0 0/.075)}& .media-menu__group{anchor-scope:--menu-item-highlight-anchor;gap:calc(var(--spacing) * .5);flex-direction:column;display:flex;@supports (top:anchor(top)){&:before{position-anchor:--menu-item-highlight-anchor;inset:anchor(inside);overflow-anchor:none;pointer-events:none;content:\\\"\\\";background-color:var(--accent-background-color);border-radius:var(--menu-item-border-radius);transition:inset .1s ease-in-out;position:absolute}&:has([data-highlighted=\\\"\\\"]):before{transition-duration:0s}}}& .media-menu__item,& .media-menu__back{gap:calc(var(--spacing) * 1.5);padding:calc(var(--spacing) * 1.5) calc(var(--spacing) * 2);text-align:left;text-shadow:0 1px 0 var(--shadow-current-color);cursor:pointer;user-select:none;outline-offset:-2px;border-radius:var(--menu-item-border-radius);outline:2px solid #0000;align-items:center;transition:background-color .1s ease-in-out,color .1s ease-in-out;display:flex;position:relative;& .media-icon{color:oklch(from currentColor l c h / .65);filter:drop-shadow(0 1px 0 var(--shadow-current-color));flex-shrink:0}&:focus-visible{outline-color:var(--focus-ring-color);outline-offset:2px}&:hover,&[data-highlighted]{color:var(--accent-text-color);background-color:var(--accent-background-color);& .media-icon{color:inherit}}@supports (top:anchor(top)){transition-duration:50ms;&:hover,&[data-highlighted]{transition-duration:.2s}}}& .media-menu__indicator{margin-right:calc(var(--spacing) * -1);opacity:0;flex-shrink:0;margin-left:auto;& .media-icon{filter:drop-shadow(0 1px 0 var(--shadow-current-color))}}& .media-menu__item{font-variant-numeric:tabular-nums;color:inherit;justify-content:space-between;&[aria-disabled=true]{pointer-events:none;cursor:not-allowed;opacity:.5}&[aria-checked=true] .media-menu__indicator{opacity:1}&[data-availability=unavailable],&[data-availability=unsupported]{display:none}&[data-highlighted]{@supports (top:anchor(top)){anchor-name:--menu-item-highlight-anchor;background-color:#0000}}}& .media-menu__tier{padding-top:1px;padding-left:calc(var(--spacing) * .5);font-size:var(--font-size-tiny);color:oklch(from currentColor l c h / .7);font-weight:600;line-height:1}& .media-menu__back{width:100%;margin-bottom:calc(var(--spacing) * .5)}& .media-menu__hint{gap:calc(var(--spacing) * 1);min-width:0;padding-left:calc(var(--spacing) * 2);color:oklch(from currentColor l c h / .65);align-items:center;margin-left:auto;display:inline-flex}& .media-menu__hint-label{max-width:calc(var(--spacing) * 24);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}& .media-menu__chevron{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}&.media-menu--settings{width:var(--media-menu-width);min-width:calc(var(--spacing) * 48);height:var(--media-menu-height);transition:var(--popup-transition), width var(--popup-transition-timing-function) var(--menu-transition-duration), height var(--popup-transition-timing-function) var(--menu-transition-duration);overflow:hidden;&>:not([data-submenu]){transition:translate var(--menu-transition-duration) ease-out, filter var(--menu-transition-duration) ease-out;translate:0}&[data-submenu-expanded=true]>:not([data-submenu]){filter:blur(8px);translate:-100%}&[data-submenu-expanded]>:not([data-submenu]):before{display:none}&[data-starting-style],&[data-ending-style]{transition:var(--popup-transition)}}}.media-button--play .media-icon--restart,.media-button--play .media-icon--play,.media-button--play .media-icon--pause,.media-button--mute .media-icon--volume-off,.media-button--mute .media-icon--volume-low,.media-button--mute .media-icon--volume-high{opacity:0;display:none}.media-button--play[data-ended] .media-icon--restart,.media-button--play:not([data-ended])[data-paused] .media-icon--play,.media-button--play:not([data-ended]):not([data-started]) .media-icon--play,.media-button--play[data-started]:not([data-paused]):not([data-ended]) .media-icon--pause,.media-button--mute[data-muted] .media-icon--volume-off,.media-button--mute:not([data-muted])[data-volume-level=low] .media-icon--volume-low,.media-button--mute:not([data-muted]):not([data-volume-level=low]) .media-icon--volume-high{opacity:1;display:block}.media-default-skin--audio{--default-accent-color:light-dark(oklch(0% 0 0),oklch(100% 0 0));--text-color:light-dark(oklch(0% 0 0),oklch(100% 0 0));--border-color:oklch(0% 0 0/.1);--focus-ring-color:light-dark(oklch(0% 0 0),oklch(100% 0 0));--surface-background-color:light-dark(oklch(100% 0 0/.5),oklch(0% 0 0/.4));--surface-inner-border-color:oklch(100% 0 0/.1);--surface-outer-border-color:oklch(0% 0 0/.05);--surface-shadow-color:oklch(0% 0 0/.15);--surface-backdrop-filter:blur(16px) saturate(1.5);--error-dialog-transition-duration:.25s;--error-dialog-transition-delay:.1s;--popup-transition-duration:.1s;--popup-transition-timing-function:ease-out;@media (prefers-reduced-motion:reduce){--error-dialog-transition-duration:50ms;--error-dialog-transition-delay:0s;--popup-transition-duration:0s}@media (prefers-reduced-transparency:reduce) or (prefers-contrast:more){--surface-background-color:light-dark(oklch(100% 0 0),oklch(0% 0 0));--surface-inner-border-color:light-dark(oklch(100% 0 0/.1),oklch(100% 0 0/.2));--surface-outer-border-color:light-dark(oklch(0% 0 0/.05),#0000)}}.media-default-skin--audio .media-error__dialog{z-index:20;gap:calc(var(--spacing) * 3);padding-inline:calc(var(--spacing) * 5) calc(var(--spacing) * .5);color:var(--text-color);background-color:var(--surface-background-color);backdrop-filter:var(--surface-backdrop-filter);transition-delay:var(--error-dialog-transition-delay);transition-timing-function:ease-out;transition-duration:var(--error-dialog-transition-duration);border-radius:3.40282e38px;align-items:center;transition-property:opacity,filter;display:flex;position:absolute;inset:0}.media-default-skin .media-error[data-starting-style] .media-error__dialog,.media-default-skin .media-error[data-ending-style] .media-error__dialog{opacity:0;filter:blur(4px)}.media-default-skin .media-error[data-ending-style] .media-error__dialog{transition-delay:0s}.media-default-skin--audio .media-error__content{gap:calc(var(--spacing) * 2);flex:1;align-items:center;display:flex}.media-default-skin--audio .media-controls{--base-boundary-offset:2;color:var(--text-color);& .media-time-controls{padding-inline:calc(var(--spacing) * 3)}& .media-button--seek{@container media-root (width<32rem){display:none}}}.media-default-skin--audio .media-button--play__wrapper{display:inline-flex;position:relative}.media-default-skin--audio .media-button--play__wrapper .media-buffering-indicator{color:inherit}.media-default-skin--audio .media-button--play__wrapper:has(.media-buffering-indicator[data-visible]) .media-button--play .media-icon{opacity:0}.media-default-skin--audio .media-slider__track{background-color:light-dark(oklch(0% 0 0/.1),oklch(100% 0 0/.2));box-shadow:0 0 0 1px light-dark(#0000,oklch(0% 0 0/.05))}\";","import { renderIcon } from '@videojs/icons/render';\nimport { createShadowStyle, createTemplate } from '@videojs/utils/dom';\nimport { safeDefine } from '../safe-define';\nimport { SkinElement } from '../skin-element';\nimport styles from './skin.css?inline';\n\n// Register the player, container, and all UI custom elements.\nimport './ui';\n\nconst SEEK_TIME = 10;\n\nfunction getTemplateHTML() {\n return /html/ `\n <media-container class=\"media-default-skin media-default-skin--audio\">\n <!-- @deprecated slot=\"media\" is no longer required, use the default slot instead -->\n <slot name=\"media\"></slot>\n <slot></slot>\n\n <media-error-dialog class=\"media-error\">\n <div class=\"media-error__dialog\">\n <div class=\"media-error__content\">\n <media-alert-dialog-title class=\"media-error__title\"></media-alert-dialog-title>\n <media-alert-dialog-description class=\"media-error__description\"></media-alert-dialog-description>\n </div>\n <div class=\"media-error__actions\">\n <media-alert-dialog-close class=\"media-button media-button--subtle\"></media-alert-dialog-close>\n </div>\n </div>\n </media-error-dialog>\n\n <div class=\"media-surface media-controls\">\n <media-tooltip-group>\n <div class=\"media-button-group\">\n <span class=\"media-button--play__wrapper\">\n <media-buffering-indicator class=\"media-buffering-indicator\">\n ${renderIcon('spinner', { class: 'media-icon' })}\n </media-buffering-indicator>\n <media-play-button commandfor=\"play-tooltip\" class=\"media-button media-button--subtle media-button--icon media-button--play\">\n ${renderIcon('restart', { class: 'media-icon media-icon--restart' })}\n ${renderIcon('play', { class: 'media-icon media-icon--play' })}\n ${renderIcon('pause', { class: 'media-icon media-icon--pause' })}\n </media-play-button>\n <media-tooltip id=\"play-tooltip\" side=\"top\" boundary=\"viewport\" class=\"media-surface media-tooltip\">\n <media-tooltip-label></media-tooltip-label>\n <media-tooltip-shortcut class=\"media-tooltip__kbd\"></media-tooltip-shortcut>\n </media-tooltip>\n </span>\n\n <media-seek-button commandfor=\"seek-backward-tooltip\" seconds=\"${-SEEK_TIME}\" class=\"media-button media-button--subtle media-button--icon media-button--seek\">\n <span class=\"media-icon__container\">\n ${renderIcon('seek', { class: 'media-icon media-icon--seek media-icon--flipped' })}\n <span class=\"media-icon__label\">${SEEK_TIME}</span>\n </span>\n </media-seek-button>\n <media-tooltip id=\"seek-backward-tooltip\" side=\"top\" boundary=\"viewport\" class=\"media-surface media-tooltip\">\n <media-tooltip-label></media-tooltip-label>\n <media-tooltip-shortcut class=\"media-tooltip__kbd\"></media-tooltip-shortcut>\n </media-tooltip>\n\n <media-seek-button commandfor=\"seek-forward-tooltip\" seconds=\"${SEEK_TIME}\" class=\"media-button media-button--subtle media-button--icon media-button--seek\">\n <span class=\"media-icon__container\">\n ${renderIcon('seek', { class: 'media-icon media-icon--seek' })}\n <span class=\"media-icon__label\">${SEEK_TIME}</span>\n </span>\n </media-seek-button>\n <media-tooltip id=\"seek-forward-tooltip\" side=\"top\" boundary=\"viewport\" class=\"media-surface media-tooltip\">\n <media-tooltip-label></media-tooltip-label>\n <media-tooltip-shortcut class=\"media-tooltip__kbd\"></media-tooltip-shortcut>\n </media-tooltip>\n </div>\n\n <div class=\"media-time-controls\">\n <media-time type=\"current\" class=\"media-time\"></media-time>\n <media-time-slider class=\"media-slider\">\n <media-slider-track class=\"media-slider__track\">\n <media-slider-buffer class=\"media-slider__buffer\"></media-slider-buffer>\n <media-slider-fill class=\"media-slider__fill\"></media-slider-fill>\n </media-slider-track>\n <media-slider-thumb class=\"media-slider__thumb\"></media-slider-thumb>\n <media-slider-preview overflow=\"visible\" class=\"media-slider__preview\">\n <media-slider-value type=\"pointer\" class=\"media-slider__value media-time\"></media-slider-value>\n </media-slider-preview>\n </media-time-slider>\n <media-time toggle type=\"remaining\" class=\"media-time\"></media-time>\n </div>\n\n <div class=\"media-button-group\">\n <media-playback-rate-button commandfor=\"playback-rate-menu\" class=\"media-button media-button--subtle media-button--icon media-button--playback-rate\"></media-playback-rate-button>\n <media-menu id=\"playback-rate-menu\" side=\"top\" align=\"center\" boundary=\"viewport\" class=\"media-surface media-popover media-menu\">\n <media-playback-rate-radio-group class=\"media-menu__group\">\n <template>\n <media-menu-radio-item class=\"media-menu__item\">\n <span data-part=\"label\"></span>\n <media-menu-item-indicator force-mount class=\"media-menu__indicator\">\n ${renderIcon('check', { class: 'media-icon' })}\n </media-menu-item-indicator>\n </media-menu-radio-item>\n </template>\n </media-playback-rate-radio-group>\n </media-menu>\n\n <media-mute-button commandfor=\"audio-volume-popover\" class=\"media-button media-button--subtle media-button--icon media-button--mute\">\n ${renderIcon('volume-off', { class: 'media-icon media-icon--volume-off' })}\n ${renderIcon('volume-low', { class: 'media-icon media-icon--volume-low' })}\n ${renderIcon('volume-high', { class: 'media-icon media-icon--volume-high' })}\n </media-mute-button>\n\n <media-popover id=\"audio-volume-popover\" open-on-hover delay=\"200\" close-delay=\"100\" side=\"top\" boundary=\"viewport\" class=\"media-surface media-popover media-popover--volume\">\n <media-volume-slider class=\"media-slider\" orientation=\"vertical\" thumb-alignment=\"edge\">\n <media-slider-track class=\"media-slider__track\">\n <media-slider-fill class=\"media-slider__fill\"></media-slider-fill>\n </media-slider-track>\n <media-slider-thumb class=\"media-slider__thumb media-slider__thumb--persistent\"></media-slider-thumb>\n </media-volume-slider>\n </media-popover>\n </div>\n </media-tooltip-group>\n </div>\n\n <!-- Hotkeys -->\n <media-hotkey keys=\"Space\" action=\"togglePaused\"></media-hotkey>\n <media-hotkey keys=\"k\" action=\"togglePaused\"></media-hotkey>\n <media-hotkey keys=\"m\" action=\"toggleMuted\"></media-hotkey>\n <media-hotkey keys=\"ArrowRight\" action=\"seekStep\" value=\"5\"></media-hotkey>\n <media-hotkey keys=\"ArrowLeft\" action=\"seekStep\" value=\"-5\"></media-hotkey>\n <media-hotkey keys=\"l\" action=\"seekStep\" value=\"10\"></media-hotkey>\n <media-hotkey keys=\"j\" action=\"seekStep\" value=\"-10\"></media-hotkey>\n <media-hotkey keys=\"ArrowUp\" action=\"volumeStep\" value=\"0.05\"></media-hotkey>\n <media-hotkey keys=\"ArrowDown\" action=\"volumeStep\" value=\"-0.05\"></media-hotkey>\n <media-hotkey keys=\"0-9\" action=\"seekToPercent\"></media-hotkey>\n <media-hotkey keys=\"Home\" action=\"seekToPercent\" value=\"0\"></media-hotkey>\n <media-hotkey keys=\"End\" action=\"seekToPercent\" value=\"100\"></media-hotkey>\n <media-hotkey keys=\">\" action=\"speedUp\"></media-hotkey>\n <media-hotkey keys=\"<\" action=\"speedDown\"></media-hotkey>\n </media-container>\n `;\n}\n\nexport class AudioSkinElement extends SkinElement {\n static readonly tagName = 'audio-skin';\n static styles = createShadowStyle(styles);\n static template = createTemplate(getTemplateHTML());\n}\n\nsafeDefine(AudioSkinElement);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [AudioSkinElement.tagName]: AudioSkinElement;\n }\n}\n"],"mappings":"mPAAA,IAAA,EAAe,k70BCWf,SAAS,GAAkB,CACzB,MAAO,4vBAAA,EAAA,UAAA,CAAA,MAAA,YAAA,CAAA,EAAA,6JAAA,EAAA,UAAA,CAAA,MAAA,gCAAA,CAAA,EAAA,GAAA,EAAA,OAAA,CAAA,MAAA,6BAAA,CAAA,EAAA,GAAA,EAAA,QAAA,CAAA,MAAA,8BAAA,CAAA,EAAA,mcAAA,EAAA,OAAA,CAAA,MAAA,iDAAA,CAAA,EAAA,mfAAA,EAAA,OAAA,CAAA,MAAA,6BAAA,CAAA,EAAA,giDAAA,EAAA,QAAA,CAAA,MAAA,YAAA,CAAA,EAAA,uPAAA,EAAA,aAAA,CAAA,MAAA,mCAAA,CAAA,EAAA,GAAA,EAAA,aAAA,CAAA,MAAA,mCAAA,CAAA,EAAA,GAAA,EAAA,cAAA,CAAA,MAAA,oCAAA,CAAA,EAAA,uhDA4HT,CAQA,EAAW,cAN2B,CAAY,QACtB,KAAA,QAAA,oBACV,KAAA,OAAA,EAAkB,CAAM,SACtB,KAAA,SAAA,EAAe,EAAgB,CAAC,EACpD,CAE2B"}
1	+ {"version":3,"file":"audio.js","names":[],"sources":["../inline-css:src/define/audio/skin.js","../src/define/audio/skin.ts"],"sourcesContent":["export default \"video-player,live-video-player,media-i18n{display:contents}video-player video,video-player [slot=poster],live-video-player video,live-video-player [slot=poster]{width:100%;height:100%;display:block}video-player video::-webkit-media-text-track-container,live-video-player video::-webkit-media-text-track-container{z-index:1;scale:.98;translate:0 var(--media-caption-track-y,0);transition:translate var(--media-caption-track-duration,0) ease-out;transition-delay:var(--media-caption-track-delay,0);font-family:inherit}media-tooltip-group{display:contents}:host{width:100%;display:grid}media-container{min-width:0;min-height:0}.media-popover--volume:has(media-volume-slider[data-hidden]){display:none}.media-sr-only{white-space:nowrap;clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.media-default-skin ,.media-default-skin :before,.media-default-skin :after{box-sizing:border-box}.media-default-skin img,.media-default-skin video,.media-default-skin svg{max-width:100%;display:block}.media-default-skin button{font:inherit}.media-default-skin [hidden][hidden]{display:none}@media (prefers-reduced-motion:no-preference){.media-default-skin{interpolate-size:allow-keywords}}.media-default-skin{--accent-color:var(--media-accent-color,var(--default-accent-color));--accent-contrast-color:contrast-color(var(--accent-color));--accent-background-color:var(--media-accent-color,oklch(from var(--default-accent-color) l c h / calc(alpha .1)));--accent-text-color:var(--media-accent-text-color,contrast-color(var(--media-accent-color,oklch(0% 0 0))));--shadow-current-color:oklch(from currentColor 0 0 0 / clamp(0, calc((l - .5) * .5), .15));--shadow-subtle-current-color:oklch(from var(--shadow-current-color) l c h / calc(alpha * .4));--scrollbar-thumb-color:oklch(from currentColor l c h / .3);--scale:1;--scale-unit:var(--media-scale-unit,16px);--size:calc(var(--scale-unit) * var(--scale));--spacing:calc(var(--size) / 4);--font-size-medium:calc(.9375 * var(--size));--font-size-base:calc(.8125 * var(--size));--font-size-small:calc(.6875 * var(--size));--font-size-tiny:calc(.5625 * var(--size));--media-icon-size:calc(1.125 * var(--size));--container-border-radius:var(--media-border-radius,1.75rem);width:100%;height:100%;font-family:Inter Variable,Inter,ui-sans-serif,system-ui,sans-serif;font-size:var(--font-size-base);-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;letter-spacing:normal;outline-offset:-4px;scrollbar-color:var(--scrollbar-thumb-color) transparent;scrollbar-width:thin;border-radius:var(--container-border-radius,1.75rem);isolation:isolate;outline:2px solid #0000;line-height:1.5;transition-property:outline-offset,outline-color;transition-duration:.1s;transition-timing-function:ease-out;display:block;position:relative;container:media-root/inline-size;&:focus-visible{outline-color:var(--focus-ring-color);outline-offset:2px}&::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-color);border-radius:9999px}@media (prefers-reduced-transparency:reduce) or (prefers-contrast:more){--scrollbar-thumb-color:oklch(from currentColor l c h / .8);scrollbar-width:auto}}.media-default-skin .media-surface{background-color:var(--surface-background-color);box-shadow:0 0 0 1px var(--surface-outer-border-color), 0 1px 3px 0 var(--surface-shadow-color), 0 1px 2px -1px var(--surface-shadow-color);backdrop-filter:var(--surface-backdrop-filter);&:after{z-index:10;pointer-events:none;content:\\\"\\\";border-radius:inherit;box-shadow:inset 0 1px 0 0 var(--surface-inner-border-color), inset 0 0 0 1px oklch(from var(--surface-inner-border-color) l c h / calc(alpha * .5));position:absolute;inset:0}}.media-default-skin .media-buffering-indicator{z-index:10;color:oklch(100% 0 0);pointer-events:none;place-content:center;display:none;position:absolute;inset:0;&:not([data-visible]){--media-spinner-animation:none}&[data-visible]{display:grid}@media (prefers-reduced-motion:reduce){--media-spinner-animation:none}}.media-default-skin .media-error{outline:none}.media-default-skin .media-error:not([data-open]){display:none}.media-default-skin .media-error__title{font-weight:600;line-height:1.25}.media-default-skin .media-error__description{overflow-wrap:anywhere;opacity:.7}.media-default-skin .media-error__actions{gap:calc(var(--spacing) * 2);display:flex;&>{flex:1}}.media-default-skin .media-error[data-open]~.media-controls {visibility:hidden}.media-default-skin .media-controls{--media-popover-side-offset:calc(var(--spacing) * (var(--base-side-offset,2) + 1));--media-tooltip-side-offset:var(--media-popover-side-offset);--media-popover-boundary-offset:calc(var(--spacing) * var(--base-boundary-offset,2));--media-tooltip-boundary-offset:var(--media-popover-boundary-offset);padding:calc(var(--spacing) * 1);text-shadow:0 1px 0 var(--shadow-current-color);border-radius:3.40282e38px;align-items:center;display:flex;container:media-controls/inline-size;&:dir(rtl){flex-direction:row-reverse}}.media-default-skin .media-time-controls{gap:calc(var(--spacing) * 2.5);flex:1;align-items:center;display:flex;container:media-time-controls/inline-size;&:dir(rtl){flex-direction:row-reverse}&>.media-time:last-child{@container media-time-controls (width<16rem){display:none}}}.media-default-skin .media-time{font-variant-numeric:tabular-nums}.media-default-skin .media-time[role=button]{cursor:pointer;outline-offset:-2px;border-radius:calc(var(--spacing) * 1);outline:2px solid #0000;transition-property:outline-color,outline-offset;transition-duration:.1s;transition-timing-function:ease-out;&:focus-visible{outline-color:var(--focus-ring-color);outline-offset:2px}}.media-default-skin .media-button{height:calc(var(--spacing) * 9);min-height:0;padding:calc(var(--spacing) * 2) calc(var(--spacing) * 4);text-align:center;touch-action:manipulation;cursor:pointer;user-select:none;outline-offset:-2px;will-change:scale;border:none;border-radius:3.40282e38px;outline:2px solid #0000;flex-shrink:0;justify-content:center;align-items:center;transition-property:background-color,color,outline-offset,scale;transition-duration:.15s;transition-timing-function:ease-out;display:flex;&:focus-visible{outline-color:var(--focus-ring-color);outline-offset:2px}&:active:not([aria-disabled=true]){scale:.97}&[aria-disabled=true]{cursor:not-allowed;opacity:.5}}.media-default-skin .media-button--primary{color:var(--accent-contrast-color);text-shadow:none;background:var(--accent-color);font-weight:500}.media-default-skin .media-button--subtle{color:inherit;text-shadow:inherit;background:0 0;&:not([aria-disabled=true]){&:hover,&:focus-visible,&[aria-expanded=true]{color:var(--accent-text-color);background-color:var(--accent-background-color);text-decoration:none}}}.media-default-skin .media-button--icon{aspect-ratio:1;padding:0;display:grid;&:active:not([aria-disabled=true]){scale:.97}& .media-icon__container{display:grid}& .media-icon{filter:drop-shadow(0 1px 0 var(--shadow-current-color));grid-area:1/1;transition-property:opacity,scale;transition-duration:.15s;transition-timing-function:ease-out}}.media-default-skin .media-button--seek{& .media-icon__label{font-variant-numeric:tabular-nums;letter-spacing:-.05em;font-size:.715em;font-weight:500;position:absolute;bottom:-3px;right:-1px}&:has(.media-icon--flipped) .media-icon__label{right:unset;left:-1px}}.media-default-skin .media-button--playback-rate{font-variant-numeric:tabular-nums;padding:0;&:after{content:attr(data-rate) \\\"×\\\";width:4ch}&[data-inline-rate-label]:after{content:none}}.media-default-skin .media-button--settings{& .media-icon--settings{transition:transform .15s ease-in-out;@media (prefers-reduced-motion:reduce){transition-duration:0s}}&[aria-expanded=true] .media-icon--settings{transform:rotate(90deg)}}.media-default-skin .media-button--live{gap:calc(var(--spacing) * 1.5);aspect-ratio:auto;width:auto;padding:calc(var(--spacing) * 2) calc(var(--spacing) * 3);font-size:var(--font-size-small);text-transform:uppercase;letter-spacing:.05em;align-items:center;font-weight:600;line-height:1;display:inline-flex;&:before{width:calc(var(--spacing) * 2);height:calc(var(--spacing) * 2);content:\\\"\\\";background-color:oklch(from currentColor l c h / .4);border-radius:50%;flex-shrink:0;transition:background-color .15s ease-out;display:inline-block}&[data-live-edge]:before{background-color:oklch(65% .22 27)}}@media (prefers-reduced-motion:reduce){.media-default-skin .media-button{will-change:auto;transition-property:background-color,color;scale:1}}.media-default-skin .media-button-group{align-items:center;gap:1px;display:flex;&:dir(rtl){flex-direction:row-reverse}}.media-default-skin .media-badge{padding:calc(var(--spacing) * .5) calc(var(--spacing) * 1.5);font-size:var(--font-size-small);color:oklch(from currentColor l c h / .85);white-space:nowrap;background-color:oklch(from currentColor l c h / .1);border-radius:3.40282e38px;font-weight:500;line-height:1}.media-default-skin .media-icon__container{position:relative}.media-default-skin .media-icon{width:var(--media-icon-size);height:var(--media-icon-size);flex-shrink:0}.media-default-skin .media-icon--flipped,.media-default-skin:dir(rtl) .media-menu__chevron{scale:-1 1}.media-default-skin:dir(rtl) .media-menu__chevron.media-icon--flipped{scale:1}.media-default-skin .media-slider{--track-size:calc(var(--spacing) * 1);--track-highlighted-size:calc(var(--spacing) * 1.75);--track-border-radius:99px;--thumb-size:calc(var(--spacing) * 3);--chapter-gap:calc(var(--spacing) * 1);--chapter-inset-start:calc(var(--chapter-gap) / 2);--chapter-inset-end:calc(var(--chapter-gap) / 2);cursor:pointer;outline:none;flex:1;justify-content:center;align-items:center;display:flex;position:relative;&[data-orientation=horizontal]{width:var(--slider-width,100%);min-width:calc(var(--spacing) * 20);height:var(--slider-height,calc(var(--spacing) * 8))}&[data-orientation=vertical]{width:var(--slider-width,calc(var(--spacing) * 8));height:var(--slider-height,calc(var(--spacing) * 20))}& .media-slider__track{user-select:none;background-color:oklch(from currentColor l c h / .2);border-radius:var(--track-border-radius);isolation:isolate;position:relative;overflow:hidden;&[data-orientation=horizontal]{width:100%;height:var(--track-size)}&[data-orientation=vertical]{width:var(--track-size);height:100%}}& .media-slider__buffer,& .media-slider__fill{pointer-events:none;border-radius:inherit;position:absolute;&[data-orientation=horizontal]{inset-block:0;width:100%;left:0}&[data-orientation=vertical]{inset-inline:0;height:100%;bottom:0}@media (prefers-reduced-motion:no-preference){transition:clip-path .2s ease-out}}&[data-dragging],&[data-seeking]{& .media-slider__fill,& .media-slider__buffer{transition-duration:0s}}& .media-slider__buffer{background-color:oklch(from currentColor l c h / .2);&[data-orientation=horizontal]{clip-path:inset(0 calc(100% - var(--media-slider-buffer)) 0 0 round var(--track-border-radius))}&[data-orientation=vertical]{clip-path:inset(calc(100% - var(--media-slider-buffer)) 0 0 0 round var(--track-border-radius))}}& .media-slider__fill{background-color:var(--accent-color);&[data-orientation=horizontal]{clip-path:inset(0 calc(100% - var(--media-slider-fill)) 0 0 round var(--track-border-radius))}&[data-orientation=vertical]{clip-path:inset(calc(100% - var(--media-slider-fill)) 0 0 0 round var(--track-border-radius))}}&[data-dragging]{& .media-slider__fill[data-orientation=horizontal]{clip-path:inset(0 calc(100% - var(--media-slider-pointer)) 0 0 round var(--track-border-radius))}& .media-slider__fill[data-orientation=vertical]{clip-path:inset(calc(100% - var(--media-slider-pointer)) 0 0 0 round var(--track-border-radius))}}& .media-slider__chapters{border-radius:inherit;flex:1;align-items:center;min-width:0;min-height:0;display:flex;position:relative;&[data-orientation=horizontal]{width:100%;height:100%}&[data-orientation=vertical]{flex-direction:column-reverse;width:100%;height:100%}}& .media-slider__chapter{border-radius:inherit;justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;position:absolute;inset:0;&:first-child{--chapter-inset-start:0px}&:last-child{--chapter-inset-end:0px}& .media-slider__chapter-track{border-radius:inherit;@media (prefers-reduced-motion:no-preference){transition:height .2s ease-out,width .2s ease-out}}&[data-orientation=horizontal]{clip-path:inset(0 calc(100% - var(--media-slider-chapter-end)) 0 var(--media-slider-chapter-start));& .media-slider__chapter-track{height:var(--track-size);clip-path:inset(0 calc(100% - var(--media-slider-chapter-end) + var(--chapter-inset-end)) 0 calc(var(--media-slider-chapter-start) + var(--chapter-inset-start)) round var(--track-border-radius))}&[data-highlighted] .media-slider__chapter-track{height:var(--track-highlighted-size)}}&[data-orientation=vertical]{clip-path:inset(calc(100% - var(--media-slider-chapter-end)) 0 var(--media-slider-chapter-start) 0);& .media-slider__chapter-track{width:var(--track-size);clip-path:inset(calc(100% - var(--media-slider-chapter-end) + var(--chapter-inset-end)) 0 calc(var(--media-slider-chapter-start) + var(--chapter-inset-start)) 0 round var(--track-border-radius))}&[data-highlighted] .media-slider__chapter-track{width:var(--track-highlighted-size)}}}& .media-slider__thumb{z-index:10;width:var(--thumb-size);height:var(--thumb-size);user-select:none;outline-offset:-4px;box-shadow:0 0 0 1px var(--shadow-current-color,oklch(0% 0 0/.1)), 0 1px 3px 0 oklch(0% 0 0/.35), 0 1px 2px -1px oklch(0% 0 0/.35);opacity:0;background-color:currentColor;border-radius:3.40282e38px;outline:4px solid #0000;position:absolute;translate:-50% -50%;scale:.8;&[data-orientation=horizontal]{top:50%;left:var(--media-slider-fill)}&[data-orientation=vertical]{top:calc(100% - var(--media-slider-fill));left:50%}&:focus-visible{outline-color:oklch(from currentColor l c h / .15);outline-offset:0;opacity:1}&:after{content:\\\"\\\";border-radius:inherit;position:absolute;inset:-4px;box-shadow:0 0 0 2px}&:not(:focus-visible):after{opacity:0;scale:.5}&.media-slider__thumb--persistent{opacity:1;scale:1}@media (hover:hover) and (pointer:fine){&:hover{outline-color:oklch(from currentColor l c h / .15);outline-offset:0}}@media (prefers-reduced-motion:no-preference){transition-property:opacity,outline-offset,left,top,scale;transition-duration:.15s;transition-timing-function:ease-out;&:after{transition-property:opacity,scale;transition-duration:.15s;transition-timing-function:ease-out}}}@media (hover:hover) and (pointer:fine){&:hover .media-slider__thumb{opacity:1;scale:1}}&[data-dragging] .media-slider__thumb{opacity:1;scale:.9;@media (prefers-reduced-motion:no-preference){transition-property:opacity,outline-offset,scale}&[data-orientation=horizontal]{left:var(--media-slider-pointer)}&[data-orientation=vertical]{top:calc(100% - var(--media-slider-pointer))}}& .media-slider__preview{--max-size-factor:36;--max-size:min(calc(var(--spacing) * var(--max-size-factor)), 100cqi);min-width:var(--max-size);height:calc(var(--spacing) * 1);@container media-root (width>42rem){--max-size-factor:48}& .media-slider__thumbnail,& .media-slider__value{max-width:var(--max-size);opacity:0;filter:blur(8px);transform-origin:bottom;scale:.8;translate:-50% calc(var(--spacing) * 2);transition-duration:.15s;transition-timing-function:ease-out;position:absolute;left:50%}& .media-slider__thumbnail{--thumbnail-max-width:var(--max-size);--thumbnail-max-height:var(--max-size);bottom:calc(100% + (var(--spacing) * 9))}& .media-slider__value{bottom:calc(100% + (var(--spacing) * 10.5));text-shadow:0 1px 0 var(--shadow-current-color);flex-direction:column;align-items:center;display:flex}& .media-slider__chapter-title{min-width:0;max-width:var(--max-size);padding-inline:calc(var(--spacing) * 6);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;&:empty{display:none}}&:before{z-index:1;width:calc(var(--spacing) * 1);height:calc(var(--spacing) * 1);pointer-events:none;content:\\\"\\\";box-shadow:0 0 0 1px var(--shadow-current-color,oklch(0% 0 0/.15)), 0 1px 2px 0 oklch(0% 0 0/.35);opacity:0;background-color:currentColor;border-radius:100%;transition-property:opacity,scale;transition-duration:.2s;transition-timing-function:ease-out;position:absolute;top:50%;left:50%;translate:-50% -50%;scale:.5}}&:is([data-pointing],:has(:focus-visible)) .media-slider__preview :is(.media-slider__value,.media-slider__thumbnail),& .media-slider__preview[data-pointing]:not([data-dragging]):before{opacity:1;filter:blur();scale:1}}.media-default-skin{--popup-transition:opacity var(--popup-transition-timing-function) var(--popup-transition-duration), filter var(--popup-transition-timing-function) var(--popup-transition-duration), transform var(--popup-transition-timing-function) var(--popup-transition-duration), scale var(--popup-transition-timing-function) var(--popup-transition-duration)}.media-default-skin .media-popover,.media-default-skin .media-tooltip{--popup-translate-distance:calc(.5 * var(--scale-unit));color:inherit;transition:var(--popup-transition);border:0;margin:0;overflow:visible;&[data-starting-style],&[data-ending-style]{opacity:0;filter:blur(4px);transform:translate(var(--popup-translate-x-distance,0), var(--popup-translate-y-distance,0));scale:.95}&[data-ending-style]{transition-duration:max(0s, calc(var(--popup-transition-duration) - 50ms));transform:none}&[data-side=top]{--popup-translate-y-distance:var(--popup-translate-distance);transform-origin:bottom}&[data-side=bottom]{--popup-translate-y-distance:calc(var(--popup-translate-distance) * -1);transform-origin:top}&[data-side=left]{--popup-translate-x-distance:var(--popup-translate-distance);transform-origin:100%}&[data-side=right]{--popup-translate-x-distance:calc(var(--popup-translate-distance) * -1);transform-origin:0}&:before{pointer-events:inherit;content:\\\"\\\";position:absolute}&[data-side=top]:before,&[data-side=bottom]:before{width:100%;inset-inline:0}&[data-side=top]:before{top:100%}&[data-side=bottom]:before{bottom:100%}&[data-side=left]:before,&[data-side=right]:before{height:100%;inset-block:0}&[data-side=left]:before{left:100%}&[data-side=right]:before{right:100%}}.media-default-skin .media-popover{&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-popover-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-popover-side-offset)}}.media-default-skin .media-popover--volume{padding:calc(var(--spacing) * 3) 0;border-radius:3.40282e38px;&:has(media-volume-slider[data-hidden]){display:none}}.media-default-skin .media-tooltip{padding:calc(var(--spacing) * 1) calc(var(--spacing) * 2.5);font-size:var(--font-size-base);white-space:nowrap;border-radius:3.40282e38px;&[data-open]{column-gap:calc(var(--spacing) * 1);align-items:center;display:flex}&[data-side=top]:before,&[data-side=bottom]:before{height:var(--media-tooltip-side-offset)}&[data-side=left]:before,&[data-side=right]:before{width:var(--media-tooltip-side-offset)}& .media-tooltip__kbd{min-width:1.5em;font-family:inherit;font-size:var(--font-size-small);text-align:center;background-color:oklch(from currentColor l c h / .3);border-radius:calc(var(--spacing) * 1);padding:.1em;font-weight:600;line-height:1.25}}.media-default-skin .media-menu{--menu-transition-duration:.25s;--menu-max-height:calc(var(--spacing) * 56);--menu-padding:calc(var(--spacing) * 1);--menu-border-radius:calc(var(--spacing) * 3);--menu-item-border-radius:calc(var(--menu-border-radius) - var(--menu-padding));box-sizing:border-box;min-width:max-content;max-width:var(--media-popover-available-width,none);max-height:min(var(--media-popover-available-height,var(--menu-max-height)), var(--menu-max-height));padding:var(--menu-padding);overscroll-behavior:none;border-radius:var(--menu-border-radius);overflow:auto;@media (prefers-reduced-motion:reduce){--menu-transition-duration:0s}&>.media-menu__panel{inset-inline:0;z-index:10;max-height:inherit;padding:var(--menu-padding);overscroll-behavior:none;transition-timing-function:ease-out;transition-duration:var(--menu-transition-duration);outline:none;transition-property:translate,filter;position:absolute;top:0;overflow:auto;translate:0;&:where([data-starting-style],[data-ending-style]){pointer-events:none;filter:blur(8px);overflow:hidden;translate:100%}&:dir(rtl):where([data-starting-style],[data-ending-style]){translate:-100%}}& .media-menu__separator{margin-block:calc(var(--spacing) * 1);border-bottom:1px solid oklch(0% 0 0/.1);box-shadow:0 1px oklch(100% 0 0/.075)}& .media-menu__group{anchor-scope:--menu-item-highlight-anchor;gap:calc(var(--spacing) * .5);flex-direction:column;display:flex;@supports (top:anchor(top)){&:before{position-anchor:--menu-item-highlight-anchor;inset:anchor(inside);overflow-anchor:none;pointer-events:none;content:\\\"\\\";background-color:var(--accent-background-color);border-radius:var(--menu-item-border-radius);transition:inset .1s ease-in-out;position:absolute}&:has([data-highlighted=\\\"\\\"]):before{transition-duration:0s}}}& .media-menu__item,& .media-menu__back{gap:calc(var(--spacing) * 1.5);padding:calc(var(--spacing) * 1.5) calc(var(--spacing) * 2);text-align:start;text-shadow:0 1px 0 var(--shadow-current-color);cursor:pointer;user-select:none;outline-offset:-2px;border-radius:var(--menu-item-border-radius);outline:2px solid #0000;align-items:center;transition:background-color .1s ease-in-out,color .1s ease-in-out;display:flex;position:relative;& .media-icon{color:oklch(from currentColor l c h / .65);filter:drop-shadow(0 1px 0 var(--shadow-current-color));flex-shrink:0}&:focus-visible{outline-color:var(--focus-ring-color);outline-offset:2px}&:hover,&[data-highlighted]{color:var(--accent-text-color);background-color:var(--accent-background-color);& .media-icon{color:inherit}}@supports (top:anchor(top)){transition-duration:50ms;&:hover,&[data-highlighted]{transition-duration:.2s}}}& .media-menu__indicator{margin-inline:auto calc(var(--spacing) * -1);opacity:0;flex-shrink:0;& .media-icon{filter:drop-shadow(0 1px 0 var(--shadow-current-color))}}& .media-menu__item{font-variant-numeric:tabular-nums;color:inherit;justify-content:space-between;&[aria-disabled=true]{pointer-events:none;cursor:not-allowed;opacity:.5}&[aria-checked=true] .media-menu__indicator{opacity:1}&[data-availability=unavailable],&[data-availability=unsupported]{display:none}&[data-highlighted]{@supports (top:anchor(top)){anchor-name:--menu-item-highlight-anchor;background-color:#0000}}}& .media-menu__tier{padding-inline-start:calc(var(--spacing) * .5);font-size:var(--font-size-tiny);color:oklch(from currentColor l c h / .7);padding-top:1px;font-weight:600;line-height:1}& .media-menu__back{width:100%;margin-bottom:calc(var(--spacing) * .5)}& .media-menu__hint{gap:calc(var(--spacing) * 1);min-width:0;color:oklch(from currentColor l c h / .65);align-items:center;margin-inline-start:auto;padding-inline-start:calc(var(--spacing) * 2);display:inline-flex}& .media-menu__hint-label{max-width:calc(var(--spacing) * 24);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}& .media-menu__chevron{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}&.media-menu--settings{width:var(--media-menu-width);min-width:calc(var(--spacing) * 48);height:var(--media-menu-height);transition:var(--popup-transition), width var(--popup-transition-timing-function) var(--menu-transition-duration), height var(--popup-transition-timing-function) var(--menu-transition-duration);overflow:hidden;&>:not([data-submenu]){transition:translate var(--menu-transition-duration) ease-out, filter var(--menu-transition-duration) ease-out;translate:0}&[data-submenu-expanded=true]>:not([data-submenu]){filter:blur(8px);translate:-100%}&:dir(rtl)[data-submenu-expanded=true]>:not([data-submenu]){translate:100%}&[data-submenu-expanded]>:not([data-submenu]):before{display:none}&[data-starting-style],&[data-ending-style]{transition:var(--popup-transition)}}}.media-button--play .media-icon--restart,.media-button--play .media-icon--play,.media-button--play .media-icon--pause,.media-button--mute .media-icon--volume-off,.media-button--mute .media-icon--volume-low,.media-button--mute .media-icon--volume-high{opacity:0;display:none}.media-button--play[data-ended] .media-icon--restart,.media-button--play:not([data-ended])[data-paused] .media-icon--play,.media-button--play:not([data-ended]):not([data-started]) .media-icon--play,.media-button--play[data-started]:not([data-paused]):not([data-ended]) .media-icon--pause,.media-button--mute[data-muted] .media-icon--volume-off,.media-button--mute:not([data-muted])[data-volume-level=low] .media-icon--volume-low,.media-button--mute:not([data-muted]):not([data-volume-level=low]) .media-icon--volume-high{opacity:1;display:block}.media-default-skin--audio{--default-accent-color:light-dark(oklch(0% 0 0),oklch(100% 0 0));--text-color:light-dark(oklch(0% 0 0),oklch(100% 0 0));--border-color:oklch(0% 0 0/.1);--focus-ring-color:light-dark(oklch(0% 0 0),oklch(100% 0 0));--surface-background-color:light-dark(oklch(100% 0 0/.5),oklch(0% 0 0/.4));--surface-inner-border-color:oklch(100% 0 0/.1);--surface-outer-border-color:oklch(0% 0 0/.05);--surface-shadow-color:oklch(0% 0 0/.15);--surface-backdrop-filter:blur(16px) saturate(1.5);--error-dialog-transition-duration:.25s;--error-dialog-transition-delay:.1s;--popup-transition-duration:.1s;--popup-transition-timing-function:ease-out;@media (prefers-reduced-motion:reduce){--error-dialog-transition-duration:50ms;--error-dialog-transition-delay:0s;--popup-transition-duration:0s}@media (prefers-reduced-transparency:reduce) or (prefers-contrast:more){--surface-background-color:light-dark(oklch(100% 0 0),oklch(0% 0 0));--surface-inner-border-color:light-dark(oklch(100% 0 0/.1),oklch(100% 0 0/.2));--surface-outer-border-color:light-dark(oklch(0% 0 0/.05),#0000)}}.media-default-skin--audio .media-error__dialog{z-index:20;gap:calc(var(--spacing) * 3);padding-inline:calc(var(--spacing) * 5) calc(var(--spacing) * .5);color:var(--text-color);background-color:var(--surface-background-color);backdrop-filter:var(--surface-backdrop-filter);transition-delay:var(--error-dialog-transition-delay);transition-timing-function:ease-out;transition-duration:var(--error-dialog-transition-duration);border-radius:3.40282e38px;align-items:center;transition-property:opacity,filter;display:flex;position:absolute;inset:0}.media-default-skin .media-error[data-starting-style] .media-error__dialog,.media-default-skin .media-error[data-ending-style] .media-error__dialog{opacity:0;filter:blur(4px)}.media-default-skin .media-error[data-ending-style] .media-error__dialog{transition-delay:0s}.media-default-skin--audio .media-error__content{gap:calc(var(--spacing) * 2);flex:1;align-items:center;display:flex}.media-default-skin--audio .media-controls{--base-boundary-offset:2;color:var(--text-color);& .media-time-controls{padding-inline:calc(var(--spacing) * 3)}& .media-button--seek{@container media-root (width<32rem){display:none}}}.media-default-skin--audio .media-button--play__wrapper{display:inline-flex;position:relative}.media-default-skin--audio .media-button--play__wrapper .media-buffering-indicator{color:inherit}.media-default-skin--audio .media-button--play__wrapper:has(.media-buffering-indicator[data-visible]) .media-button--play .media-icon{opacity:0}.media-default-skin--audio .media-slider__track{background-color:light-dark(oklch(0% 0 0/.1),oklch(100% 0 0/.2));box-shadow:0 0 0 1px light-dark(#0000,oklch(0% 0 0/.05))}\";","import { renderIcon } from '@videojs/icons/render';\nimport { createShadowStyle, createTemplate } from '@videojs/utils/dom';\nimport { safeDefine } from '../safe-define';\nimport { SkinElement } from '../skin-element';\nimport styles from './skin.css?inline';\n\n// Register the player, container, and all UI custom elements.\nimport './ui';\n\nconst SEEK_TIME = 10;\n\nfunction getTemplateHTML() {\n return /html/ `\n <media-container class=\"media-default-skin media-default-skin--audio\">\n <!-- @deprecated slot=\"media\" is no longer required, use the default slot instead -->\n <slot name=\"media\"></slot>\n <slot></slot>\n\n <media-error-dialog class=\"media-error\">\n <div class=\"media-error__dialog\">\n <div class=\"media-error__content\">\n <media-alert-dialog-title class=\"media-error__title\"></media-alert-dialog-title>\n <media-alert-dialog-description class=\"media-error__description\"></media-alert-dialog-description>\n </div>\n <div class=\"media-error__actions\">\n <media-alert-dialog-close class=\"media-button media-button--subtle\"></media-alert-dialog-close>\n </div>\n </div>\n </media-error-dialog>\n\n <div class=\"media-surface media-controls\">\n <media-tooltip-group>\n <div class=\"media-button-group\">\n <span class=\"media-button--play__wrapper\">\n <media-buffering-indicator class=\"media-buffering-indicator\">\n ${renderIcon('spinner', { class: 'media-icon' })}\n </media-buffering-indicator>\n <media-play-button commandfor=\"play-tooltip\" class=\"media-button media-button--subtle media-button--icon media-button--play\">\n ${renderIcon('restart', { class: 'media-icon media-icon--restart' })}\n ${renderIcon('play', { class: 'media-icon media-icon--play' })}\n ${renderIcon('pause', { class: 'media-icon media-icon--pause' })}\n </media-play-button>\n <media-tooltip id=\"play-tooltip\" side=\"top\" boundary=\"viewport\" class=\"media-surface media-tooltip\">\n <media-tooltip-label></media-tooltip-label>\n <media-tooltip-shortcut class=\"media-tooltip__kbd\"></media-tooltip-shortcut>\n </media-tooltip>\n </span>\n\n <media-seek-button commandfor=\"seek-backward-tooltip\" seconds=\"${-SEEK_TIME}\" class=\"media-button media-button--subtle media-button--icon media-button--seek\">\n <span class=\"media-icon__container\">\n ${renderIcon('seek', { class: 'media-icon media-icon--seek media-icon--flipped' })}\n <span class=\"media-icon__label\">${SEEK_TIME}</span>\n </span>\n </media-seek-button>\n <media-tooltip id=\"seek-backward-tooltip\" side=\"top\" boundary=\"viewport\" class=\"media-surface media-tooltip\">\n <media-tooltip-label></media-tooltip-label>\n <media-tooltip-shortcut class=\"media-tooltip__kbd\"></media-tooltip-shortcut>\n </media-tooltip>\n\n <media-seek-button commandfor=\"seek-forward-tooltip\" seconds=\"${SEEK_TIME}\" class=\"media-button media-button--subtle media-button--icon media-button--seek\">\n <span class=\"media-icon__container\">\n ${renderIcon('seek', { class: 'media-icon media-icon--seek' })}\n <span class=\"media-icon__label\">${SEEK_TIME}</span>\n </span>\n </media-seek-button>\n <media-tooltip id=\"seek-forward-tooltip\" side=\"top\" boundary=\"viewport\" class=\"media-surface media-tooltip\">\n <media-tooltip-label></media-tooltip-label>\n <media-tooltip-shortcut class=\"media-tooltip__kbd\"></media-tooltip-shortcut>\n </media-tooltip>\n </div>\n\n <div class=\"media-time-controls\">\n <media-time type=\"current\" class=\"media-time\"></media-time>\n <media-time-slider class=\"media-slider\">\n <media-slider-track class=\"media-slider__track\">\n <media-slider-buffer class=\"media-slider__buffer\"></media-slider-buffer>\n <media-slider-fill class=\"media-slider__fill\"></media-slider-fill>\n </media-slider-track>\n <media-slider-thumb class=\"media-slider__thumb\"></media-slider-thumb>\n <media-slider-preview overflow=\"visible\" class=\"media-slider__preview\">\n <media-slider-value type=\"pointer\" class=\"media-slider__value media-time\"></media-slider-value>\n </media-slider-preview>\n </media-time-slider>\n <media-time toggle type=\"remaining\" class=\"media-time\"></media-time>\n </div>\n\n <div class=\"media-button-group\">\n <media-playback-rate-button commandfor=\"playback-rate-menu\" class=\"media-button media-button--subtle media-button--icon media-button--playback-rate\"></media-playback-rate-button>\n <media-menu id=\"playback-rate-menu\" side=\"top\" align=\"center\" boundary=\"viewport\" class=\"media-surface media-popover media-menu\">\n <media-playback-rate-radio-group class=\"media-menu__group\">\n <template>\n <media-menu-radio-item class=\"media-menu__item\">\n <span data-part=\"label\"></span>\n <media-menu-item-indicator force-mount class=\"media-menu__indicator\">\n ${renderIcon('check', { class: 'media-icon' })}\n </media-menu-item-indicator>\n </media-menu-radio-item>\n </template>\n </media-playback-rate-radio-group>\n </media-menu>\n\n <media-mute-button commandfor=\"audio-volume-popover\" class=\"media-button media-button--subtle media-button--icon media-button--mute\">\n ${renderIcon('volume-off', { class: 'media-icon media-icon--volume-off' })}\n ${renderIcon('volume-low', { class: 'media-icon media-icon--volume-low' })}\n ${renderIcon('volume-high', { class: 'media-icon media-icon--volume-high' })}\n </media-mute-button>\n\n <media-popover id=\"audio-volume-popover\" open-on-hover delay=\"200\" close-delay=\"100\" side=\"top\" boundary=\"viewport\" class=\"media-surface media-popover media-popover--volume\">\n <media-volume-slider class=\"media-slider\" orientation=\"vertical\" thumb-alignment=\"edge\">\n <media-slider-track class=\"media-slider__track\">\n <media-slider-fill class=\"media-slider__fill\"></media-slider-fill>\n </media-slider-track>\n <media-slider-thumb class=\"media-slider__thumb media-slider__thumb--persistent\"></media-slider-thumb>\n </media-volume-slider>\n </media-popover>\n </div>\n </media-tooltip-group>\n </div>\n\n <!-- Hotkeys -->\n <media-hotkey keys=\"Space\" action=\"togglePaused\"></media-hotkey>\n <media-hotkey keys=\"k\" action=\"togglePaused\"></media-hotkey>\n <media-hotkey keys=\"m\" action=\"toggleMuted\"></media-hotkey>\n <media-hotkey keys=\"ArrowRight\" action=\"seekStep\" value=\"5\"></media-hotkey>\n <media-hotkey keys=\"ArrowLeft\" action=\"seekStep\" value=\"-5\"></media-hotkey>\n <media-hotkey keys=\"l\" action=\"seekStep\" value=\"10\"></media-hotkey>\n <media-hotkey keys=\"j\" action=\"seekStep\" value=\"-10\"></media-hotkey>\n <media-hotkey keys=\"ArrowUp\" action=\"volumeStep\" value=\"0.05\"></media-hotkey>\n <media-hotkey keys=\"ArrowDown\" action=\"volumeStep\" value=\"-0.05\"></media-hotkey>\n <media-hotkey keys=\"0-9\" action=\"seekToPercent\"></media-hotkey>\n <media-hotkey keys=\"Home\" action=\"seekToPercent\" value=\"0\"></media-hotkey>\n <media-hotkey keys=\"End\" action=\"seekToPercent\" value=\"100\"></media-hotkey>\n <media-hotkey keys=\">\" action=\"speedUp\"></media-hotkey>\n <media-hotkey keys=\"<\" action=\"speedDown\"></media-hotkey>\n </media-container>\n `;\n}\n\nexport class AudioSkinElement extends SkinElement {\n static readonly tagName = 'audio-skin';\n static styles = createShadowStyle(styles);\n static template = createTemplate(getTemplateHTML());\n}\n\nsafeDefine(AudioSkinElement);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [AudioSkinElement.tagName]: AudioSkinElement;\n }\n}\n"],"mappings":"kPAAA,IAAA,EAAe,201BCWf,SAAS,GAAkB,CACzB,MAAO,4vBAAA,EAAA,UAAA,CAAA,MAAA,YAAA,CAAA,EAAA,6JAAA,EAAA,UAAA,CAAA,MAAA,gCAAA,CAAA,EAAA,GAAA,EAAA,OAAA,CAAA,MAAA,6BAAA,CAAA,EAAA,GAAA,EAAA,QAAA,CAAA,MAAA,8BAAA,CAAA,EAAA,mcAAA,EAAA,OAAA,CAAA,MAAA,iDAAA,CAAA,EAAA,mfAAA,EAAA,OAAA,CAAA,MAAA,6BAAA,CAAA,EAAA,giDAAA,EAAA,QAAA,CAAA,MAAA,YAAA,CAAA,EAAA,uPAAA,EAAA,aAAA,CAAA,MAAA,mCAAA,CAAA,EAAA,GAAA,EAAA,aAAA,CAAA,MAAA,mCAAA,CAAA,EAAA,GAAA,EAAA,cAAA,CAAA,MAAA,oCAAA,CAAA,EAAA,uhDA4HT,CAQA,EAAW,cAN2B,CAAY,QACtB,KAAA,QAAA,oBACV,KAAA,OAAA,EAAkB,CAAM,SACtB,KAAA,SAAA,EAAe,EAAgB,CAAC,EACpD,CAE2B"}

package/cdn/background.dev.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { r as ReactiveElement, t as MediaElement } from "./media-element-CJY3JIgc.js";
 import { i as safeDefine } from "./context-OhQY847V.js";
 import { t as MediaContainerElement } from "./container-element-HHK_KZOE.js";
-import { a as backgroundFeatures, t as createPlayer } from "./create-player-5UrHNqBI.js";
+import { a as backgroundFeatures, t as createPlayer } from "./create-player-BEEc22xK.js";
 import { r as ensureGlobalStyle } from "./shadow-styles-BkjnRJ4e.js";
 import "./background-video-WKumpp49.js";

package/cdn/background.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{r as e,t}from"./media-element-Cp5PrNre.js";import{i as n}from"./context-C2rsoDxk.js";import{t as r}from"./container-element-Dd0ZCdhK.js";import{a as i,t as a}from"./create-player-LjvbIxIq.js";import{r as o}from"./shadow-styles-DQiIr3u8.js";import"./background-video-YHY_3-lX.js";const{ProviderMixin:s}=a({features:i});n(class extends s(t){static{this.tagName=`background-video-player`}}),n(r);var c=`background-video-player{display:contents}background-video-skin{--media-object-fit:cover;object-fit:var(--media-object-fit);width:100%;min-width:300px;height:100%;min-height:150px;display:block;position:relative}background-video-skin>:not(img,picture){object-fit:inherit;width:100%;height:100%;position:absolute;inset:0}background-video-skin>img,background-video-skin>picture{object-fit:inherit;width:100%;height:100%}`;function l(){return`<media-container><slot name="media"></slot><slot></slot></media-container>`}n(class extends e{static{this.tagName=`background-video-skin`}static{this.shadowRootOptions={mode:`open`}}static{this.getTemplateHTML=l}constructor(){super(),o(`__media-background-styles`,c),this.shadowRoot||(this.attachShadow(this.constructor.shadowRootOptions),this.shadowRoot.innerHTML=l())}});
+import{r as e,t}from"./media-element-Cp5PrNre.js";import{i as n}from"./context-C2rsoDxk.js";import{t as r}from"./container-element-Dd0ZCdhK.js";import{a as i,t as a}from"./create-player-D5WQ_jzZ.js";import{r as o}from"./shadow-styles-DQiIr3u8.js";import"./background-video-YHY_3-lX.js";const{ProviderMixin:s}=a({features:i});n(class extends s(t){static{this.tagName=`background-video-player`}}),n(r);var c=`background-video-player{display:contents}background-video-skin{--media-object-fit:cover;object-fit:var(--media-object-fit);width:100%;min-width:300px;height:100%;min-height:150px;display:block;position:relative}background-video-skin>:not(img,picture){object-fit:inherit;width:100%;height:100%;position:absolute;inset:0}background-video-skin>img,background-video-skin>picture{object-fit:inherit;width:100%;height:100%}`;function l(){return`<media-container><slot name="media"></slot><slot></slot></media-container>`}n(class extends e{static{this.tagName=`background-video-skin`}static{this.shadowRootOptions={mode:`open`}}static{this.getTemplateHTML=l}constructor(){super(),o(`__media-background-styles`,c),this.shadowRoot||(this.attachShadow(this.constructor.shadowRootOptions),this.shadowRoot.innerHTML=l())}});
 //# sourceMappingURL=background.js.map

package/cdn/{compounds-D1FPw7jg.js → compounds-BA8gXlmJ.js} RENAMED Viewed

@@ -7,7 +7,7 @@ import { a as createContext, i as safeDefine, r as playerContext, t as container
 import { a as containsComposed, c as i18nContext, l as ContextProvider, n as popupGroupContext, o as isDocument, r as I18nController, s as getDeepActiveElement } from "./container-element-HHK_KZOE.js";
 import { t as listen } from "./listen-CdeggIF8.js";
 import { t as noop } from "./noop-BxkeRIz9.js";
-import { A as isMediaStreamTypeCapable, C as errorFeature, D as audioTrackFeature, E as bufferFeature, M as isEditableTarget, N as isInteractiveActivation, O as isMediaBufferCapable, S as fullscreenFeature, T as getGestureCoordinator, _ as playbackRateFeature, b as metadataFeature, c as createState, d as volumeFeature, f as timeFeature, g as qualityFeature, h as remotePlaybackFeature, j as definePlayerFeature, k as isMediaSeekCapable, l as throwNoTargetError, m as sourceFeature, n as PlayerController, p as textTrackFeature, r as SnapshotController, u as AbortControllerRegistry, v as playbackFeature, w as controlsFeature, x as liveFeature, y as pipFeature } from "./create-player-5UrHNqBI.js";
+import { A as isMediaSeekCapable, C as fullscreenFeature, D as bufferFeature, E as getGestureCoordinator, M as definePlayerFeature, N as isEditableTarget, O as audioTrackFeature, P as isInteractiveActivation, S as liveFeature, T as controlsFeature, _ as qualityFeature, b as pipFeature, d as AbortControllerRegistry, f as volumeFeature, g as remotePlaybackFeature, h as sourceFeature, j as isMediaStreamTypeCapable, k as isMediaBufferCapable, l as createState, m as textTrackFeature, n as PlayerController, p as timeFeature, r as SnapshotController, u as throwNoTargetError, v as playbackRateFeature, w as errorFeature, x as metadataFeature, y as playbackFeature } from "./create-player-BEEc22xK.js";
 import { n as kebabCase } from "./casing-Cu0fL85w.js";
 import { i as observeResize, n as observeElements } from "./observe-elements-B4q3zaDw.js";
 import { n as isCaptionOrSubtitleTrack } from "./text-track-DMA7pa8W.js";
@@ -75,8 +75,8 @@ function followElementPath(root, getNext) {
 //#region ../utils/dist/dom/direction.js
 /** Check whether an element's text direction is right-to-left. */
 function isRTL(element) {
-	const dir = element.closest("[dir]")?.getAttribute("dir");
-	if (dir) return dir.toLowerCase() === "rtl";
+	const dir = element.closest("[dir]")?.getAttribute("dir")?.toLowerCase();
+	if (dir === "rtl" || dir === "ltr") return dir === "rtl";
 	return getComputedStyle(element).direction === "rtl";
 }
@@ -343,87 +343,6 @@ function rafThrottle(fn) {
 	return throttled;
 }
-//#endregion
-//#region ../utils/dist/dom/template.js
-/** Create an `HTMLTemplateElement` from an HTML string, or `null` when `document` is unavailable (SSR). */
-function createTemplate(html) {
-	const doc = globalThis.document;
-	if (!doc) return null;
-	const template = doc.createElement("template");
-	template.innerHTML = html;
-	return template;
-}
-/** Return the first direct-child template in a container. */
-function getTemplateElement(container) {
-	for (const child of container.children) if (child.localName === "template" && "content" in child) return child;
-	return null;
-}
-/** Return a template's only element root, or `null` when it does not contain exactly one. */
-function getTemplateRoot(template) {
-	const root = template.content.firstElementChild;
-	return root && !root.nextElementSibling ? root : null;
-}
-/** Deep-clone a resolved template root into the target document. */
-function cloneTemplateRoot(root, targetDocument = root.ownerDocument) {
-	return targetDocument.importNode(root, true);
-}
-/** Deep-clone a template's content into a container. */
-function renderTemplate(container, template) {
-	container.appendChild(container.ownerDocument.importNode(template.content, true));
-}
-//#endregion
-//#region ../core/dist/dev/i18n/text/menu.js
-const prefix$7 = "menu.";
-const settingsText = {
-	key: `${prefix$7}settings`,
-	text: "Settings"
-};
-const qualityText = {
-	key: `${prefix$7}quality`,
-	text: "Quality"
-};
-const audioText = {
-	key: `${prefix$7}audio`,
-	text: "Audio"
-};
-const defaultText = {
-	key: `${prefix$7}default`,
-	text: "Default"
-};
-const speedText = {
-	key: `${prefix$7}speed`,
-	text: "Speed"
-};
-const captionsText = {
-	key: `${prefix$7}captions`,
-	text: "Captions"
-};
-const playbackRateText = {
-	key: `${prefix$7}playbackRate`,
-	text: "Playback rate"
-};
-const backText = {
-	key: `${prefix$7}back`,
-	text: "Back"
-};
-const offText = {
-	key: `${prefix$7}off`,
-	text: "Off"
-};
-const autoText = {
-	key: `${prefix$7}auto`,
-	text: "Auto"
-};
-const autoWithLabelText = {
-	key: `${prefix$7}autoWithLabel`,
-	text: "Auto ({label})"
-};
-const subtitlesText = {
-	key: `${prefix$7}subtitles`,
-	text: "Subtitles"
-};
 //#endregion
 //#region ../core/dist/dev/dom/store/features/stream-type.js
 const streamTypeFeature = definePlayerFeature({
@@ -2026,6 +1945,10 @@ function shiftCrossAxis(value, boundaryStart, boundaryEnd, size) {
 	const max = boundaryEnd - size;
 	return max < boundaryStart ? boundaryStart : clamp(value, boundaryStart, max);
 }
+function getHorizontalAlign({ align, direction = "ltr" }) {
+	if (direction !== "rtl") return align;
+	return align === "start" ? "end" : align === "end" ? "start" : align;
+}
 function getAnchorCrossAxisShift(start, end, size, boundaryStart, boundaryEnd, align, alignOffset, boundaryOffset) {
 	const base = align === "start" ? start + alignOffset : align === "end" ? end + alignOffset : start + size / 2 + alignOffset;
 	const desiredTranslate = align === "start" ? "0px" : align === "end" ? "-100%" : "-50%";
@@ -2083,15 +2006,16 @@ function getAnchorPositionCSS(anchorName, opts, cssVars = PopoverCSSVars, trigge
 	};
 	const insetProp = OPPOSITE_SIDE[side];
 	if (side === "top" || side === "bottom") {
+		const horizontalAlign = getHorizontalAlign(opts);
 		style[insetProp] = `calc(anchor(${side}) + ${SIDE_OFFSET_VAR})`;
 		if (triggerRect && boundaryRect) {
-			const { base, translate } = getAnchorCrossAxisShift(triggerRect.left, triggerRect.right, triggerRect.width, boundaryRect.left, boundaryRect.right, align, offsets.alignOffset, boundaryOffset);
+			const { base, translate } = getAnchorCrossAxisShift(triggerRect.left, triggerRect.right, triggerRect.width, boundaryRect.left, boundaryRect.right, horizontalAlign, offsets.alignOffset, boundaryOffset);
 			style.left = base;
 			style.translate = `${translate} 0`;
 			return style;
 		}
-		if (align === "start") style.left = `calc(anchor(left) + ${ALIGN_OFFSET_VAR})`;
-		else if (align === "end") style.right = `calc(anchor(right) + ${ALIGN_OFFSET_VAR})`;
+		if (horizontalAlign === "start") style.left = `calc(anchor(left) + ${ALIGN_OFFSET_VAR})`;
+		else if (horizontalAlign === "end") style.right = `calc(anchor(right) + ${ALIGN_OFFSET_VAR})`;
 		else {
 			style.justifySelf = "anchor-center";
 			style.marginInlineStart = ALIGN_OFFSET_VAR;
@@ -2164,10 +2088,12 @@ function getManualPositionStyle(triggerRect, popupRect, opts, offsets = {
 	else if (side === "bottom") top = triggerRect.bottom + sideOffset;
 	else if (side === "left") right = `calc(100% - ${triggerRect.left}px + ${sideOffset}px)`;
 	else left = triggerRect.right + sideOffset;
-	if (side === "top" || side === "bottom") if (align === "start") left = triggerRect.left + alignOffset;
-	else if (align === "end") left = triggerRect.right - popupRect.width + alignOffset;
-	else left = triggerRect.left + (triggerRect.width - popupRect.width) / 2 + alignOffset;
-	else if (align === "start") top = triggerRect.top + alignOffset;
+	if (side === "top" || side === "bottom") {
+		const horizontalAlign = getHorizontalAlign(opts);
+		if (horizontalAlign === "start") left = triggerRect.left + alignOffset;
+		else if (horizontalAlign === "end") left = triggerRect.right - popupRect.width + alignOffset;
+		else left = triggerRect.left + (triggerRect.width - popupRect.width) / 2 + alignOffset;
+	} else if (align === "start") top = triggerRect.top + alignOffset;
 	else if (align === "end") top = triggerRect.bottom - popupRect.height + alignOffset;
 	else top = triggerRect.top + (triggerRect.height - popupRect.height) / 2 + alignOffset;
 	if (boundaryRect) {
@@ -2307,7 +2233,8 @@ var PopupPositioner = class {
 	#position() {
 		const options = this.#options;
 		if (!options?.position || !options.trigger || !options.popup) return;
-		const triggerRect = options.trigger.getBoundingClientRect();
+		const trigger = options.trigger;
+		const triggerRect = trigger.getBoundingClientRect();
 		const boundaryRect = getPositioningBoundaryRect(this.#boundaryElement);
 		const offsets = resolveOffsets(options.popup, options.cssVars);
 		const preferredPosition = options.position;
@@ -2316,7 +2243,8 @@ var PopupPositioner = class {
 			const side = getPositionedSide(triggerRect, popupRect, boundaryRect, preferredPosition, offsets);
 			const { positionAnchor: _, ...style } = getAnchorPositionStyle(options.anchorName, {
 				...preferredPosition,
-				side
+				side,
+				direction: isRTL(trigger) ? "rtl" : "ltr"
 			}, triggerRect, anchorSupported ? void 0 : popupRect, boundaryRect, offsets, options.cssVars);
 			return {
 				popupRect,
@@ -2396,10 +2324,9 @@ var PopupPositioner = class {
 //#endregion
 //#region ../core/dist/dev/dom/utils/pointer.js
 /** Convert a pointer event position to a 0–100 percent along an element's rect. */
-function getPercentFromPointerEvent(event, rect, orientation, isRTL) {
+function getPercentFromPointerEvent(event, rect, orientation) {
 	let ratio;
 	if (orientation === "vertical") ratio = 1 - (event.clientY - rect.top) / rect.height;
-	else if (isRTL) ratio = (rect.right - event.clientX) / rect.width;
 	else ratio = (event.clientX - rect.left) / rect.width;
 	if (!Number.isFinite(ratio)) return 0;
 	return clamp(ratio * 100, 0, 100);
@@ -2417,7 +2344,7 @@ function createSlider(options) {
 	});
 	const abort = new AbortController();
 	const changeThrottleMs = options.changeThrottle ?? 0;
-	let isDragging = false, cachedRTL = false, cachedRect = null, capturedPointerId = null, lastDragPercent = 0, committedOnRelease = false, pointingOnRelease = false;
+	let isDragging = false, cachedRect = null, capturedPointerId = null, lastDragPercent = 0, committedOnRelease = false, pointingOnRelease = false;
 	const throttledChange = changeThrottleMs > 0 ? throttle((percent) => options.onValueChange?.(percent), changeThrottleMs, { leading: true }) : null;
 	/** Fire `onValueChange` — throttled during drag when `changeThrottle > 0`. */
 	function fireChange(percent, duringDrag) {
@@ -2458,13 +2385,12 @@ function createSlider(options) {
 			event.preventDefault();
 			const el = options.getElement();
 			cachedRect = el.getBoundingClientRect();
-			cachedRTL = options.isRTL();
 			committedOnRelease = false;
 			pointingOnRelease = false;
 			releaseCapture();
 			capturedPointerId = event.pointerId;
 			el.setPointerCapture(event.pointerId);
-			const percent = getPercentFromPointerEvent(event, cachedRect, options.getOrientation(), cachedRTL);
+			const percent = getPercentFromPointerEvent(event, cachedRect, options.getOrientation());
 			isDragging = true;
 			lastDragPercent = percent;
 			input.patch({
@@ -2487,7 +2413,7 @@ function createSlider(options) {
 					endDrag();
 					return;
 				}
-				const percent = getPercentFromPointerEvent(event, cachedRect, options.getOrientation(), cachedRTL);
+				const percent = getPercentFromPointerEvent(event, cachedRect, options.getOrientation());
 				lastDragPercent = percent;
 				input.patch({
 					dragPercent: percent,
@@ -2496,7 +2422,7 @@ function createSlider(options) {
 				fireChange(percent, true);
 				return;
 			}
-			const percent = getPercentFromPointerEvent(event, options.getElement().getBoundingClientRect(), options.getOrientation(), options.isRTL());
+			const percent = getPercentFromPointerEvent(event, options.getElement().getBoundingClientRect(), options.getOrientation());
 			input.patch({
 				pointing: true,
 				pointerPercent: percent
@@ -2506,7 +2432,7 @@ function createSlider(options) {
 			if (options.isDisabled()) return;
 			event.stopPropagation();
 			if (isNull(capturedPointerId)) return;
-			const percent = getPercentFromPointerEvent(event, cachedRect, options.getOrientation(), cachedRTL);
+			const percent = getPercentFromPointerEvent(event, cachedRect, options.getOrientation());
 			const releaseRect = options.getElement().getBoundingClientRect();
 			pointingOnRelease = event.pointerType !== "touch" && event.clientX >= releaseRect.left && event.clientX <= releaseRect.right && event.clientY >= releaseRect.top && event.clientY <= releaseRect.bottom;
 			throttledChange?.cancel();
@@ -2531,15 +2457,14 @@ function createSlider(options) {
 			const stepPercent = options.getStepPercent();
 			const largeStepPercent = options.getLargeStepPercent();
 			const rounded = roundToStep(options.getPercent(), stepPercent, 0);
-			const horizontalSign = options.isRTL() ? -1 : 1;
 			const step = event.shiftKey ? largeStepPercent : stepPercent;
 			let newPercent = null;
 			switch (event.key) {
 				case "ArrowRight":
-					newPercent = rounded + step * horizontalSign;
+					newPercent = rounded + step;
 					break;
 				case "ArrowLeft":
-					newPercent = rounded - step * horizontalSign;
+					newPercent = rounded - step;
 					break;
 				case "ArrowUp":
 					newPercent = rounded + step;
@@ -2793,6 +2718,7 @@ var ThumbnailCore = class {
 	}
 	getAttrs(_state) {
 		return {
+			dir: "ltr",
 			role: "img",
 			"aria-hidden": "true"
 		};
@@ -5614,13 +5540,6 @@ var MenuRadioGroupElement = class extends RadioGroupElement {
 	}
 };
-//#endregion
-//#region src/i18n/cache-key.ts
-/** Serialize text content and parameters so dynamic labels invalidate their caches. */
-function cacheKey(text, params) {
-	return JSON.stringify([text, params]);
-}
 //#endregion
 //#region src/ui/menu/menu-item-indicator-element.ts
 var MenuItemIndicatorElement = class extends MediaElement {
@@ -5651,79 +5570,6 @@ var MenuItemIndicatorElement = class extends MediaElement {
 	}
 };
-//#endregion
-//#region src/ui/radio-options/radio-options-controller.ts
-/** Renders normalized options into menu radio items and manages their interaction lifecycle. */
-var RadioOptionsController = class {
-	#host;
-	#config;
-	#contentKey = "";
-	#translator = null;
-	#disconnect = null;
-	constructor(host, config) {
-		this.#host = host;
-		this.#config = config;
-		host.addController(this);
-	}
-	hostConnected() {
-		this.#disconnect = new AbortController();
-		this.#host.addEventListener("value-change", this.#handleValueChange, { signal: this.#disconnect.signal });
-	}
-	hostDisconnected() {
-		this.#disconnect?.abort();
-		this.#disconnect = null;
-	}
-	hostDestroyed() {
-		this.hostDisconnected();
-	}
-	sync(state, translator, locale) {
-		this.#host.value = state.value;
-		applyElementProps(this.#host, {
-			"aria-disabled": state.disabled ? "true" : void 0,
-			hidden: state.hidden ? "" : void 0
-		});
-		const template = getTemplateElement(this.#host);
-		const templateRoot = template ? getTemplateRoot(template) : null;
-		const itemRoot = templateRoot?.localName === MenuRadioItemElement.tagName ? templateRoot : null;
-		const contentKey = `${state.options.map((option) => `${option.value}:${cacheKey(option.label, option.labelParams)}:${this.#config.getOptionCacheKey?.(option) ?? ""}`).join("|")}::${locale}::${template?.innerHTML ?? ""}`;
-		if (contentKey !== this.#contentKey || translator !== this.#translator) {
-			this.#contentKey = contentKey;
-			this.#translator = translator;
-			for (const child of [...this.#host.children]) {
-				if (child === template) continue;
-				child.remove();
-			}
-			const items = state.options.map((option) => {
-				const item = itemRoot ? cloneTemplateRoot(itemRoot, this.#host.ownerDocument) : this.#host.ownerDocument.createElement(MenuRadioItemElement.tagName);
-				item.value = option.value;
-				this.#config.setItemAttributes?.(item, option);
-				const label = translateText(option.label, translator, option.labelParams);
-				if (this.#config.renderItem) this.#config.renderItem(item, label, option);
-				else this.#setItemLabel(item, label);
-				return item;
-			});
-			this.#host.append(...items);
-		}
-		const optionsByValue = new Map(state.options.map((option) => [option.value, option]));
-		for (const item of this.#host.querySelectorAll(MenuRadioItemElement.tagName)) {
-			const checked = item.value === state.value;
-			const option = optionsByValue.get(item.value);
-			item.disabled = state.disabled || option?.disabled === true;
-			for (const indicator of item.querySelectorAll(MenuItemIndicatorElement.tagName)) indicator.checked = checked;
-		}
-	}
-	#handleValueChange = (event) => {
-		if (event.target !== this.#host) return;
-		const { value } = event.detail;
-		this.#config.onValueChange(value);
-	};
-	#setItemLabel(item, label) {
-		const labelPart = item.querySelector("[data-part~=\"label\"]");
-		if (labelPart) labelPart.textContent = label;
-		else item.textContent = label;
-	}
-};
 //#endregion
 //#region src/ui/buffering-indicator/buffering-indicator-element.ts
 var BufferingIndicatorElement = class extends MediaElement {
@@ -7853,7 +7699,6 @@ var TimeSliderElement = class extends MediaElement {
 			getElement: () => this,
 			getThumbElement: () => this.querySelector("media-slider-thumb"),
 			getOrientation: () => this.orientation,
-			isRTL: () => isRTL(this),
 			isDisabled: () => this.disabled || !this.#timeState.value,
 			getPercent: () => {
 				const media = this.#timeState.value;
@@ -8370,7 +8215,6 @@ var VolumeSliderElement = class extends MediaElement {
 			getElement: () => this,
 			getThumbElement: () => this.querySelector("media-slider-thumb"),
 			getOrientation: () => this.orientation,
-			isRTL: () => isRTL(this),
 			isDisabled,
 			getPercent,
 			getStepPercent,
@@ -8522,5 +8366,5 @@ function defineSliders() {
 }
 //#endregion
-export { createTemplate as $, selectAudioTrack as A, selectTextTrack as B, applyStateDataAttrs as C, toPercent as D, findLastIndexAtOrBefore as E, selectPiP as F, captionsText as G, audioText as H, selectPlayback as I, qualityText as J, offText as K, selectPlaybackRate as L, selectFullscreen as M, selectLive as N, createButton as O, selectMetadata as P, cloneTemplateRoot as Q, selectQuality as R, resolveLabel as S, applyElementProps as T, autoText as U, selectTime as V, autoWithLabelText as W, speedText as X, settingsText as Y, subtitlesText as Z, MenuRadioGroupElement as _, defineSliders as a, enterText as b, defineTooltip as c, PopoverElement as d, getTemplateElement as et, PlayButtonElement as f, RadioOptionsController as g, BufferingIndicatorElement as h, defineMenu as i, defaults as it, selectBuffer as j, MEDIA_INPUT_ACTION_OVERRIDES as k, defineVolumeSlider as l, HotkeyElement as m, defineErrorDialog as n, renderTemplate as nt, defineTime as o, MuteButtonElement as p, playbackRateText as q, defineInputIndicators as r, walkAncestors as rt, defineTimeSlider as s, defineControls as t, getTemplateRoot as tt, sliderContext as u, MediaButtonElement as v, logMissingFeature as w, exitText as x, rateText as y, selectRemotePlayback as z };
-//# sourceMappingURL=compounds-D1FPw7jg.js.map
+export { MEDIA_INPUT_ACTION_OVERRIDES as A, selectRemotePlayback as B, resolveLabel as C, findLastIndexAtOrBefore as D, applyElementProps as E, selectMetadata as F, selectTime as H, selectPiP as I, selectPlayback as L, selectBuffer as M, selectFullscreen as N, toPercent as O, selectLive as P, selectPlaybackRate as R, exitText as S, logMissingFeature as T, walkAncestors as U, selectTextTrack as V, defaults as W, MenuRadioGroupElement as _, defineSliders as a, rateText as b, defineTooltip as c, PopoverElement as d, PlayButtonElement as f, MenuItemIndicatorElement as g, BufferingIndicatorElement as h, defineMenu as i, selectAudioTrack as j, createButton as k, defineVolumeSlider as l, HotkeyElement as m, defineErrorDialog as n, defineTime as o, MuteButtonElement as p, defineInputIndicators as r, defineTimeSlider as s, defineControls as t, sliderContext as u, MenuRadioItemElement as v, applyStateDataAttrs as w, enterText as x, MediaButtonElement as y, selectQuality as z };
+//# sourceMappingURL=compounds-BA8gXlmJ.js.map