@videojs/html 10.2.0 → 10.4.0

package/dist/dev/internal/skins/scaffold-video/template.js.map

@@ -1 +1 @@
-{"version":3,"file":"template.js","names":[],"sources":["../../../../../src/internal/skins/scaffold-video/template.ts"],"sourcesContent":["import { createTemplate } from '@videojs/utils/dom';\n\n/** Static template rendered from the finalized VJSC module graph. */\nexport const template =\n  createTemplate(/* html */ `<media-container class=\"media-skin media-container media-video\" data-theme=\"scaffold\" data-preset=\"video\">\n<slot>\n</slot>\n<media-poster class=\"media-poster\">\n<slot name=\"poster\">\n<img alt=\"\" decoding=\"async\" class=\"media-poster-image\">\n</slot>\n</media-poster>\n<media-error-dialog>\n<media-dialog-backdrop class=\"media-dialog-backdrop\">\n</media-dialog-backdrop>\n<media-dialog-popup class=\"media-dialog-popup\">\n<media-dialog-title class=\"media-dialog-title\">\n</media-dialog-title>\n<media-dialog-description class=\"media-dialog-description\">\n</media-dialog-description>\n<media-dialog-close class=\"media-button media-dialog-close\">\n</media-dialog-close>\n</media-dialog-popup>\n</media-error-dialog>\n<media-controls>\n<media-controls-backdrop class=\"video-controls-backdrop\">\n</media-controls-backdrop>\n<media-controls-group class=\"media-buffering-indicator-controls\">\n<media-buffering-indicator class=\"media-buffering-indicator media-buffering-indicator-backdrop\">\n<media-icon family=\"scaffold\" name=\"spinner\" class=\"media-buffering-indicator-spinner-icon\">\n</media-icon>\n</media-buffering-indicator>\n</media-controls-group>\n<media-controls-content class=\"video-controls-content\">\n<media-tooltip-group>\n<media-controls-group class=\"video-controls-top\">\n<media-title class=\"media-title\">\n</media-title>\n<media-airplay-button class=\"media-button media-airplay-button\" id=\"vjs-HNl1fwKe-0-trigger\">\n<media-icon family=\"scaffold\" name=\"airplay-enter\" class=\"media-button-icon media-airplay-button-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"airplay-exit\" class=\"media-button-icon media-airplay-button-exit-icon\">\n</media-icon>\n</media-airplay-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup media-tooltip-screen-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-cast-button class=\"media-button media-cast-button\" id=\"vjs-HNl1fwKe-0-2-trigger\">\n<media-icon family=\"scaffold\" name=\"cast-enter\" class=\"media-button-icon media-cast-button-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"cast-exit\" class=\"media-button-icon media-cast-button-exit-icon\">\n</media-icon>\n</media-cast-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-2-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup media-tooltip-screen-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-pip-button class=\"media-button media-pip-button\" id=\"vjs-HNl1fwKe-0-3-trigger\">\n<media-icon family=\"scaffold\" name=\"pip-enter\" class=\"media-button-icon media-pip-button-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"pip-exit\" class=\"media-button-icon media-pip-button-exit-icon\">\n</media-icon>\n</media-pip-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-3-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup media-tooltip-screen-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-fullscreen-button class=\"media-button media-fullscreen-button\" id=\"vjs-HNl1fwKe-0-4-trigger\">\n<media-icon family=\"scaffold\" name=\"fullscreen-enter\" class=\"media-button-icon media-fullscreen-button-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"fullscreen-exit\" class=\"media-button-icon media-fullscreen-button-exit-icon\">\n</media-icon>\n</media-fullscreen-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-4-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup media-tooltip-screen-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n</media-controls-group>\n<media-buffering-indicator class=\"video-controls-buffering\">\n<media-controls-group class=\"video-controls-center\">\n<media-seek-button seconds=\"-10\" class=\"media-button video-controls-center-button video-controls-center-seek\" id=\"vjs-HNl1fwKe-0-5-trigger\">\n<div class=\"media-seek-button-content\">\n<media-icon family=\"scaffold\" name=\"seek\" class=\"media-button-icon media-seek-button-backward-icon video-controls-center-seek-icon\">\n</media-icon>\n<span class=\"media-seek-button-label media-seek-button-backward-label\">10</span>\n</div>\n</media-seek-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-5-trigger\" disabled side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-play-button class=\"media-button media-play-button video-controls-center-button video-controls-center-play\" id=\"vjs-HNl1fwKe-0-6-trigger\">\n<media-icon family=\"scaffold\" name=\"restart\" class=\"media-button-icon-base media-play-button-restart-icon video-controls-center-play-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"play\" class=\"media-button-icon-base media-play-button-play-icon video-controls-center-play-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"pause\" class=\"media-button-icon-base media-play-button-pause-icon video-controls-center-play-icon\">\n</media-icon>\n</media-play-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-6-trigger\" disabled side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-seek-button seconds=\"10\" class=\"media-button video-controls-center-button video-controls-center-seek\" id=\"vjs-HNl1fwKe-0-7-trigger\">\n<div class=\"media-seek-button-content\">\n<media-icon family=\"scaffold\" name=\"seek\" class=\"media-button-icon video-controls-center-seek-icon\">\n</media-icon>\n<span class=\"media-seek-button-label media-seek-button-forward-label\">10</span>\n</div>\n</media-seek-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-7-trigger\" disabled side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n</media-controls-group>\n</media-buffering-indicator>\n<div class=\"video-controls-bottom video-controls-video-bottom\">\n<div class=\"video-controls-slider-row\">\n<media-time-slider class=\"media-time-slider\" thumb-alignment=\"edge\">\n<media-time-slider-chapters class=\"media-time-slider-chapters\">\n<template>\n<div class=\"media-time-slider-chapter\">\n<media-slider-track class=\"media-time-slider-track\">\n<media-slider-buffer class=\"media-time-slider-buffer\">\n</media-slider-buffer>\n<media-slider-fill class=\"media-time-slider-fill\">\n</media-slider-fill>\n</media-slider-track>\n</div>\n</template>\n</media-time-slider-chapters>\n<media-slider-thumb class=\"media-time-slider-thumb\">\n</media-slider-thumb>\n<media-slider-preview class=\"media-time-slider-preview\">\n<media-slider-thumbnail class=\"media-slider-thumbnail\">\n<img alt=\"\" aria-hidden=\"true\" decoding=\"async\" class=\"media-slider-thumbnail-image\">\n</media-slider-thumbnail>\n<div class=\"media-time-slider-preview-meta\">\n<div class=\"media-time-slider-preview-label\">\n<media-slider-value class=\"media-time-slider-value\" type=\"pointer\">\n</media-slider-value>\n<media-time-slider-chapter-title class=\"media-time-slider-chapter-title\">\n</media-time-slider-chapter-title>\n</div>\n</div>\n</media-slider-preview>\n</media-time-slider>\n</div>\n<media-controls-group class=\"video-controls-row\">\n<media-controls-group class=\"video-controls-group video-controls-start\">\n<media-play-button class=\"media-button media-play-button\" id=\"vjs-HNl1fwKe-0-8-trigger\">\n<media-icon family=\"scaffold\" name=\"restart\" class=\"media-button-icon-base media-play-button-restart-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"play\" class=\"media-button-icon-base media-play-button-play-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"pause\" class=\"media-button-icon-base media-play-button-pause-icon\">\n</media-icon>\n</media-play-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-8-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-mute-button commandfor=\"vjs-a5-df5XX-0-popup\" class=\"media-button media-mute-button\" id=\"vjs-HNl1fwKe-0-9-trigger\">\n<media-icon family=\"scaffold\" name=\"volume-off\" class=\"media-button-icon media-mute-button-off-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"volume-high\" class=\"media-button-icon media-mute-button-high-icon\">\n</media-icon>\n</media-mute-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-9-trigger\" delay=\"0\" disabled side=\"top\" sticky class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-volume-popover open-on-hover delay=\"200\" close-delay=\"100\" side=\"top\" class=\"media-popup media-popup-safe-area media-volume-popover-popup\" id=\"vjs-a5-df5XX-0-popup\">\n<media-volume-slider class=\"media-volume-slider\" orientation=\"vertical\" thumb-alignment=\"edge\">\n<media-slider-track class=\"media-volume-slider-track\">\n<media-slider-fill class=\"media-volume-slider-fill\">\n</media-slider-fill>\n</media-slider-track>\n<media-slider-thumb class=\"media-volume-slider-thumb\">\n</media-slider-thumb>\n</media-volume-slider>\n</media-volume-popover>\n<media-time-group class=\"media-time-group\">\n<media-time class=\"media-time-toggle\" type=\"current\" toggle>\n</media-time>\n<media-time class=\"media-time-current-value\" type=\"current\">\n</media-time>\n<media-time-separator class=\"media-time-separator\">\n</media-time-separator>\n<media-time class=\"media-time-duration-value\" type=\"duration\">\n</media-time>\n</media-time-group>\n</media-controls-group>\n<media-controls-group class=\"video-controls-group\">\n<media-captions-button class=\"media-button media-captions-button\" id=\"vjs-HNl1fwKe-0-10-trigger\">\n<media-icon family=\"scaffold\" name=\"captions-off\" class=\"media-button-icon media-captions-button-off-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"captions-on\" class=\"media-button-icon media-captions-button-on-icon\">\n</media-icon>\n</media-captions-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-10-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<button commandfor=\"vjs-dexOLs_f-h-popup\" class=\"media-button\" id=\"vjs-HNl1fwKe-0-11-trigger\">\n<media-icon family=\"scaffold\" name=\"gear\" class=\"media-button-icon\">\n</media-icon>\n<media-text class=\"media-settings-button-label\" token=\"menu.settings\">Settings</media-text>\n</button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-11-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-text token=\"menu.settings\">Settings</media-text>\n</media-tooltip>\n<media-menu side=\"top\" align=\"center\" class=\"media-popup media-popup-safe-area media-menu-popup\" id=\"vjs-dexOLs_f-h-popup\">\n<media-menu-content class=\"media-menu-content\">\n<media-menu-item commandfor=\"vjs-dexOLs_f-1-content\" class=\"media-menu-item\">\n<media-icon family=\"scaffold\" name=\"switches\" class=\"media-menu-trigger-icon\">\n</media-icon>\n<media-text token=\"menu.quality\">Quality</media-text>\n<span class=\"media-menu-hint\">\n<span data-part=\"value\" class=\"media-menu-hint-label\">\n</span>\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-forward-chevron\">\n</media-icon>\n</span>\n</media-menu-item>\n<media-menu-content class=\"media-menu-content\" id=\"vjs-dexOLs_f-1-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-back-chevron\">\n</media-icon>\n<media-text token=\"menu.quality\">Quality</media-text>\n</media-menu-item>\n<media-menu-separator class=\"media-menu-separator\">\n</media-menu-separator>\n<media-quality-radio-group class=\"media-menu-radio-group\">\n<template>\n<media-menu-radio-item class=\"media-menu-radio-item\">\n<span>\n<span data-part=\"label\">\n</span>\n<sup data-part=\"tier\" class=\"media-menu-tier\">\n</sup>\n</span>\n<span data-part=\"badge\" class=\"media-menu-badge\">\n</span>\n<media-menu-item-indicator force-mount class=\"media-menu-indicator\">\n<media-icon family=\"scaffold\" name=\"check\" class=\"media-menu-radio-icon\">\n</media-icon>\n</media-menu-item-indicator>\n</media-menu-radio-item>\n</template>\n</media-quality-radio-group>\n</media-menu-content>\n<media-menu-item commandfor=\"vjs-dexOLs_f-5-content\" class=\"media-menu-item\">\n<media-icon family=\"scaffold\" name=\"speech\" class=\"media-menu-trigger-icon\">\n</media-icon>\n<media-text token=\"menu.audio\">Audio</media-text>\n<span class=\"media-menu-hint\">\n<span data-part=\"value\" class=\"media-menu-hint-label\">\n</span>\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-forward-chevron\">\n</media-icon>\n</span>\n</media-menu-item>\n<media-menu-content class=\"media-menu-content\" id=\"vjs-dexOLs_f-5-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-back-chevron\">\n</media-icon>\n<media-text token=\"menu.audio\">Audio</media-text>\n</media-menu-item>\n<media-menu-separator class=\"media-menu-separator\">\n</media-menu-separator>\n<media-audio-track-radio-group class=\"media-menu-radio-group\">\n<template>\n<media-menu-radio-item class=\"media-menu-radio-item\">\n<span data-part=\"label\">\n</span>\n<media-menu-item-indicator force-mount class=\"media-menu-indicator\">\n<media-icon family=\"scaffold\" name=\"check\" class=\"media-menu-radio-icon\">\n</media-icon>\n</media-menu-item-indicator>\n</media-menu-radio-item>\n</template>\n</media-audio-track-radio-group>\n</media-menu-content>\n<media-menu-item commandfor=\"vjs-dexOLs_f-9-content\" class=\"media-menu-item\">\n<media-icon family=\"scaffold\" name=\"speed\" class=\"media-menu-trigger-icon\">\n</media-icon>\n<media-text token=\"menu.speed\">Speed</media-text>\n<span class=\"media-menu-hint\">\n<span data-part=\"value\" class=\"media-menu-hint-label\">\n</span>\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-forward-chevron\">\n</media-icon>\n</span>\n</media-menu-item>\n<media-menu-content class=\"media-menu-content\" id=\"vjs-dexOLs_f-9-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-back-chevron\">\n</media-icon>\n<media-text token=\"menu.speed\">Speed</media-text>\n</media-menu-item>\n<media-menu-separator class=\"media-menu-separator\">\n</media-menu-separator>\n<media-playback-rate-radio-group class=\"media-menu-radio-group\">\n<template>\n<media-menu-radio-item class=\"media-menu-radio-item\">\n<span data-part=\"label\">\n</span>\n<media-menu-item-indicator force-mount class=\"media-menu-indicator\">\n<media-icon family=\"scaffold\" name=\"check\" class=\"media-menu-radio-icon\">\n</media-icon>\n</media-menu-item-indicator>\n</media-menu-radio-item>\n</template>\n</media-playback-rate-radio-group>\n</media-menu-content>\n<media-menu-item commandfor=\"vjs-dexOLs_f-d-content\" class=\"media-menu-item\">\n<media-icon family=\"scaffold\" name=\"captions-off\" class=\"media-menu-trigger-icon\">\n</media-icon>\n<media-text token=\"menu.captions\">Captions</media-text>\n<span class=\"media-menu-hint\">\n<span data-part=\"value\" class=\"media-menu-hint-label\">\n</span>\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-forward-chevron\">\n</media-icon>\n</span>\n</media-menu-item>\n<media-menu-content class=\"media-menu-content\" id=\"vjs-dexOLs_f-d-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-back-chevron\">\n</media-icon>\n<media-text token=\"menu.captions\">Captions</media-text>\n</media-menu-item>\n<media-menu-separator class=\"media-menu-separator\">\n</media-menu-separator>\n<media-captions-radio-group class=\"media-menu-radio-group\">\n<template>\n<media-menu-radio-item class=\"media-menu-radio-item\">\n<span data-part=\"label\">\n</span>\n<media-menu-item-indicator force-mount class=\"media-menu-indicator\">\n<media-icon family=\"scaffold\" name=\"check\" class=\"media-menu-radio-icon\">\n</media-icon>\n</media-menu-item-indicator>\n</media-menu-radio-item>\n</template>\n</media-captions-radio-group>\n</media-menu-content>\n</media-menu-content>\n</media-menu>\n</media-controls-group>\n</media-controls-group>\n</div>\n</media-tooltip-group>\n</media-controls-content>\n</media-controls>\n<media-hotkey keys=\"Space\" action=\"togglePaused\">\n</media-hotkey>\n<media-hotkey keys=\"k\" action=\"togglePaused\">\n</media-hotkey>\n<media-hotkey keys=\"m\" action=\"toggleMuted\">\n</media-hotkey>\n<media-hotkey keys=\"ArrowRight\" action=\"seekStep\">\n</media-hotkey>\n<media-hotkey keys=\"ArrowLeft\" action=\"seekStep\">\n</media-hotkey>\n<media-hotkey keys=\"l\" action=\"seekStep\">\n</media-hotkey>\n<media-hotkey keys=\"j\" action=\"seekStep\">\n</media-hotkey>\n<media-hotkey keys=\"ArrowUp\" action=\"volumeStep\">\n</media-hotkey>\n<media-hotkey keys=\"ArrowDown\" action=\"volumeStep\">\n</media-hotkey>\n<media-hotkey keys=\"0-9\" action=\"seekToPercent\">\n</media-hotkey>\n<media-hotkey keys=\"Home\" action=\"seekToPercent\" value=\"0\">\n</media-hotkey>\n<media-hotkey keys=\"End\" action=\"seekToPercent\" value=\"100\">\n</media-hotkey>\n<media-hotkey keys=\"&gt;\" action=\"speedUp\">\n</media-hotkey>\n<media-hotkey keys=\"&lt;\" action=\"speedDown\">\n</media-hotkey>\n<media-hotkey keys=\"f\" action=\"toggleFullscreen\">\n</media-hotkey>\n<media-hotkey keys=\"c\" action=\"toggleSubtitles\">\n</media-hotkey>\n<media-hotkey keys=\"i\" action=\"togglePictureInPicture\">\n</media-hotkey>\n<media-gesture type=\"tap\" action=\"togglePaused\" pointer=\"mouse\" region=\"center\">\n</media-gesture>\n<media-gesture type=\"tap\" action=\"toggleControls\" pointer=\"touch\">\n</media-gesture>\n<media-gesture type=\"doubletap\" action=\"seekStep\" region=\"left\">\n</media-gesture>\n<media-gesture type=\"doubletap\" action=\"toggleFullscreen\" region=\"center\">\n</media-gesture>\n<media-gesture type=\"doubletap\" action=\"seekStep\" region=\"right\">\n</media-gesture>\n<media-status-announcer class=\"media-status-announcer\">\n</media-status-announcer>\n<div aria-hidden=\"true\" class=\"media-indicator-group\">\n<media-volume-indicator class=\"media-indicator media-volume-indicator\">\n<media-volume-indicator-fill class=\"media-volume-indicator-fill\">\n<media-icon family=\"scaffold\" name=\"volume-high\" class=\"media-volume-indicator-icon media-volume-indicator-high-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"volume-low\" class=\"media-volume-indicator-icon media-volume-indicator-low-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"volume-off\" class=\"media-volume-indicator-icon media-volume-indicator-off-icon\">\n</media-icon>\n<media-volume-indicator-value class=\"media-volume-indicator-value\">\n</media-volume-indicator-value>\n</media-volume-indicator-fill>\n</media-volume-indicator>\n<media-status-indicator actions=\"toggleSubtitles,toggleFullscreen,togglePictureInPicture\" class=\"media-indicator media-status-indicator\">\n<media-icon family=\"scaffold\" name=\"captions-on\" class=\"media-status-indicator-icon media-status-indicator-captions-on-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"captions-off\" class=\"media-status-indicator-icon media-status-indicator-captions-off-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"fullscreen-enter\" class=\"media-status-indicator-icon media-status-indicator-fullscreen-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"fullscreen-exit\" class=\"media-status-indicator-icon media-status-indicator-fullscreen-exit-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"pip-enter\" class=\"media-status-indicator-icon media-status-indicator-pip-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"pip-exit\" class=\"media-status-indicator-icon media-status-indicator-pip-exit-icon\">\n</media-icon>\n<media-status-indicator-value>\n</media-status-indicator-value>\n</media-status-indicator>\n<media-seek-indicator class=\"media-indicator media-seek-indicator\">\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-seek-indicator-icon\">\n</media-icon>\n<media-seek-indicator-value class=\"media-seek-indicator-value\">\n</media-seek-indicator-value>\n</media-seek-indicator>\n</div>\n</media-container>`);\n"],"mappings":";;;AAGA,MAAa,WACX,eAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBAucT"}
+{"version":3,"file":"template.js","names":[],"sources":["../../../../../src/internal/skins/scaffold-video/template.ts"],"sourcesContent":["import { createTemplate } from '@videojs/utils/dom';\n\n/** Static template rendered from the finalized VJSC module graph. */\nexport const template =\n  createTemplate(/* html */ `<media-container class=\"media-skin media-container media-video\" data-theme=\"scaffold\" data-preset=\"video\">\n<slot>\n</slot>\n<media-poster class=\"media-poster\">\n<slot name=\"poster\">\n<img alt=\"\" decoding=\"async\" class=\"media-poster-image\">\n</slot>\n</media-poster>\n<media-error-dialog>\n<media-dialog-backdrop class=\"media-dialog-backdrop\">\n</media-dialog-backdrop>\n<media-dialog-popup class=\"media-dialog-popup\">\n<media-dialog-title class=\"media-dialog-title\">\n</media-dialog-title>\n<media-dialog-description class=\"media-dialog-description\">\n</media-dialog-description>\n<media-dialog-close class=\"media-button media-dialog-close\">\n</media-dialog-close>\n</media-dialog-popup>\n</media-error-dialog>\n<media-controls>\n<media-controls-backdrop class=\"video-controls-backdrop\">\n</media-controls-backdrop>\n<media-controls-group class=\"media-buffering-indicator-controls\">\n<media-buffering-indicator class=\"media-buffering-indicator media-buffering-indicator-backdrop\">\n<media-icon family=\"scaffold\" name=\"spinner\" class=\"media-buffering-indicator-spinner-icon\">\n</media-icon>\n</media-buffering-indicator>\n</media-controls-group>\n<media-controls-content class=\"video-controls-content\">\n<media-tooltip-group>\n<media-controls-group class=\"video-controls-top\">\n<media-title class=\"media-title\">\n</media-title>\n<media-airplay-button class=\"media-button media-airplay-button\" id=\"vjs-HNl1fwKe-0-trigger\">\n<media-icon family=\"scaffold\" name=\"airplay-enter\" class=\"media-button-icon media-airplay-button-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"airplay-exit\" class=\"media-button-icon media-airplay-button-exit-icon\">\n</media-icon>\n</media-airplay-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup media-tooltip-screen-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-cast-button class=\"media-button media-cast-button\" id=\"vjs-HNl1fwKe-0-2-trigger\">\n<media-icon family=\"scaffold\" name=\"cast-enter\" class=\"media-button-icon media-cast-button-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"cast-exit\" class=\"media-button-icon media-cast-button-exit-icon\">\n</media-icon>\n</media-cast-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-2-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup media-tooltip-screen-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-pip-button class=\"media-button media-pip-button\" id=\"vjs-HNl1fwKe-0-3-trigger\">\n<media-icon family=\"scaffold\" name=\"pip-enter\" class=\"media-button-icon media-pip-button-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"pip-exit\" class=\"media-button-icon media-pip-button-exit-icon\">\n</media-icon>\n</media-pip-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-3-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup media-tooltip-screen-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-fullscreen-button class=\"media-button media-fullscreen-button\" id=\"vjs-HNl1fwKe-0-4-trigger\">\n<media-icon family=\"scaffold\" name=\"fullscreen-enter\" class=\"media-button-icon media-fullscreen-button-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"fullscreen-exit\" class=\"media-button-icon media-fullscreen-button-exit-icon\">\n</media-icon>\n</media-fullscreen-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-4-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup media-tooltip-screen-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n</media-controls-group>\n<media-buffering-indicator class=\"video-controls-buffering\">\n<media-controls-group class=\"video-controls-center\">\n<media-seek-button seconds=\"-10\" class=\"media-button video-controls-center-button video-controls-center-seek\" id=\"vjs-HNl1fwKe-0-5-trigger\">\n<div class=\"media-seek-button-content\">\n<media-icon family=\"scaffold\" name=\"seek\" class=\"media-button-icon media-seek-button-backward-icon video-controls-center-seek-icon\">\n</media-icon>\n<span class=\"media-seek-button-label media-seek-button-backward-label\">10</span>\n</div>\n</media-seek-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-5-trigger\" disabled side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-play-button class=\"media-button media-play-button video-controls-center-button video-controls-center-play\" id=\"vjs-HNl1fwKe-0-6-trigger\">\n<media-icon family=\"scaffold\" name=\"restart\" class=\"media-button-icon-base media-play-button-restart-icon video-controls-center-play-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"play\" class=\"media-button-icon-base media-play-button-play-icon video-controls-center-play-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"pause\" class=\"media-button-icon-base media-play-button-pause-icon video-controls-center-play-icon\">\n</media-icon>\n</media-play-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-6-trigger\" disabled side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-seek-button seconds=\"10\" class=\"media-button video-controls-center-button video-controls-center-seek\" id=\"vjs-HNl1fwKe-0-7-trigger\">\n<div class=\"media-seek-button-content\">\n<media-icon family=\"scaffold\" name=\"seek\" class=\"media-button-icon video-controls-center-seek-icon\">\n</media-icon>\n<span class=\"media-seek-button-label media-seek-button-forward-label\">10</span>\n</div>\n</media-seek-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-7-trigger\" disabled side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n</media-controls-group>\n</media-buffering-indicator>\n<div class=\"video-controls-bottom video-controls-video-bottom\">\n<div class=\"video-controls-slider-row\">\n<media-time-slider class=\"media-time-slider\" thumb-alignment=\"edge\">\n<media-time-slider-chapters class=\"media-time-slider-chapters\">\n<template>\n<div class=\"media-time-slider-chapter\">\n<media-slider-track class=\"media-time-slider-track\">\n<media-slider-buffer class=\"media-time-slider-buffer\">\n</media-slider-buffer>\n<media-slider-fill class=\"media-time-slider-fill\">\n</media-slider-fill>\n</media-slider-track>\n</div>\n</template>\n</media-time-slider-chapters>\n<media-slider-thumb class=\"media-time-slider-thumb\">\n</media-slider-thumb>\n<media-slider-preview class=\"media-time-slider-preview\">\n<media-slider-thumbnail class=\"media-slider-thumbnail\">\n<img alt=\"\" aria-hidden=\"true\" decoding=\"async\" class=\"media-slider-thumbnail-image\">\n</media-slider-thumbnail>\n<div class=\"media-time-slider-preview-meta\">\n<div class=\"media-time-slider-preview-label\">\n<media-slider-value class=\"media-time-slider-value\" type=\"pointer\">\n</media-slider-value>\n<media-time-slider-chapter-title class=\"media-time-slider-chapter-title\">\n</media-time-slider-chapter-title>\n</div>\n</div>\n</media-slider-preview>\n</media-time-slider>\n</div>\n<media-controls-group class=\"video-controls-row\">\n<media-controls-group class=\"video-controls-group video-controls-start\">\n<media-play-button class=\"media-button media-play-button\" id=\"vjs-HNl1fwKe-0-8-trigger\">\n<media-icon family=\"scaffold\" name=\"restart\" class=\"media-button-icon-base media-play-button-restart-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"play\" class=\"media-button-icon-base media-play-button-play-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"pause\" class=\"media-button-icon-base media-play-button-pause-icon\">\n</media-icon>\n</media-play-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-8-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-mute-button commandfor=\"vjs-a5-df5XX-0-popup\" class=\"media-button media-mute-button\" id=\"vjs-HNl1fwKe-0-9-trigger\">\n<media-icon family=\"scaffold\" name=\"volume-off\" class=\"media-button-icon media-mute-button-off-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"volume-high\" class=\"media-button-icon media-mute-button-high-icon\">\n</media-icon>\n</media-mute-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-9-trigger\" delay=\"0\" disabled side=\"top\" sticky class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<media-volume-popover open-on-hover delay=\"200\" close-delay=\"100\" side=\"top\" class=\"media-popup media-popup-safe-area media-volume-popover-popup\" id=\"vjs-a5-df5XX-0-popup\">\n<media-volume-slider class=\"media-volume-slider\" orientation=\"vertical\" thumb-alignment=\"edge\">\n<media-slider-track class=\"media-volume-slider-track\">\n<media-slider-fill class=\"media-volume-slider-fill\">\n</media-slider-fill>\n</media-slider-track>\n<media-slider-thumb class=\"media-volume-slider-thumb\">\n</media-slider-thumb>\n</media-volume-slider>\n</media-volume-popover>\n<media-time-group class=\"media-time-group\">\n<media-time class=\"media-time-toggle\" type=\"current\" toggle>\n</media-time>\n<media-time class=\"media-time-current-value\" type=\"current\">\n</media-time>\n<media-time-separator class=\"media-time-separator\">\n</media-time-separator>\n<media-time class=\"media-time-duration-value\" type=\"duration\">\n</media-time>\n</media-time-group>\n</media-controls-group>\n<media-controls-group class=\"video-controls-group\">\n<media-captions-button class=\"media-button media-captions-button\" id=\"vjs-HNl1fwKe-0-10-trigger\">\n<media-icon family=\"scaffold\" name=\"captions-off\" class=\"media-button-icon media-captions-button-off-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"captions-on\" class=\"media-button-icon media-captions-button-on-icon\">\n</media-icon>\n</media-captions-button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-10-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n<button commandfor=\"vjs-dexOLs_f-h-popup\" class=\"media-button media-settings-button\" id=\"vjs-HNl1fwKe-0-11-trigger\">\n<media-icon family=\"scaffold\" name=\"gear\" class=\"media-button-icon\">\n</media-icon>\n<media-text class=\"media-settings-button-label\" token=\"menu.settings\">Settings</media-text>\n</button>\n<media-tooltip trigger=\"vjs-HNl1fwKe-0-11-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-tooltip-popup\">\n<media-text token=\"menu.settings\">Settings</media-text>\n</media-tooltip>\n<media-menu side=\"top\" align=\"center\" class=\"media-popup media-popup-safe-area media-menu-popup\" id=\"vjs-dexOLs_f-h-popup\">\n<media-menu-content class=\"media-menu-content\">\n<media-menu-item commandfor=\"vjs-dexOLs_f-1-content\" class=\"media-menu-item\">\n<media-icon family=\"scaffold\" name=\"switches\" class=\"media-menu-trigger-icon\">\n</media-icon>\n<media-text token=\"menu.quality\">Quality</media-text>\n<span class=\"media-menu-hint\">\n<span data-part=\"value\" class=\"media-menu-hint-label\">\n</span>\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-forward-chevron\">\n</media-icon>\n</span>\n</media-menu-item>\n<media-menu-content class=\"media-menu-content\" id=\"vjs-dexOLs_f-1-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-back-chevron\">\n</media-icon>\n<media-text token=\"menu.quality\">Quality</media-text>\n</media-menu-item>\n<media-menu-separator class=\"media-menu-separator\">\n</media-menu-separator>\n<media-quality-radio-group class=\"media-menu-radio-group\">\n<template>\n<media-menu-radio-item class=\"media-menu-radio-item\">\n<span>\n<span data-part=\"label\">\n</span>\n<sup data-part=\"tier\" class=\"media-menu-tier\">\n</sup>\n</span>\n<span data-part=\"badge\" class=\"media-menu-badge\">\n</span>\n<media-menu-item-indicator force-mount class=\"media-menu-indicator\">\n<media-icon family=\"scaffold\" name=\"check\" class=\"media-menu-radio-icon\">\n</media-icon>\n</media-menu-item-indicator>\n</media-menu-radio-item>\n</template>\n</media-quality-radio-group>\n</media-menu-content>\n<media-menu-item commandfor=\"vjs-dexOLs_f-5-content\" class=\"media-menu-item\">\n<media-icon family=\"scaffold\" name=\"speech\" class=\"media-menu-trigger-icon\">\n</media-icon>\n<media-text token=\"menu.audio\">Audio</media-text>\n<span class=\"media-menu-hint\">\n<span data-part=\"value\" class=\"media-menu-hint-label\">\n</span>\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-forward-chevron\">\n</media-icon>\n</span>\n</media-menu-item>\n<media-menu-content class=\"media-menu-content\" id=\"vjs-dexOLs_f-5-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-back-chevron\">\n</media-icon>\n<media-text token=\"menu.audio\">Audio</media-text>\n</media-menu-item>\n<media-menu-separator class=\"media-menu-separator\">\n</media-menu-separator>\n<media-audio-track-radio-group class=\"media-menu-radio-group\">\n<template>\n<media-menu-radio-item class=\"media-menu-radio-item\">\n<span data-part=\"label\">\n</span>\n<media-menu-item-indicator force-mount class=\"media-menu-indicator\">\n<media-icon family=\"scaffold\" name=\"check\" class=\"media-menu-radio-icon\">\n</media-icon>\n</media-menu-item-indicator>\n</media-menu-radio-item>\n</template>\n</media-audio-track-radio-group>\n</media-menu-content>\n<media-menu-item commandfor=\"vjs-dexOLs_f-9-content\" class=\"media-menu-item\">\n<media-icon family=\"scaffold\" name=\"speed\" class=\"media-menu-trigger-icon\">\n</media-icon>\n<media-text token=\"menu.speed\">Speed</media-text>\n<span class=\"media-menu-hint\">\n<span data-part=\"value\" class=\"media-menu-hint-label\">\n</span>\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-forward-chevron\">\n</media-icon>\n</span>\n</media-menu-item>\n<media-menu-content class=\"media-menu-content\" id=\"vjs-dexOLs_f-9-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-back-chevron\">\n</media-icon>\n<media-text token=\"menu.speed\">Speed</media-text>\n</media-menu-item>\n<media-menu-separator class=\"media-menu-separator\">\n</media-menu-separator>\n<media-playback-rate-radio-group class=\"media-menu-radio-group\">\n<template>\n<media-menu-radio-item class=\"media-menu-radio-item\">\n<span data-part=\"label\">\n</span>\n<media-menu-item-indicator force-mount class=\"media-menu-indicator\">\n<media-icon family=\"scaffold\" name=\"check\" class=\"media-menu-radio-icon\">\n</media-icon>\n</media-menu-item-indicator>\n</media-menu-radio-item>\n</template>\n</media-playback-rate-radio-group>\n</media-menu-content>\n<media-menu-item commandfor=\"vjs-dexOLs_f-d-content\" class=\"media-menu-item\">\n<media-icon family=\"scaffold\" name=\"captions-off\" class=\"media-menu-trigger-icon\">\n</media-icon>\n<media-text token=\"menu.captions\">Captions</media-text>\n<span class=\"media-menu-hint\">\n<span data-part=\"value\" class=\"media-menu-hint-label\">\n</span>\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-forward-chevron\">\n</media-icon>\n</span>\n</media-menu-item>\n<media-menu-content class=\"media-menu-content\" id=\"vjs-dexOLs_f-d-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-menu-back-chevron\">\n</media-icon>\n<media-text token=\"menu.captions\">Captions</media-text>\n</media-menu-item>\n<media-menu-separator class=\"media-menu-separator\">\n</media-menu-separator>\n<media-captions-radio-group class=\"media-menu-radio-group\">\n<template>\n<media-menu-radio-item class=\"media-menu-radio-item\">\n<span data-part=\"label\">\n</span>\n<span data-part=\"badge\" class=\"media-menu-badge\">\n</span>\n<media-menu-item-indicator force-mount class=\"media-menu-indicator\">\n<media-icon family=\"scaffold\" name=\"check\" class=\"media-menu-radio-icon\">\n</media-icon>\n</media-menu-item-indicator>\n</media-menu-radio-item>\n</template>\n</media-captions-radio-group>\n</media-menu-content>\n</media-menu-content>\n</media-menu>\n</media-controls-group>\n</media-controls-group>\n</div>\n</media-tooltip-group>\n</media-controls-content>\n</media-controls>\n<media-hotkey keys=\"Space\" action=\"togglePaused\">\n</media-hotkey>\n<media-hotkey keys=\"k\" action=\"togglePaused\">\n</media-hotkey>\n<media-hotkey keys=\"m\" action=\"toggleMuted\">\n</media-hotkey>\n<media-hotkey keys=\"ArrowRight\" action=\"seekStep\">\n</media-hotkey>\n<media-hotkey keys=\"ArrowLeft\" action=\"seekStep\">\n</media-hotkey>\n<media-hotkey keys=\"l\" action=\"seekStep\">\n</media-hotkey>\n<media-hotkey keys=\"j\" action=\"seekStep\">\n</media-hotkey>\n<media-hotkey keys=\"ArrowUp\" action=\"volumeStep\">\n</media-hotkey>\n<media-hotkey keys=\"ArrowDown\" action=\"volumeStep\">\n</media-hotkey>\n<media-hotkey keys=\"0-9\" action=\"seekToPercent\">\n</media-hotkey>\n<media-hotkey keys=\"Home\" action=\"seekToPercent\" value=\"0\">\n</media-hotkey>\n<media-hotkey keys=\"End\" action=\"seekToPercent\" value=\"100\">\n</media-hotkey>\n<media-hotkey keys=\"&gt;\" action=\"speedUp\">\n</media-hotkey>\n<media-hotkey keys=\"&lt;\" action=\"speedDown\">\n</media-hotkey>\n<media-hotkey keys=\"f\" action=\"toggleFullscreen\">\n</media-hotkey>\n<media-hotkey keys=\"c\" action=\"toggleSubtitles\">\n</media-hotkey>\n<media-hotkey keys=\"i\" action=\"togglePictureInPicture\">\n</media-hotkey>\n<media-gesture type=\"tap\" action=\"togglePaused\" pointer=\"mouse\" region=\"center\">\n</media-gesture>\n<media-gesture type=\"tap\" action=\"toggleControls\" pointer=\"touch\">\n</media-gesture>\n<media-gesture type=\"doubletap\" action=\"seekStep\" region=\"left\">\n</media-gesture>\n<media-gesture type=\"doubletap\" action=\"toggleFullscreen\" region=\"center\">\n</media-gesture>\n<media-gesture type=\"doubletap\" action=\"seekStep\" region=\"right\">\n</media-gesture>\n<media-status-announcer class=\"media-status-announcer\">\n</media-status-announcer>\n<div aria-hidden=\"true\" class=\"media-indicator-group\">\n<media-volume-indicator class=\"media-indicator media-volume-indicator\">\n<media-volume-indicator-fill class=\"media-volume-indicator-fill\">\n<media-icon family=\"scaffold\" name=\"volume-high\" class=\"media-volume-indicator-icon media-volume-indicator-high-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"volume-low\" class=\"media-volume-indicator-icon media-volume-indicator-low-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"volume-off\" class=\"media-volume-indicator-icon media-volume-indicator-off-icon\">\n</media-icon>\n<media-volume-indicator-value class=\"media-volume-indicator-value\">\n</media-volume-indicator-value>\n</media-volume-indicator-fill>\n</media-volume-indicator>\n<media-status-indicator actions=\"toggleSubtitles,toggleFullscreen,togglePictureInPicture\" class=\"media-indicator media-status-indicator\">\n<media-icon family=\"scaffold\" name=\"captions-on\" class=\"media-status-indicator-icon media-status-indicator-captions-on-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"captions-off\" class=\"media-status-indicator-icon media-status-indicator-captions-off-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"fullscreen-enter\" class=\"media-status-indicator-icon media-status-indicator-fullscreen-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"fullscreen-exit\" class=\"media-status-indicator-icon media-status-indicator-fullscreen-exit-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"pip-enter\" class=\"media-status-indicator-icon media-status-indicator-pip-enter-icon\">\n</media-icon>\n<media-icon family=\"scaffold\" name=\"pip-exit\" class=\"media-status-indicator-icon media-status-indicator-pip-exit-icon\">\n</media-icon>\n<media-status-indicator-value>\n</media-status-indicator-value>\n</media-status-indicator>\n<media-seek-indicator class=\"media-indicator media-seek-indicator\">\n<media-icon family=\"scaffold\" name=\"chevron\" class=\"media-seek-indicator-icon\">\n</media-icon>\n<media-seek-indicator-value class=\"media-seek-indicator-value\">\n</media-seek-indicator-value>\n</media-seek-indicator>\n</div>\n</media-container>`);\n"],"mappings":";;;AAGA,MAAa,WACX,eAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBAycT"}

package/dist/dev/media/background-video/adapter.d.ts

@@ -1,20 +1,14 @@
-import { getTemplateHTML } from "./template.js";
+import { BackgroundVideoBase } from "./base.js";
 import { Media } from "@videojs/media/dom";
 //#region src/media/background-video/adapter.d.ts
-declare const BackgroundVideo_base: {
-  new (): HTMLElement;
-  prototype: HTMLElement;
-};
-export declare class BackgroundVideo extends BackgroundVideo_base {
-  static shadowRootOptions: {
-    mode: ShadowRootMode;
-  };
-  static getTemplateHTML: typeof getTemplateHTML;
-  static get observedAttributes(): string[];
+export declare class BackgroundVideo extends BackgroundVideoBase {
   constructor();
   getMediaTarget(): Media | null;
-  attributeChangedCallback(attrName: string, oldValue: string | null, newValue: string | null): void;
-  get target(): HTMLVideoElement | null;
+  /** URL of a video the browser can play directly. Assigning a new one restarts playback. */
+  get src(): string;
+  set src(value: string);
+  /** The inner video's `MediaError`, or `null`. */
+  get error(): MediaError | null;
 }
 //#endregion
 //# sourceMappingURL=adapter.d.ts.map

package/dist/dev/media/background-video/adapter.js

@@ -1,46 +1,24 @@
-import { MediaAttachMixin } from "../../store/media-attach-mixin.js";
-import { getTemplateHTML } from "./template.js";
-import { namedNodeMapToObject } from "@videojs/utils/dom";
+import { BackgroundVideoBase } from "./base.js";
 //#region src/media/background-video/adapter.ts
-const HTMLElementBase = globalThis.HTMLElement ?? class {};
-var BackgroundVideo = class extends MediaAttachMixin(HTMLElementBase) {
-	static {
-		this.shadowRootOptions = { mode: "open" };
-	}
-	static {
-		this.getTemplateHTML = getTemplateHTML;
-	}
-	static get observedAttributes() {
-		return ["src"];
-	}
+var BackgroundVideo = class extends BackgroundVideoBase {
 	constructor() {
 		super();
-		if (!this.shadowRoot) {
-			this.attachShadow(this.constructor.shadowRootOptions);
-			const attrs = {
-				...namedNodeMapToObject(this.attributes),
-				...!this.hasAttribute("nomuted") && { muted: "" },
-				...!this.hasAttribute("noloop") && { loop: "" },
-				...!this.hasAttribute("noautoplay") && { autoplay: "" },
-				playsinline: "",
-				disableremoteplayback: "",
-				disablepictureinpicture: ""
-			};
-			this.shadowRoot.innerHTML = getTemplateHTML(attrs);
-		}
-		this.target.muted = !this.hasAttribute("nomuted");
+		this.target?.addEventListener("error", () => this.dispatchEvent(new Event("error")));
 	}
 	getMediaTarget() {
 		return this.target;
 	}
-	attributeChangedCallback(attrName, oldValue, newValue) {
-		if (attrName === "src" && oldValue !== newValue) this.target.src = newValue ?? "";
+	/** URL of a video the browser can play directly. Assigning a new one restarts playback. */
+	get src() {
+		return this.target?.src ?? "";
+	}
+	set src(value) {
+		const target = this.target;
+		if (target) target.src = value;
 	}
-	get target() {
-		const slotted = this.querySelector(":scope > [slot=media]");
-		if (slotted instanceof HTMLVideoElement) return slotted;
-		const video = this.querySelector("video") ?? this.shadowRoot?.querySelector("video");
-		return video instanceof HTMLVideoElement ? video : null;
+	/** The inner video's `MediaError`, or `null`. */
+	get error() {
+		return this.target?.error ?? null;
 	}
 };
 //#endregion

package/dist/dev/media/background-video/adapter.js.map

@@ -1 +1 @@
-{"version":3,"file":"adapter.js","names":[],"sources":["../../../../src/media/background-video/adapter.ts"],"sourcesContent":["import type { Media } from '@videojs/media/dom';\nimport { namedNodeMapToObject } from '@videojs/utils/dom';\n\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\nimport { getTemplateHTML } from './template';\n\nconst HTMLElementBase = globalThis.HTMLElement ?? class {};\n\n// Don't extend CustomMediaMixin to save some bytes, background videos don't need the full Media API.\nexport class BackgroundVideo extends MediaAttachMixin(HTMLElementBase) {\n  static shadowRootOptions = { mode: 'open' as ShadowRootMode };\n  static getTemplateHTML = getTemplateHTML;\n  static get observedAttributes() {\n    return ['src'];\n  }\n\n  constructor() {\n    super();\n\n    if (!this.shadowRoot) {\n      this.attachShadow((this.constructor as typeof BackgroundVideo).shadowRootOptions);\n\n      const attrs = {\n        ...namedNodeMapToObject(this.attributes),\n        ...(!this.hasAttribute('nomuted') && { muted: '' }),\n        ...(!this.hasAttribute('noloop') && { loop: '' }),\n        ...(!this.hasAttribute('noautoplay') && { autoplay: '' }),\n        playsinline: '',\n        disableremoteplayback: '',\n        disablepictureinpicture: '',\n      };\n\n      this.shadowRoot!.innerHTML = getTemplateHTML(attrs);\n    }\n\n    // Neither Chrome or Firefox support setting the muted attribute\n    // after using document.createElement.\n    // Get around this by setting the muted property manually.\n    this.target!.muted = !this.hasAttribute('nomuted');\n  }\n\n  // Register the inner <video> (not `this`) with the provider.\n  getMediaTarget(): Media | null {\n    return this.target;\n  }\n\n  attributeChangedCallback(attrName: string, oldValue: string | null, newValue: string | null): void {\n    if (attrName === 'src' && oldValue !== newValue) {\n      this.target!.src = newValue ?? '';\n    }\n  }\n\n  get target(): HTMLVideoElement | null {\n    const slotted = this.querySelector(':scope > [slot=media]');\n    if (slotted instanceof HTMLVideoElement) return slotted;\n\n    const video = this.querySelector('video') ?? this.shadowRoot?.querySelector('video');\n\n    return video instanceof HTMLVideoElement ? video : null;\n  }\n}\n"],"mappings":";;;;AAMA,MAAM,kBAAkB,WAAW,eAAe,MAAM,CAAC;AAGzD,IAAa,kBAAb,cAAqC,iBAAiB,eAAe,CAAC,CAAC;;EAC1C,KAAA,oBAAA,EAAE,MAAM,OAAyB;;;EACnC,KAAA,kBAAA;;CACzB,WAAW,qBAAqB;EAC9B,OAAO,CAAC,KAAK;CACf;CAEA,cAAc;EACZ,MAAM;EAEN,IAAI,CAAC,KAAK,YAAY;GACpB,KAAK,aAAc,KAAK,YAAuC,iBAAiB;GAEhF,MAAM,QAAQ;IACZ,GAAG,qBAAqB,KAAK,UAAU;IACvC,GAAI,CAAC,KAAK,aAAa,SAAS,KAAK,EAAE,OAAO,GAAG;IACjD,GAAI,CAAC,KAAK,aAAa,QAAQ,KAAK,EAAE,MAAM,GAAG;IAC/C,GAAI,CAAC,KAAK,aAAa,YAAY,KAAK,EAAE,UAAU,GAAG;IACvD,aAAa;IACb,uBAAuB;IACvB,yBAAyB;GAC3B;GAEA,KAAK,WAAY,YAAY,gBAAgB,KAAK;EACpD;EAKA,KAAK,OAAQ,QAAQ,CAAC,KAAK,aAAa,SAAS;CACnD;CAGA,iBAA+B;EAC7B,OAAO,KAAK;CACd;CAEA,yBAAyB,UAAkB,UAAyB,UAA+B;EACjG,IAAI,aAAa,SAAS,aAAa,UACrC,KAAK,OAAQ,MAAM,YAAY;CAEnC;CAEA,IAAI,SAAkC;EACpC,MAAM,UAAU,KAAK,cAAc,uBAAuB;EAC1D,IAAI,mBAAmB,kBAAkB,OAAO;EAEhD,MAAM,QAAQ,KAAK,cAAc,OAAO,KAAK,KAAK,YAAY,cAAc,OAAO;EAEnF,OAAO,iBAAiB,mBAAmB,QAAQ;CACrD;AACF"}
+{"version":3,"file":"adapter.js","names":[],"sources":["../../../../src/media/background-video/adapter.ts"],"sourcesContent":["import type { Media } from '@videojs/media/dom';\n\nimport { BackgroundVideoBase } from './base';\n\n// Don't extend CustomMediaMixin to save some bytes, background videos don't need the full Media API.\nexport class BackgroundVideo extends BackgroundVideoBase {\n  constructor() {\n    super();\n\n    // `error` doesn't cross the shadow boundary, so re-fire it from the host,\n    // matching `<hls-background-video>`.\n    this.target?.addEventListener('error', () => this.dispatchEvent(new Event('error')));\n  }\n\n  // Register the inner <video> (not `this`) with the provider.\n  getMediaTarget(): Media | null {\n    return this.target;\n  }\n\n  /** URL of a video the browser can play directly. Assigning a new one restarts playback. */\n  override get src(): string {\n    return this.target?.src ?? '';\n  }\n\n  override set src(value: string) {\n    const target = this.target;\n\n    if (target) target.src = value;\n  }\n\n  /** The inner video's `MediaError`, or `null`. */\n  get error(): MediaError | null {\n    return this.target?.error ?? null;\n  }\n}\n"],"mappings":";;AAKA,IAAa,kBAAb,cAAqC,oBAAoB;CACvD,cAAc;EACZ,MAAM;EAIN,KAAK,QAAQ,iBAAiB,eAAe,KAAK,cAAc,IAAI,MAAM,OAAO,CAAC,CAAC;CACrF;CAGA,iBAA+B;EAC7B,OAAO,KAAK;CACd;;CAGA,IAAa,MAAc;EACzB,OAAO,KAAK,QAAQ,OAAO;CAC7B;CAEA,IAAa,IAAI,OAAe;EAC9B,MAAM,SAAS,KAAK;EAEpB,IAAI,QAAQ,OAAO,MAAM;CAC3B;;CAGA,IAAI,QAA2B;EAC7B,OAAO,KAAK,QAAQ,SAAS;CAC/B;AACF"}

package/dist/dev/media/background-video/base.d.ts

@@ -0,0 +1,44 @@
+import { getTemplateHTML } from "./template.js";
+//#region src/media/background-video/base.d.ts
+interface LifecycleElement extends HTMLElement {
+  connectedCallback?(): void;
+  disconnectedCallback?(): void;
+  adoptedCallback?(): void;
+  attributeChangedCallback?(name: string, oldValue: string | null, newValue: string | null): void;
+}
+declare const MediaAttachBase: new () => LifecycleElement;
+declare const PLAYBACK_DEFAULTS: readonly ['muted', 'loop', 'autoplay'];
+/** A playback default an element can let authors turn off with a `no*` attribute. */
+export type BackgroundVideoOptOut = (typeof PLAYBACK_DEFAULTS)[number];
+/**
+ * The shadow setup, `src` wiring, and `target` that `<background-video>` and `<hls-background-video>` share. Each
+ * subclass supplies its own `src` and declares which playback defaults authors may opt out of.
+ *
+ * @internal
+ */
+export declare abstract class BackgroundVideoBase extends MediaAttachBase {
+  #private;
+  static shadowRootOptions: {
+    mode: ShadowRootMode;
+  };
+  static getTemplateHTML: typeof getTemplateHTML;
+  /** Defaults that a matching `no*` attribute turns off. Every other default is fixed on. */
+  static optOuts: readonly BackgroundVideoOptOut[];
+  /** Host attributes copied onto the inner video at creation and mirrored as they change. */
+  static passthroughAttributes: readonly string[];
+  static get observedAttributes(): string[];
+  constructor();
+  /**
+   * Writes muted, loop, and autoplay onto the inner video as properties. The template's attributes only cover markup
+   * parsed with its attributes in place; an element created by script gets its `no*` attributes afterwards, and neither
+   * Chrome nor Firefox honor a `muted` attribute set after `document.createElement`.
+   */
+  protected syncPlaybackDefaults(): void;
+  abstract get src(): string;
+  abstract set src(value: string);
+  attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+  /** The inner `<video>` in the shadow root: what plays, and what `play()` / `pause()` belong on. */
+  get target(): HTMLVideoElement | null;
+}
+//#endregion
+//# sourceMappingURL=base.d.ts.map

package/dist/dev/media/background-video/base.js

@@ -0,0 +1,97 @@
+import { MediaAttachMixin } from "../../store/media-attach-mixin.js";
+import { getTemplateHTML, getTemplateVideo } from "./template.js";
+import { namedNodeMapToObject } from "@videojs/utils/dom";
+import { pick } from "@videojs/utils/object";
+//#region src/media/background-video/base.ts
+const HTMLElementBase = globalThis.HTMLElement ?? class {};
+const MediaAttachBase = MediaAttachMixin(HTMLElementBase);
+const PLAYBACK_DEFAULTS = [
+	"muted",
+	"loop",
+	"autoplay"
+];
+/**
+* The shadow setup, `src` wiring, and `target` that `<background-video>` and `<hls-background-video>` share. Each
+* subclass supplies its own `src` and declares which playback defaults authors may opt out of.
+*
+* @internal
+*/
+var BackgroundVideoBase = class extends MediaAttachBase {
+	static {
+		this.shadowRootOptions = { mode: "open" };
+	}
+	static {
+		this.getTemplateHTML = getTemplateHTML;
+	}
+	static {
+		this.optOuts = [
+			"muted",
+			"loop",
+			"autoplay"
+		];
+	}
+	static {
+		this.passthroughAttributes = [
+			"controls",
+			"controlslist",
+			"crossorigin",
+			"preload"
+		];
+	}
+	static get observedAttributes() {
+		return [
+			"src",
+			...this.optOuts,
+			...this.optOuts.map((name) => `no${name}`),
+			...this.passthroughAttributes
+		];
+	}
+	constructor() {
+		super();
+		const ctor = this.constructor;
+		if (!this.shadowRoot) {
+			const attrs = {
+				...pick(namedNodeMapToObject(this.attributes), ctor.passthroughAttributes),
+				playsinline: "",
+				disableremoteplayback: "",
+				disablepictureinpicture: ""
+			};
+			for (const name of PLAYBACK_DEFAULTS) if (this.#isDefaultOn(name)) attrs[name] = "";
+			this.attachShadow(ctor.shadowRootOptions);
+			this.shadowRoot.innerHTML = ctor.getTemplateHTML(attrs);
+		}
+		this.syncPlaybackDefaults();
+	}
+	/**
+	* Writes muted, loop, and autoplay onto the inner video as properties. The template's attributes only cover markup
+	* parsed with its attributes in place; an element created by script gets its `no*` attributes afterwards, and neither
+	* Chrome nor Firefox honor a `muted` attribute set after `document.createElement`.
+	*/
+	syncPlaybackDefaults() {
+		const target = this.target;
+		if (!target) return;
+		for (const name of PLAYBACK_DEFAULTS) target[name] = this.#isDefaultOn(name);
+	}
+	/** On unless its `no*` attribute is set and allowed; an explicit attribute such as `muted` wins over its opt-out. */
+	#isDefaultOn(name) {
+		const { optOuts } = this.constructor;
+		return this.hasAttribute(name) || !optOuts.includes(name) || !this.hasAttribute(`no${name}`);
+	}
+	attributeChangedCallback(name, oldValue, newValue) {
+		if (oldValue === newValue) return;
+		const { passthroughAttributes } = this.constructor;
+		if (name === "src") this.src = newValue ?? "";
+		else if (passthroughAttributes.includes(name)) {
+			if (newValue === null) this.target?.removeAttribute(name);
+			else this.target?.setAttribute(name, newValue);
+		} else this.syncPlaybackDefaults();
+	}
+	/** The inner `<video>` in the shadow root: what plays, and what `play()` / `pause()` belong on. */
+	get target() {
+		return getTemplateVideo(this.shadowRoot);
+	}
+};
+//#endregion
+export { BackgroundVideoBase };
+
+//# sourceMappingURL=base.js.map

package/dist/dev/media/background-video/base.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.js","names":[],"sources":["../../../../src/media/background-video/base.ts"],"sourcesContent":["import { namedNodeMapToObject } from '@videojs/utils/dom';\nimport { pick } from '@videojs/utils/object';\n\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\nimport { getTemplateHTML, getTemplateVideo } from './template';\n\nconst HTMLElementBase = globalThis.HTMLElement ?? class {};\n\n// `MediaAttachMixin` is typed as returning its base, so its lifecycle callbacks\n// aren't visible for `super` to reach. Method syntax lets subclasses override them.\ninterface LifecycleElement extends HTMLElement {\n  connectedCallback?(): void;\n  disconnectedCallback?(): void;\n  adoptedCallback?(): void;\n  attributeChangedCallback?(name: string, oldValue: string | null, newValue: string | null): void;\n}\n\nconst MediaAttachBase = MediaAttachMixin(HTMLElementBase) as unknown as new () => LifecycleElement;\n\nconst PLAYBACK_DEFAULTS = ['muted', 'loop', 'autoplay'] as const;\n\n/** A playback default an element can let authors turn off with a `no*` attribute. */\nexport type BackgroundVideoOptOut = (typeof PLAYBACK_DEFAULTS)[number];\n\n/**\n * The shadow setup, `src` wiring, and `target` that `<background-video>` and `<hls-background-video>` share. Each\n * subclass supplies its own `src` and declares which playback defaults authors may opt out of.\n *\n * @internal\n */\nexport abstract class BackgroundVideoBase extends MediaAttachBase {\n  static shadowRootOptions = { mode: 'open' as ShadowRootMode };\n  static getTemplateHTML = getTemplateHTML;\n  /** Defaults that a matching `no*` attribute turns off. Every other default is fixed on. */\n  static optOuts: readonly BackgroundVideoOptOut[] = ['muted', 'loop', 'autoplay'];\n  /** Host attributes copied onto the inner video at creation and mirrored as they change. */\n  static passthroughAttributes: readonly string[] = ['controls', 'controlslist', 'crossorigin', 'preload'];\n\n  static get observedAttributes(): string[] {\n    return ['src', ...this.optOuts, ...this.optOuts.map((name) => `no${name}`), ...this.passthroughAttributes];\n  }\n\n  constructor() {\n    super();\n\n    const ctor = this.constructor as typeof BackgroundVideoBase;\n\n    if (!this.shadowRoot) {\n      const attrs: Record<string, string> = {\n        ...pick(namedNodeMapToObject(this.attributes), ctor.passthroughAttributes),\n        playsinline: '',\n        disableremoteplayback: '',\n        disablepictureinpicture: '',\n      };\n\n      for (const name of PLAYBACK_DEFAULTS) {\n        if (this.#isDefaultOn(name)) attrs[name] = '';\n      }\n\n      this.attachShadow(ctor.shadowRootOptions);\n      this.shadowRoot!.innerHTML = ctor.getTemplateHTML(attrs);\n    }\n\n    this.syncPlaybackDefaults();\n  }\n\n  /**\n   * Writes muted, loop, and autoplay onto the inner video as properties. The template's attributes only cover markup\n   * parsed with its attributes in place; an element created by script gets its `no*` attributes afterwards, and neither\n   * Chrome nor Firefox honor a `muted` attribute set after `document.createElement`.\n   */\n  protected syncPlaybackDefaults(): void {\n    const target = this.target;\n    if (!target) return;\n\n    for (const name of PLAYBACK_DEFAULTS) target[name] = this.#isDefaultOn(name);\n  }\n\n  /** On unless its `no*` attribute is set and allowed; an explicit attribute such as `muted` wins over its opt-out. */\n  #isDefaultOn(name: BackgroundVideoOptOut): boolean {\n    const { optOuts } = this.constructor as typeof BackgroundVideoBase;\n\n    return this.hasAttribute(name) || !optOuts.includes(name) || !this.hasAttribute(`no${name}`);\n  }\n\n  abstract get src(): string;\n  abstract set src(value: string);\n\n  override attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void {\n    if (oldValue === newValue) return;\n\n    const { passthroughAttributes } = this.constructor as typeof BackgroundVideoBase;\n\n    if (name === 'src') {\n      this.src = newValue ?? '';\n    } else if (passthroughAttributes.includes(name)) {\n      if (newValue === null) this.target?.removeAttribute(name);\n      else this.target?.setAttribute(name, newValue);\n    } else {\n      this.syncPlaybackDefaults();\n    }\n  }\n\n  /** The inner `<video>` in the shadow root: what plays, and what `play()` / `pause()` belong on. */\n  get target(): HTMLVideoElement | null {\n    return getTemplateVideo(this.shadowRoot);\n  }\n}\n"],"mappings":";;;;;AAMA,MAAM,kBAAkB,WAAW,eAAe,MAAM,CAAC;AAWzD,MAAM,kBAAkB,iBAAiB,eAAe;AAExD,MAAM,oBAAoB;CAAC;CAAS;CAAQ;AAAU;;;;;;;AAWtD,IAAsB,sBAAtB,cAAkD,gBAAgB;;EACrC,KAAA,oBAAA,EAAE,MAAM,OAAyB;;;EACnC,KAAA,kBAAA;;;EAE0B,KAAA,UAAA;GAAC;GAAS;GAAQ;EAAU;;;EAE7B,KAAA,wBAAA;GAAC;GAAY;GAAgB;GAAe;EAAS;;CAEvG,WAAW,qBAA+B;EACxC,OAAO;GAAC;GAAO,GAAG,KAAK;GAAS,GAAG,KAAK,QAAQ,KAAK,SAAS,KAAK,MAAM;GAAG,GAAG,KAAK;EAAqB;CAC3G;CAEA,cAAc;EACZ,MAAM;EAEN,MAAM,OAAO,KAAK;EAElB,IAAI,CAAC,KAAK,YAAY;GACpB,MAAM,QAAgC;IACpC,GAAG,KAAK,qBAAqB,KAAK,UAAU,GAAG,KAAK,qBAAqB;IACzE,aAAa;IACb,uBAAuB;IACvB,yBAAyB;GAC3B;GAEA,KAAK,MAAM,QAAQ,mBACjB,IAAI,KAAK,aAAa,IAAI,GAAG,MAAM,QAAQ;GAG7C,KAAK,aAAa,KAAK,iBAAiB;GACxC,KAAK,WAAY,YAAY,KAAK,gBAAgB,KAAK;EACzD;EAEA,KAAK,qBAAqB;CAC5B;;;;;;CAOA,uBAAuC;EACrC,MAAM,SAAS,KAAK;EACpB,IAAI,CAAC,QAAQ;EAEb,KAAK,MAAM,QAAQ,mBAAmB,OAAO,QAAQ,KAAK,aAAa,IAAI;CAC7E;;CAGA,aAAa,MAAsC;EACjD,MAAM,EAAE,YAAY,KAAK;EAEzB,OAAO,KAAK,aAAa,IAAI,KAAK,CAAC,QAAQ,SAAS,IAAI,KAAK,CAAC,KAAK,aAAa,KAAK,MAAM;CAC7F;CAKA,yBAAkC,MAAc,UAAyB,UAA+B;EACtG,IAAI,aAAa,UAAU;EAE3B,MAAM,EAAE,0BAA0B,KAAK;EAEvC,IAAI,SAAS,OACX,KAAK,MAAM,YAAY;OAClB,IAAI,sBAAsB,SAAS,IAAI,GAAG;GAC/C,IAAI,aAAa,MAAM,KAAK,QAAQ,gBAAgB,IAAI;QACnD,KAAK,QAAQ,aAAa,MAAM,QAAQ;EAC/C,OACE,KAAK,qBAAqB;CAE9B;;CAGA,IAAI,SAAkC;EACpC,OAAO,iBAAiB,KAAK,UAAU;CACzC;AACF"}

package/dist/dev/media/background-video/template.d.ts

@@ -3,6 +3,9 @@
  * The shadow template both background-video elements render: a `<slot>` for a placeholder image, and a `<video>`
  * stretched over the host.
  *
+ * `attrs` go onto the `<video>` as given; each element decides which of its own attributes to forward. `src` is never
+ * among them, since serializing it would start a native load before an engine could take it.
+ *
  * Shared so the two can't drift in presentation. `object-fit` and `object-position` are the only styling hooks — a
  * background video has no controls to theme.
  */

package/dist/dev/media/background-video/template.js

@@ -1,27 +1,12 @@
 import { serializeAttributes } from "@videojs/utils/dom";
-import { pick } from "@videojs/utils/object";
 //#region src/media/background-video/template.ts
 /**
-* Attributes forwarded to the inner `<video>`. `src` is deliberately not one of them: each element decides what to do
-* with it, whether that is assigning the inner video or handing it to a playback engine, and serializing it into the
-* template would start a native load either way.
-*/
-const VideoAttributes = [
-	"autoplay",
-	"controls",
-	"controlslist",
-	"crossorigin",
-	"disablepictureinpicture",
-	"disableremoteplayback",
-	"loop",
-	"muted",
-	"playsinline",
-	"preload"
-];
-/**
 * The shadow template both background-video elements render: a `<slot>` for a placeholder image, and a `<video>`
 * stretched over the host.
 *
+* `attrs` go onto the `<video>` as given; each element decides which of its own attributes to forward. `src` is never
+* among them, since serializing it would start a native load before an engine could take it.
+*
 * Shared so the two can't drift in presentation. `object-fit` and `object-position` are the only styling hooks — a
 * background video has no controls to theme.
 */
@@ -42,10 +27,18 @@ function getTemplateHTML(attrs) {
       }
     </style>
     <slot></slot>
-    <video${serializeAttributes(pick(attrs, [...VideoAttributes]))}></video>
+    <video${serializeAttributes(attrs)}></video>
   `;
 }
+/**
+* The `<video>` from `getTemplateHTML`. Always the shadow one: the template has no slot that would render a light-DOM
+* `<video>`, so anything found there is either the placeholder or not displayed at all.
+*/
+function getTemplateVideo(shadowRoot) {
+	const video = shadowRoot?.querySelector("video");
+	return video instanceof HTMLVideoElement ? video : null;
+}
 //#endregion
-export { VideoAttributes, getTemplateHTML };
+export { getTemplateHTML, getTemplateVideo };
 
 //# sourceMappingURL=template.js.map

package/dist/dev/media/background-video/template.js.map

@@ -1 +1 @@
-{"version":3,"file":"template.js","names":[],"sources":["../../../../src/media/background-video/template.ts"],"sourcesContent":["import { serializeAttributes } from '@videojs/utils/dom';\nimport { pick } from '@videojs/utils/object';\n\n/**\n * Attributes forwarded to the inner `<video>`. `src` is deliberately not one of them: each element decides what to do\n * with it, whether that is assigning the inner video or handing it to a playback engine, and serializing it into the\n * template would start a native load either way.\n */\nexport const VideoAttributes = [\n  'autoplay',\n  'controls',\n  'controlslist',\n  'crossorigin',\n  'disablepictureinpicture',\n  'disableremoteplayback',\n  'loop',\n  'muted',\n  'playsinline',\n  'preload',\n] as const;\n\n/**\n * The shadow template both background-video elements render: a `<slot>` for a placeholder image, and a `<video>`\n * stretched over the host.\n *\n * Shared so the two can't drift in presentation. `object-fit` and `object-position` are the only styling hooks — a\n * background video has no controls to theme.\n */\nexport function getTemplateHTML(attrs: Record<string, string>) {\n  return /*html*/ `\n    <style>\n      :host {\n        position: relative;\n      }\n\n      video {\n        position: absolute;\n        inset: 0;\n        width: 100%;\n        height: 100%;\n        object-fit: var(--media-object-fit, inherit);\n        object-position: var(--media-object-position, 50% 50%);\n      }\n    </style>\n    <slot></slot>\n    <video${serializeAttributes(pick(attrs, [...VideoAttributes]))}></video>\n  `;\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,kBAAkB;CAC7B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;;;;;;;;AASA,SAAgB,gBAAgB,OAA+B;CAC7D,OAAgB;;;;;;;;;;;;;;;;YAgBN,oBAAoB,KAAK,OAAO,CAAC,GAAG,eAAe,CAAC,CAAC,EAAE;;AAEnE"}
+{"version":3,"file":"template.js","names":[],"sources":["../../../../src/media/background-video/template.ts"],"sourcesContent":["import { serializeAttributes } from '@videojs/utils/dom';\n\n/**\n * The shadow template both background-video elements render: a `<slot>` for a placeholder image, and a `<video>`\n * stretched over the host.\n *\n * `attrs` go onto the `<video>` as given; each element decides which of its own attributes to forward. `src` is never\n * among them, since serializing it would start a native load before an engine could take it.\n *\n * Shared so the two can't drift in presentation. `object-fit` and `object-position` are the only styling hooks — a\n * background video has no controls to theme.\n */\nexport function getTemplateHTML(attrs: Record<string, string>) {\n  return /*html*/ `\n    <style>\n      :host {\n        position: relative;\n      }\n\n      video {\n        position: absolute;\n        inset: 0;\n        width: 100%;\n        height: 100%;\n        object-fit: var(--media-object-fit, inherit);\n        object-position: var(--media-object-position, 50% 50%);\n      }\n    </style>\n    <slot></slot>\n    <video${serializeAttributes(attrs)}></video>\n  `;\n}\n\n/**\n * The `<video>` from `getTemplateHTML`. Always the shadow one: the template has no slot that would render a light-DOM\n * `<video>`, so anything found there is either the placeholder or not displayed at all.\n */\nexport function getTemplateVideo(shadowRoot: ShadowRoot | null): HTMLVideoElement | null {\n  const video = shadowRoot?.querySelector('video');\n\n  return video instanceof HTMLVideoElement ? video : null;\n}\n"],"mappings":";;;;;;;;;;;;AAYA,SAAgB,gBAAgB,OAA+B;CAC7D,OAAgB;;;;;;;;;;;;;;;;YAgBN,oBAAoB,KAAK,EAAE;;AAEvC;;;;;AAMA,SAAgB,iBAAiB,YAAwD;CACvF,MAAM,QAAQ,YAAY,cAAc,OAAO;CAE/C,OAAO,iBAAiB,mBAAmB,QAAQ;AACrD"}

package/dist/dev/media/dailymotion-video/adapter.d.ts

@@ -0,0 +1,17 @@
+import { CustomMediaConstructor } from "../../index.js";
+import { DailymotionAdapter } from "@videojs/dailymotion-video";
+//#region src/media/dailymotion-video/adapter.d.ts
+interface DailymotionCustomMediaElement {
+  connectedCallback?(): void;
+}
+declare const DailymotionCustomMediaElement_base: CustomMediaConstructor<typeof DailymotionAdapter>;
+declare class DailymotionCustomMediaElement extends DailymotionCustomMediaElement_base {
+  static getTemplateHTML: () => string;
+}
+declare const DailymotionVideo_base: typeof DailymotionCustomMediaElement;
+export declare class DailymotionVideo extends DailymotionVideo_base {
+  constructor();
+  connectedCallback(): void;
+}
+//#endregion
+//# sourceMappingURL=adapter.d.ts.map

package/dist/dev/media/dailymotion-video/adapter.js

@@ -0,0 +1,47 @@
+import { MediaAttachMixin } from "../../store/media-attach-mixin.js";
+import { CustomMediaElement } from "@videojs/media/dom";
+import { DailymotionAdapter } from "@videojs/dailymotion-video";
+//#region src/media/dailymotion-video/adapter.ts
+var DailymotionCustomMediaElement = class extends CustomMediaElement("iframe", DailymotionAdapter) {
+	static {
+		this.getTemplateHTML = () => `
+    <style>
+      :host {
+        display: inline-block;
+        min-width: 300px;
+        min-height: 150px;
+        position: relative;
+      }
+      ::slotted([slot=media]) {
+        position: absolute;
+        inset: 0;
+      }
+    </style>
+    <slot name="media"></slot>
+  `;
+	}
+};
+var DailymotionVideo = class extends MediaAttachMixin(DailymotionCustomMediaElement) {
+	constructor() {
+		super();
+		this.adapter.addEventListener("volumechange", () => {
+			const { muted } = this.adapter;
+			if (this.hasAttribute("muted") !== muted) this.toggleAttribute("muted", muted);
+		});
+	}
+	connectedCallback() {
+		super.connectedCallback?.();
+		const existing = this.querySelector(":scope > [slot=media]");
+		if (existing) {
+			if (this.adapter.src && !existing.hasChildNodes() && !this.adapter.error) this.adapter.load();
+			return;
+		}
+		const container = document.createElement("div");
+		container.slot = "media";
+		this.append(container);
+	}
+};
+//#endregion
+export { DailymotionVideo };
+
+//# sourceMappingURL=adapter.js.map

package/dist/dev/media/dailymotion-video/adapter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"adapter.js","names":[],"sources":["../../../../src/media/dailymotion-video/adapter.ts"],"sourcesContent":["import { DailymotionAdapter } from '@videojs/dailymotion-video';\nimport { CustomMediaElement } from '@videojs/media/dom';\n\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\n\n// `CustomMediaElement` implements `connectedCallback` but doesn't type it; declared so `super` can reach it.\ninterface DailymotionCustomMediaElement {\n  connectedCallback?(): void;\n}\n\n// The target is a container the SDK builds its iframe in. `'iframe'` still tells `CustomMediaElement` it hosts an\n// embed: no attributes are mirrored onto the target, and the host is marked as a cross-origin frame. Unlike the other\n// embed hosts, it never keeps the player out of hit-testing: Dailymotion's terms forbid blocking any part of its player.\nclass DailymotionCustomMediaElement extends CustomMediaElement('iframe', DailymotionAdapter) {\n  static override getTemplateHTML = (): string => /*html*/ `\n    <style>\n      :host {\n        display: inline-block;\n        min-width: 300px;\n        min-height: 150px;\n        position: relative;\n      }\n      ::slotted([slot=media]) {\n        position: absolute;\n        inset: 0;\n      }\n    </style>\n    <slot name=\"media\"></slot>\n  `;\n}\n\nexport class DailymotionVideo extends MediaAttachMixin(DailymotionCustomMediaElement) {\n  constructor() {\n    super();\n\n    // Dailymotion can mute the player on its own (a browser's muted autoplay, a click on its own mute button). Writes\n    // to `muted` go through the `muted` attribute, so it follows the player, or a later unmute would find nothing to\n    // change. The attribute change sets the same value back, which the adapter ignores.\n    this.adapter.addEventListener('volumechange', () => {\n      const { muted } = this.adapter;\n\n      if (this.hasAttribute('muted') !== muted) this.toggleAttribute('muted', muted);\n    });\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback?.();\n\n    // The SDK finds the container by id from the document, so it lives in the light DOM, slotted as `media` to become\n    // the adapter's target. Added here because a constructor may not add children.\n    const existing = this.querySelector(':scope > [slot=media]');\n\n    if (existing) {\n      // Attached before the host was in the page, the container stayed empty; load the source now.\n      if (this.adapter.src && !existing.hasChildNodes() && !this.adapter.error) this.adapter.load();\n\n      return;\n    }\n\n    const container = document.createElement('div');\n\n    container.slot = 'media';\n    this.append(container);\n  }\n}\n"],"mappings":";;;;AAaA,IAAM,gCAAN,cAA4C,mBAAmB,UAAU,kBAAkB,CAAC,CAAC;;EAClC,KAAA,wBAAA;;;;;;;;;;;;;;;;AAe3D;AAEA,IAAa,mBAAb,cAAsC,iBAAiB,6BAA6B,CAAC,CAAC;CACpF,cAAc;EACZ,MAAM;EAKN,KAAK,QAAQ,iBAAiB,sBAAsB;GAClD,MAAM,EAAE,UAAU,KAAK;GAEvB,IAAI,KAAK,aAAa,OAAO,MAAM,OAAO,KAAK,gBAAgB,SAAS,KAAK;EAC/E,CAAC;CACH;CAEA,oBAAmC;EACjC,MAAM,oBAAoB;EAI1B,MAAM,WAAW,KAAK,cAAc,uBAAuB;EAE3D,IAAI,UAAU;GAEZ,IAAI,KAAK,QAAQ,OAAO,CAAC,SAAS,cAAc,KAAK,CAAC,KAAK,QAAQ,OAAO,KAAK,QAAQ,KAAK;GAE5F;EACF;EAEA,MAAM,YAAY,SAAS,cAAc,KAAK;EAE9C,UAAU,OAAO;EACjB,KAAK,OAAO,SAAS;CACvB;AACF"}

package/dist/dev/media/dailymotion-video/index.d.ts

@@ -0,0 +1,2 @@
+import { DailymotionVideo } from "./adapter.js";
+export { DailymotionVideo };

package/dist/dev/media/hls-background-video/adapter.d.ts

@@ -1,14 +1,7 @@
-import { getTemplateHTML } from "../background-video/template.js";
+import { BackgroundVideoBase, BackgroundVideoOptOut } from "../background-video/base.js";
 import { Media } from "@videojs/media/dom";
-import { HlsVideoMediaError } from "@videojs/spf/adapters/hls-background-video";
+import { HlsBackgroundVideoAdapter, HlsVideoMediaError } from "@videojs/spf/adapters/hls-background-video";
 //#region src/media/hls-background-video/adapter.d.ts
-interface LifecycleElement extends HTMLElement {
-  connectedCallback?(): void;
-  disconnectedCallback?(): void;
-  adoptedCallback?(): void;
-  attributeChangedCallback?(name: string, oldValue: string | null, newValue: string | null): void;
-}
-declare const HlsBackgroundVideoBase: new () => LifecycleElement;
 /**
  * A muted, looping, chrome-less video over the SPF background-video engine.
  *
@@ -20,8 +13,9 @@ declare const HlsBackgroundVideoBase: new () => LifecycleElement;
  * package, whose `audio`, `debug`, `preload`, and `max-resolution` attributes are all deliberately absent. Capping
  * which rendition is fetched is a delivery param on the URL — `?max_resolution=720p` on a Mux stream, for one — which
  * keeps the renditions it excludes out of the manifest rather than merely unpicked; `preload` would have nothing to
- * say, since the engine loads from the moment it has a source. And unlike `<background-video>` there are no `nomuted` /
- * `noloop` / `noautoplay` opt-outs: those three are what this element is for, so the adapter fixes them on at attach.
+ * say, since the engine loads from the moment it has a source. Muted is fixed on: the engine drops audio, so there is
+ * nothing to unmute. `noloop` and `noautoplay` opt out as on `<background-video>`, so a page can play the video once,
+ * or hold it until it has checked the motion preference.
  *
  * Takes no structured `source` — `src` is an HLS URL, as the package it replaces required. Mux playback-ID identity,
  * poster, and storyboard belong to `<mux-video>`; none of them mean anything without controls to hang them on.
@@ -43,19 +37,20 @@ declare const HlsBackgroundVideoBase: new () => LifecycleElement;
  *   `<mux-background-video>` is this element under the name the package it replaces used. Same class, so the tag is a
  *   naming choice and nothing more.
  */
-export declare class HlsBackgroundVideo extends HlsBackgroundVideoBase {
+export declare class HlsBackgroundVideo extends BackgroundVideoBase {
   #private;
-  static shadowRootOptions: {
-    mode: ShadowRootMode;
-  };
-  static getTemplateHTML: typeof getTemplateHTML;
-  static get observedAttributes(): string[];
+  static optOuts: readonly BackgroundVideoOptOut[];
+  static passthroughAttributes: readonly string[];
   constructor();
   /** Register the Media (not the inner `<video>`) with the provider. */
   getMediaTarget(): Media | null;
+  /**
+   * The Media driving the inner `<video>`, matching `adapter` on `CustomMediaElement`. Call `adapter.destroy()` to
+   * release the engine after `keep-alive` kept it running past removal.
+   */
+  get adapter(): HlsBackgroundVideoAdapter;
   disconnectedCallback(): void;
-  attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
-  /** The inner `<video>` the engine renders into. */
+  /** Same element as `target`. */
   get video(): HTMLVideoElement | null;
   /**
    * What made the current source unplayable, or `null`. An SVTA code rather than a `MediaError` one — 99001 where this