@videojs/html 10.0.1 → 10.1.0

package/dist/dev/internal/skins/default-video/skin.css

@@ -84,7 +84,7 @@
   :where(.media-skin) {
     --media-caption-track-duration: var(--media-duration-controls);
     --media-caption-track-delay: 25ms;
-    --media-caption-track-y: calc(var(--media-spacing) * -2);
+    --media-caption-track-y: calc(var(--media-spacing) * -3);
   }
 
   :where(.media-skin) video::-webkit-media-text-track-container {
@@ -107,9 +107,13 @@
     transition-property: transform;
   }
 
-  @container media-root (width >= 42rem) {
+  @container media-root (width < 42rem) {
+    :where(.media-skin)[data-theme="default"][data-controls-visible] video {
+      --media-caption-track-y: calc(var(--media-spacing) * -14);
+    }
+
     :where(.media-skin)[data-theme="neutral"][data-controls-visible] video {
-      --media-caption-track-y: calc(var(--media-spacing) * -12);
+      --media-caption-track-y: calc(var(--media-spacing) * -17);
     }
   }
 
@@ -404,7 +408,7 @@
     transform-origin: top;
     padding-inline: calc(var(--media-spacing) * 6);
     padding-top: calc(var(--media-spacing) * 2.5);
-    font-size: calc(var(--media-spacing) * 3.25);
+    font-size: calc(var(--media-spacing) * 4);
     letter-spacing: -.0125em;
     overflow-wrap: anywhere;
     color: var(--media-controls-foreground);
@@ -438,7 +442,6 @@
     :where(.media-skin[data-theme="default"]) .media-title {
       padding-inline: calc(var(--media-spacing) * 6);
       padding-top: calc(var(--media-spacing) * 4);
-      font-size: calc(var(--media-spacing) * 4.25);
     }
   }
 
@@ -1521,6 +1524,12 @@
     opacity: 1;
   }
 
+  :where(.media-skin[data-theme="default"]) .media-time-slider[data-playing] {
+    transition-property: --media-slider-buffer;
+    transition-duration: .15s;
+    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+  }
+
   :where(.media-skin[data-theme="default"]) .media-time-slider-chapter {
     --media-chapter-inset-end: .5;
     --media-chapter-inset-start: .5;
@@ -2652,7 +2661,7 @@
       color-mix(in oklab, var(--media-backdrop) 40%, transparent),
       color-mix(in oklab, var(--media-backdrop) 20%, transparent),
       color-mix(in oklab, var(--media-backdrop) 50%, transparent));
-    --media-caption-controls-y: calc(var(--media-spacing) * -14);
+    --media-caption-controls-y: calc(var(--media-spacing) * -16);
     --media-slider-preview-offset: calc(var(--media-spacing) * 9);
     --media-thumbnail-gradient: linear-gradient(to top,
       color-mix(in oklab, var(--media-backdrop) 50%, transparent),
@@ -2687,10 +2696,18 @@
       color-mix(in oklab, var(--media-backdrop) 35%, transparent),
       color-mix(in oklab, var(--media-backdrop) 20%, transparent) calc(var(--media-spacing) * 12),
       transparent);
-    --media-caption-controls-y: calc(var(--media-spacing) * -18);
+    --media-caption-controls-y: calc(var(--media-spacing) * -14);
     --media-slider-preview-offset: calc(var(--media-spacing) * 11);
   }
 
+  .media-skin:is([data-preset="video"], [data-preset="live-video"])[data-theme="compat"] {
+    --media-caption-controls-y: calc(var(--media-spacing) * -18);
+  }
+
+  .media-skin:is([data-preset="video"], [data-preset="live-video"])[data-theme="scaffold"] {
+    --media-caption-controls-y: calc(var(--media-spacing) * -20);
+  }
+
   @supports (color: oklch(from red l c h)) and (background-image: linear-gradient(in oklab, red, red)) {
     .media-skin:is([data-preset="video"], [data-preset="live-video"])[data-theme="neutral"] {
       --media-controls-gradient: linear-gradient(to top in oklab,

package/dist/dev/internal/skins/default-video/template.js

@@ -37,7 +37,7 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 <media-controls-content class="video-controls video-controls-content">
 <media-tooltip-group>
 <media-controls-group class="video-controls-primary">
-<media-play-button class="media-button media-play-button" id="vjs-QuClibja-0-trigger">
+<media-play-button class="media-button media-play-button" id="vjs-iSAklLIk-0-trigger">
 <media-icon name="restart" class="media-button-icon media-play-button-restart-icon">
 </media-icon>
 <media-icon name="play" class="media-button-icon media-play-button-play-icon">
@@ -45,13 +45,13 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 <media-icon name="pause" class="media-button-icon media-play-button-pause-icon">
 </media-icon>
 </media-play-button>
-<media-tooltip trigger="vjs-QuClibja-0-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-iSAklLIk-0-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">
 </media-tooltip-shortcut>
 </media-tooltip>
-<media-mute-button commandfor="vjs-OetjWaXX-0-popup" class="media-button media-mute-button video-controls-volume-button" id="vjs-QuClibja-0-2-trigger">
+<media-mute-button commandfor="vjs-F3QfBzzz-0-popup" class="media-button media-mute-button video-controls-volume-button" id="vjs-iSAklLIk-0-2-trigger">
 <media-icon name="volume-off" class="media-button-icon media-mute-button-off-icon">
 </media-icon>
 <media-icon name="volume-low" class="media-button-icon media-mute-button-low-icon">
@@ -59,13 +59,13 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 <media-icon name="volume-high" class="media-button-icon media-mute-button-high-icon">
 </media-icon>
 </media-mute-button>
-<media-tooltip trigger="vjs-QuClibja-0-2-trigger" delay="0" disabled sticky side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-iSAklLIk-0-2-trigger" delay="0" disabled sticky side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">
 </media-tooltip-shortcut>
 </media-tooltip>
-<media-volume-popover open-on-hover delay="200" close-delay="100" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-volume-popover" id="vjs-OetjWaXX-0-popup">
+<media-volume-popover open-on-hover delay="200" close-delay="100" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-volume-popover" id="vjs-F3QfBzzz-0-popup">
 <media-volume-slider class="media-slider media-volume-slider" thumb-alignment="edge" orientation="vertical">
 <media-slider-track class="media-slider-track">
 <media-slider-fill class="media-slider-fill">
@@ -112,29 +112,29 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 <media-time class="media-time-toggle video-time-value" type="remaining" toggle>
 </media-time>
 </media-controls-group>
-<media-captions-button class="media-button media-captions-button video-controls-captions-button" id="vjs-QuClibja-0-3-trigger">
+<media-captions-button class="media-button media-captions-button video-controls-captions-button" id="vjs-iSAklLIk-0-3-trigger">
 <media-icon name="captions-off" class="media-button-icon media-captions-button-off-icon">
 </media-icon>
 <media-icon name="captions-on" class="media-button-icon media-captions-button-on-icon">
 </media-icon>
 </media-captions-button>
-<media-tooltip trigger="vjs-QuClibja-0-3-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-iSAklLIk-0-3-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">
 </media-tooltip-shortcut>
 </media-tooltip>
-<button commandfor="vjs-oFdCBVms-0-popup" class="media-button media-settings-menu-trigger video-controls-settings-button" id="vjs-QuClibja-0-4-trigger">
+<button commandfor="vjs-28BtKs3v-0-popup" class="media-button media-settings-menu-trigger video-controls-settings-button" id="vjs-iSAklLIk-0-4-trigger">
 <media-icon name="gear" class="media-button-icon-base media-settings-menu-trigger-icon">
 </media-icon>
 <media-text class="media-settings-menu-trigger-label" token="menu.settings">Settings</media-text>
 </button>
-<media-tooltip trigger="vjs-QuClibja-0-4-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-iSAklLIk-0-4-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-text token="menu.settings">Settings</media-text>
 </media-tooltip>
-<media-menu side="top" align="center" class="media-popup media-popup-surface media-menu-popup media-menu-resizable-popup" id="vjs-oFdCBVms-0-popup">
+<media-menu side="top" align="center" class="media-popup media-popup-surface media-menu-popup media-menu-resizable-popup" id="vjs-28BtKs3v-0-popup">
 <media-menu-content class="media-menu-content">
-<media-menu-item commandfor="vjs-moIPS8Sb-0-content" class="media-menu-trigger-item">
+<media-menu-item commandfor="vjs-ZGpCKm5h-0-content" class="media-menu-trigger-item">
 <media-icon name="switches" class="media-menu-trigger-item-icon">
 </media-icon>
 <media-text token="menu.quality">Quality</media-text>
@@ -145,7 +145,7 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 </media-icon>
 </span>
 </media-menu-item>
-<media-menu-content class="media-menu-content" id="vjs-moIPS8Sb-0-content">
+<media-menu-content class="media-menu-content" id="vjs-ZGpCKm5h-0-content">
 <media-menu-item class="media-menu-back-item">
 <media-icon name="chevron" class="media-menu-back-chevron">
 </media-icon>
@@ -172,7 +172,7 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 </template>
 </media-quality-radio-group>
 </media-menu-content>
-<media-menu-item commandfor="vjs-rgOMyneB-0-content" class="media-menu-trigger-item">
+<media-menu-item commandfor="vjs-rPcYSc7i-0-content" class="media-menu-trigger-item">
 <media-icon name="speech" class="media-menu-trigger-item-icon">
 </media-icon>
 <media-text token="menu.audio">Audio</media-text>
@@ -183,7 +183,7 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 </media-icon>
 </span>
 </media-menu-item>
-<media-menu-content class="media-menu-content" id="vjs-rgOMyneB-0-content">
+<media-menu-content class="media-menu-content" id="vjs-rPcYSc7i-0-content">
 <media-menu-item class="media-menu-back-item">
 <media-icon name="chevron" class="media-menu-back-chevron">
 </media-icon>
@@ -204,7 +204,7 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 </template>
 </media-audio-track-radio-group>
 </media-menu-content>
-<media-menu-item commandfor="vjs-Uj2fjhhP-0-content" class="media-menu-trigger-item">
+<media-menu-item commandfor="vjs-8B_qQK6x-0-content" class="media-menu-trigger-item">
 <media-icon name="speed" class="media-menu-trigger-item-icon">
 </media-icon>
 <media-text token="menu.speed">Speed</media-text>
@@ -215,7 +215,7 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 </media-icon>
 </span>
 </media-menu-item>
-<media-menu-content class="media-menu-content" id="vjs-Uj2fjhhP-0-content">
+<media-menu-content class="media-menu-content" id="vjs-8B_qQK6x-0-content">
 <media-menu-item class="media-menu-back-item">
 <media-icon name="chevron" class="media-menu-back-chevron">
 </media-icon>
@@ -236,7 +236,7 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 </template>
 </media-playback-rate-radio-group>
 </media-menu-content>
-<media-menu-item commandfor="vjs-pnYuA7i8-0-content" class="media-menu-trigger-item">
+<media-menu-item commandfor="vjs-fVL6fVBf-0-content" class="media-menu-trigger-item">
 <media-icon name="captions-off" class="media-menu-trigger-item-icon">
 </media-icon>
 <media-text token="menu.captions">Captions</media-text>
@@ -247,7 +247,7 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 </media-icon>
 </span>
 </media-menu-item>
-<media-menu-content class="media-menu-content" id="vjs-pnYuA7i8-0-content">
+<media-menu-content class="media-menu-content" id="vjs-fVL6fVBf-0-content">
 <media-menu-item class="media-menu-back-item">
 <media-icon name="chevron" class="media-menu-back-chevron">
 </media-icon>
@@ -272,49 +272,49 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 </media-menu>
 </media-controls-group>
 <media-controls-group class="video-controls-secondary">
-<media-cast-button class="media-button media-cast-button" id="vjs-QuClibja-0-5-trigger">
+<media-cast-button class="media-button media-cast-button" id="vjs-iSAklLIk-0-5-trigger">
 <media-icon name="cast-enter" class="media-button-icon media-cast-button-enter-icon">
 </media-icon>
 <media-icon name="cast-exit" class="media-button-icon media-cast-button-exit-icon">
 </media-icon>
 </media-cast-button>
-<media-tooltip trigger="vjs-QuClibja-0-5-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-iSAklLIk-0-5-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">
 </media-tooltip-shortcut>
 </media-tooltip>
-<media-airplay-button class="media-button media-airplay-button" id="vjs-QuClibja-0-6-trigger">
+<media-airplay-button class="media-button media-airplay-button" id="vjs-iSAklLIk-0-6-trigger">
 <media-icon name="airplay-enter" class="media-button-icon media-airplay-button-enter-icon">
 </media-icon>
 <media-icon name="airplay-exit" class="media-button-icon media-airplay-button-exit-icon">
 </media-icon>
 </media-airplay-button>
-<media-tooltip trigger="vjs-QuClibja-0-6-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-iSAklLIk-0-6-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">
 </media-tooltip-shortcut>
 </media-tooltip>
-<media-pip-button class="media-button media-pip-button" id="vjs-QuClibja-0-7-trigger">
+<media-pip-button class="media-button media-pip-button" id="vjs-iSAklLIk-0-7-trigger">
 <media-icon name="pip-enter" class="media-button-icon media-pip-button-enter-icon">
 </media-icon>
 <media-icon name="pip-exit" class="media-button-icon media-pip-button-exit-icon">
 </media-icon>
 </media-pip-button>
-<media-tooltip trigger="vjs-QuClibja-0-7-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-iSAklLIk-0-7-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">
 </media-tooltip-shortcut>
 </media-tooltip>
-<media-fullscreen-button class="media-button media-fullscreen-button" id="vjs-QuClibja-0-8-trigger">
+<media-fullscreen-button class="media-button media-fullscreen-button" id="vjs-iSAklLIk-0-8-trigger">
 <media-icon name="fullscreen-enter" class="media-button-icon media-fullscreen-button-enter-icon">
 </media-icon>
 <media-icon name="fullscreen-exit" class="media-button-icon media-fullscreen-button-exit-icon">
 </media-icon>
 </media-fullscreen-button>
-<media-tooltip trigger="vjs-QuClibja-0-8-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-iSAklLIk-0-8-trigger" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">

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

@@ -1 +1 @@
-{"version":3,"file":"template.js","names":[],"sources":["../../../../../src/internal/skins/default-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 video-skin\" data-theme=\"default\" 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-buffering-indicator class=\"media-buffering-indicator\">\n<media-icon name=\"spinner\" class=\"media-buffering-indicator-spinner-icon\">\n</media-icon>\n</media-buffering-indicator>\n<media-error-dialog class=\"media-dialog-root\">\n<media-dialog-backdrop class=\"media-dialog-backdrop\">\n</media-dialog-backdrop>\n<media-dialog-popup class=\"media-dialog-popup\">\n<div class=\"media-dialog-content\">\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</div>\n<div class=\"media-dialog-actions\">\n<media-dialog-close class=\"media-button media-dialog-close\">\n</media-dialog-close>\n</div>\n</media-dialog-popup>\n</media-error-dialog>\n<media-title class=\"media-title\">\n</media-title>\n<media-controls>\n<media-controls-backdrop class=\"video-controls-backdrop\">\n</media-controls-backdrop>\n<media-controls-content class=\"video-controls video-controls-content\">\n<media-tooltip-group>\n<media-controls-group class=\"video-controls-primary\">\n<media-play-button class=\"media-button media-play-button\" id=\"vjs-QuClibja-0-trigger\">\n<media-icon name=\"restart\" class=\"media-button-icon media-play-button-restart-icon\">\n</media-icon>\n<media-icon name=\"play\" class=\"media-button-icon media-play-button-play-icon\">\n</media-icon>\n<media-icon name=\"pause\" class=\"media-button-icon media-play-button-pause-icon\">\n</media-icon>\n</media-play-button>\n<media-tooltip trigger=\"vjs-QuClibja-0-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-OetjWaXX-0-popup\" class=\"media-button media-mute-button video-controls-volume-button\" id=\"vjs-QuClibja-0-2-trigger\">\n<media-icon name=\"volume-off\" class=\"media-button-icon media-mute-button-off-icon\">\n</media-icon>\n<media-icon name=\"volume-low\" class=\"media-button-icon media-mute-button-low-icon\">\n</media-icon>\n<media-icon name=\"volume-high\" class=\"media-button-icon media-mute-button-high-icon\">\n</media-icon>\n</media-mute-button>\n<media-tooltip trigger=\"vjs-QuClibja-0-2-trigger\" delay=\"0\" disabled sticky side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-popup-transition media-popup-surface media-volume-popover\" id=\"vjs-OetjWaXX-0-popup\">\n<media-volume-slider class=\"media-slider media-volume-slider\" thumb-alignment=\"edge\" orientation=\"vertical\">\n<media-slider-track class=\"media-slider-track\">\n<media-slider-fill class=\"media-slider-fill\">\n</media-slider-fill>\n</media-slider-track>\n<media-slider-thumb class=\"media-slider-thumb media-volume-slider-thumb\">\n</media-slider-thumb>\n</media-volume-slider>\n</media-volume-popover>\n<media-controls-group class=\"video-time-slider-group\">\n<media-time class=\"media-time-value video-time-value\" type=\"current\">\n</media-time>\n<media-time-slider class=\"media-slider media-time-slider\">\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-slider-track media-time-slider-chapter-track\">\n<media-slider-buffer class=\"media-slider-buffer media-time-slider-chapter-layer\">\n</media-slider-buffer>\n<media-slider-fill class=\"media-slider-fill media-time-slider-chapter-layer\">\n</media-slider-fill>\n</media-slider-track>\n</div>\n</template>\n</media-time-slider-chapters>\n<media-slider-thumb class=\"media-slider-thumb media-time-slider-thumb\">\n</media-slider-thumb>\n<media-slider-preview class=\"media-slider-preview\" overflow=\"visible\">\n<media-slider-thumbnail class=\"media-slider-preview-content media-popup-surface media-slider-thumbnail\">\n<slot name=\"thumbnail\">\n<img alt=\"\" aria-hidden=\"true\" decoding=\"async\" class=\"media-slider-thumbnail-image\">\n</slot>\n<media-icon name=\"spinner\" class=\"media-slider-thumbnail-spinner-icon\">\n</media-icon>\n</media-slider-thumbnail>\n<div class=\"media-slider-preview-content media-time-slider-preview-content\">\n<media-time-slider-chapter-title class=\"media-time-slider-chapter-title\">\n</media-time-slider-chapter-title>\n<media-slider-value class=\"media-time-slider-value\" type=\"pointer\">\n</media-slider-value>\n</div>\n</media-slider-preview>\n</media-time-slider>\n<media-time class=\"media-time-toggle video-time-value\" type=\"remaining\" toggle>\n</media-time>\n</media-controls-group>\n<media-captions-button class=\"media-button media-captions-button video-controls-captions-button\" id=\"vjs-QuClibja-0-3-trigger\">\n<media-icon name=\"captions-off\" class=\"media-button-icon media-captions-button-off-icon\">\n</media-icon>\n<media-icon name=\"captions-on\" class=\"media-button-icon media-captions-button-on-icon\">\n</media-icon>\n</media-captions-button>\n<media-tooltip trigger=\"vjs-QuClibja-0-3-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-oFdCBVms-0-popup\" class=\"media-button media-settings-menu-trigger video-controls-settings-button\" id=\"vjs-QuClibja-0-4-trigger\">\n<media-icon name=\"gear\" class=\"media-button-icon-base media-settings-menu-trigger-icon\">\n</media-icon>\n<media-text class=\"media-settings-menu-trigger-label\" token=\"menu.settings\">Settings</media-text>\n</button>\n<media-tooltip trigger=\"vjs-QuClibja-0-4-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\n<media-text token=\"menu.settings\">Settings</media-text>\n</media-tooltip>\n<media-menu side=\"top\" align=\"center\" class=\"media-popup media-popup-surface media-menu-popup media-menu-resizable-popup\" id=\"vjs-oFdCBVms-0-popup\">\n<media-menu-content class=\"media-menu-content\">\n<media-menu-item commandfor=\"vjs-moIPS8Sb-0-content\" class=\"media-menu-trigger-item\">\n<media-icon name=\"switches\" class=\"media-menu-trigger-item-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 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-moIPS8Sb-0-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon 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-item-indicator\">\n<media-icon name=\"check\" class=\"media-menu-radio-item-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-rgOMyneB-0-content\" class=\"media-menu-trigger-item\">\n<media-icon name=\"speech\" class=\"media-menu-trigger-item-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 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-rgOMyneB-0-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon 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-item-indicator\">\n<media-icon name=\"check\" class=\"media-menu-radio-item-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-Uj2fjhhP-0-content\" class=\"media-menu-trigger-item\">\n<media-icon name=\"speed\" class=\"media-menu-trigger-item-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 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-Uj2fjhhP-0-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon 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-item-indicator\">\n<media-icon name=\"check\" class=\"media-menu-radio-item-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-pnYuA7i8-0-content\" class=\"media-menu-trigger-item\">\n<media-icon name=\"captions-off\" class=\"media-menu-trigger-item-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 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-pnYuA7i8-0-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon 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-item-indicator\">\n<media-icon name=\"check\" class=\"media-menu-radio-item-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 class=\"video-controls-secondary\">\n<media-cast-button class=\"media-button media-cast-button\" id=\"vjs-QuClibja-0-5-trigger\">\n<media-icon name=\"cast-enter\" class=\"media-button-icon media-cast-button-enter-icon\">\n</media-icon>\n<media-icon name=\"cast-exit\" class=\"media-button-icon media-cast-button-exit-icon\">\n</media-icon>\n</media-cast-button>\n<media-tooltip trigger=\"vjs-QuClibja-0-5-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-airplay-button class=\"media-button media-airplay-button\" id=\"vjs-QuClibja-0-6-trigger\">\n<media-icon name=\"airplay-enter\" class=\"media-button-icon media-airplay-button-enter-icon\">\n</media-icon>\n<media-icon name=\"airplay-exit\" class=\"media-button-icon media-airplay-button-exit-icon\">\n</media-icon>\n</media-airplay-button>\n<media-tooltip trigger=\"vjs-QuClibja-0-6-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-QuClibja-0-7-trigger\">\n<media-icon name=\"pip-enter\" class=\"media-button-icon media-pip-button-enter-icon\">\n</media-icon>\n<media-icon name=\"pip-exit\" class=\"media-button-icon media-pip-button-exit-icon\">\n</media-icon>\n</media-pip-button>\n<media-tooltip trigger=\"vjs-QuClibja-0-7-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-QuClibja-0-8-trigger\">\n<media-icon name=\"fullscreen-enter\" class=\"media-button-icon media-fullscreen-button-enter-icon\">\n</media-icon>\n<media-icon name=\"fullscreen-exit\" class=\"media-button-icon media-fullscreen-button-exit-icon\">\n</media-icon>\n</media-fullscreen-button>\n<media-tooltip trigger=\"vjs-QuClibja-0-8-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-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 class=\"video-status-indicators\">\n<media-volume-indicator class=\"media-indicator media-volume-indicator\">\n<media-volume-indicator-fill class=\"media-indicator-content media-volume-indicator-fill\">\n<media-icon name=\"volume-high\" class=\"media-volume-indicator-high-icon\">\n</media-icon>\n<media-icon name=\"volume-low\" class=\"media-volume-indicator-low-icon\">\n</media-icon>\n<media-icon name=\"volume-off\" class=\"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<div class=\"media-indicator-content media-status-indicator-content\">\n<media-icon name=\"captions-on\" class=\"media-status-indicator-captions-on-icon\">\n</media-icon>\n<media-icon name=\"captions-off\" class=\"media-status-indicator-captions-off-icon\">\n</media-icon>\n<media-icon name=\"fullscreen-enter\" class=\"media-status-indicator-fullscreen-enter-icon\">\n</media-icon>\n<media-icon name=\"fullscreen-exit\" class=\"media-status-indicator-fullscreen-exit-icon\">\n</media-icon>\n<media-icon name=\"pip-enter\" class=\"media-status-indicator-pip-enter-icon\">\n</media-icon>\n<media-icon name=\"pip-exit\" class=\"media-status-indicator-pip-exit-icon\">\n</media-icon>\n<media-status-indicator-value class=\"media-status-indicator-value\">\n</media-status-indicator-value>\n</div>\n</media-status-indicator>\n<media-seek-indicator class=\"media-seek-indicator\">\n<media-icon 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<media-status-indicator actions=\"togglePaused\" class=\"media-playback-status-indicator\">\n<media-icon name=\"play\" class=\"media-playback-status-indicator-play-icon\">\n</media-icon>\n<media-icon name=\"pause\" class=\"media-playback-status-indicator-pause-icon\">\n</media-icon>\n</media-status-indicator>\n</div>\n</media-container>`);\n"],"mappings":";;;AAGA,MAAa,WACX,eAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBA6ZT"}
+{"version":3,"file":"template.js","names":[],"sources":["../../../../../src/internal/skins/default-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 video-skin\" data-theme=\"default\" 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-buffering-indicator class=\"media-buffering-indicator\">\n<media-icon name=\"spinner\" class=\"media-buffering-indicator-spinner-icon\">\n</media-icon>\n</media-buffering-indicator>\n<media-error-dialog class=\"media-dialog-root\">\n<media-dialog-backdrop class=\"media-dialog-backdrop\">\n</media-dialog-backdrop>\n<media-dialog-popup class=\"media-dialog-popup\">\n<div class=\"media-dialog-content\">\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</div>\n<div class=\"media-dialog-actions\">\n<media-dialog-close class=\"media-button media-dialog-close\">\n</media-dialog-close>\n</div>\n</media-dialog-popup>\n</media-error-dialog>\n<media-title class=\"media-title\">\n</media-title>\n<media-controls>\n<media-controls-backdrop class=\"video-controls-backdrop\">\n</media-controls-backdrop>\n<media-controls-content class=\"video-controls video-controls-content\">\n<media-tooltip-group>\n<media-controls-group class=\"video-controls-primary\">\n<media-play-button class=\"media-button media-play-button\" id=\"vjs-iSAklLIk-0-trigger\">\n<media-icon name=\"restart\" class=\"media-button-icon media-play-button-restart-icon\">\n</media-icon>\n<media-icon name=\"play\" class=\"media-button-icon media-play-button-play-icon\">\n</media-icon>\n<media-icon name=\"pause\" class=\"media-button-icon media-play-button-pause-icon\">\n</media-icon>\n</media-play-button>\n<media-tooltip trigger=\"vjs-iSAklLIk-0-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-F3QfBzzz-0-popup\" class=\"media-button media-mute-button video-controls-volume-button\" id=\"vjs-iSAklLIk-0-2-trigger\">\n<media-icon name=\"volume-off\" class=\"media-button-icon media-mute-button-off-icon\">\n</media-icon>\n<media-icon name=\"volume-low\" class=\"media-button-icon media-mute-button-low-icon\">\n</media-icon>\n<media-icon name=\"volume-high\" class=\"media-button-icon media-mute-button-high-icon\">\n</media-icon>\n</media-mute-button>\n<media-tooltip trigger=\"vjs-iSAklLIk-0-2-trigger\" delay=\"0\" disabled sticky side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-popup-transition media-popup-surface media-volume-popover\" id=\"vjs-F3QfBzzz-0-popup\">\n<media-volume-slider class=\"media-slider media-volume-slider\" thumb-alignment=\"edge\" orientation=\"vertical\">\n<media-slider-track class=\"media-slider-track\">\n<media-slider-fill class=\"media-slider-fill\">\n</media-slider-fill>\n</media-slider-track>\n<media-slider-thumb class=\"media-slider-thumb media-volume-slider-thumb\">\n</media-slider-thumb>\n</media-volume-slider>\n</media-volume-popover>\n<media-controls-group class=\"video-time-slider-group\">\n<media-time class=\"media-time-value video-time-value\" type=\"current\">\n</media-time>\n<media-time-slider class=\"media-slider media-time-slider\">\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-slider-track media-time-slider-chapter-track\">\n<media-slider-buffer class=\"media-slider-buffer media-time-slider-chapter-layer\">\n</media-slider-buffer>\n<media-slider-fill class=\"media-slider-fill media-time-slider-chapter-layer\">\n</media-slider-fill>\n</media-slider-track>\n</div>\n</template>\n</media-time-slider-chapters>\n<media-slider-thumb class=\"media-slider-thumb media-time-slider-thumb\">\n</media-slider-thumb>\n<media-slider-preview class=\"media-slider-preview\" overflow=\"visible\">\n<media-slider-thumbnail class=\"media-slider-preview-content media-popup-surface media-slider-thumbnail\">\n<slot name=\"thumbnail\">\n<img alt=\"\" aria-hidden=\"true\" decoding=\"async\" class=\"media-slider-thumbnail-image\">\n</slot>\n<media-icon name=\"spinner\" class=\"media-slider-thumbnail-spinner-icon\">\n</media-icon>\n</media-slider-thumbnail>\n<div class=\"media-slider-preview-content media-time-slider-preview-content\">\n<media-time-slider-chapter-title class=\"media-time-slider-chapter-title\">\n</media-time-slider-chapter-title>\n<media-slider-value class=\"media-time-slider-value\" type=\"pointer\">\n</media-slider-value>\n</div>\n</media-slider-preview>\n</media-time-slider>\n<media-time class=\"media-time-toggle video-time-value\" type=\"remaining\" toggle>\n</media-time>\n</media-controls-group>\n<media-captions-button class=\"media-button media-captions-button video-controls-captions-button\" id=\"vjs-iSAklLIk-0-3-trigger\">\n<media-icon name=\"captions-off\" class=\"media-button-icon media-captions-button-off-icon\">\n</media-icon>\n<media-icon name=\"captions-on\" class=\"media-button-icon media-captions-button-on-icon\">\n</media-icon>\n</media-captions-button>\n<media-tooltip trigger=\"vjs-iSAklLIk-0-3-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-28BtKs3v-0-popup\" class=\"media-button media-settings-menu-trigger video-controls-settings-button\" id=\"vjs-iSAklLIk-0-4-trigger\">\n<media-icon name=\"gear\" class=\"media-button-icon-base media-settings-menu-trigger-icon\">\n</media-icon>\n<media-text class=\"media-settings-menu-trigger-label\" token=\"menu.settings\">Settings</media-text>\n</button>\n<media-tooltip trigger=\"vjs-iSAklLIk-0-4-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\n<media-text token=\"menu.settings\">Settings</media-text>\n</media-tooltip>\n<media-menu side=\"top\" align=\"center\" class=\"media-popup media-popup-surface media-menu-popup media-menu-resizable-popup\" id=\"vjs-28BtKs3v-0-popup\">\n<media-menu-content class=\"media-menu-content\">\n<media-menu-item commandfor=\"vjs-ZGpCKm5h-0-content\" class=\"media-menu-trigger-item\">\n<media-icon name=\"switches\" class=\"media-menu-trigger-item-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 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-ZGpCKm5h-0-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon 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-item-indicator\">\n<media-icon name=\"check\" class=\"media-menu-radio-item-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-rPcYSc7i-0-content\" class=\"media-menu-trigger-item\">\n<media-icon name=\"speech\" class=\"media-menu-trigger-item-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 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-rPcYSc7i-0-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon 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-item-indicator\">\n<media-icon name=\"check\" class=\"media-menu-radio-item-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-8B_qQK6x-0-content\" class=\"media-menu-trigger-item\">\n<media-icon name=\"speed\" class=\"media-menu-trigger-item-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 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-8B_qQK6x-0-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon 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-item-indicator\">\n<media-icon name=\"check\" class=\"media-menu-radio-item-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-fVL6fVBf-0-content\" class=\"media-menu-trigger-item\">\n<media-icon name=\"captions-off\" class=\"media-menu-trigger-item-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 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-fVL6fVBf-0-content\">\n<media-menu-item class=\"media-menu-back-item\">\n<media-icon 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-item-indicator\">\n<media-icon name=\"check\" class=\"media-menu-radio-item-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 class=\"video-controls-secondary\">\n<media-cast-button class=\"media-button media-cast-button\" id=\"vjs-iSAklLIk-0-5-trigger\">\n<media-icon name=\"cast-enter\" class=\"media-button-icon media-cast-button-enter-icon\">\n</media-icon>\n<media-icon name=\"cast-exit\" class=\"media-button-icon media-cast-button-exit-icon\">\n</media-icon>\n</media-cast-button>\n<media-tooltip trigger=\"vjs-iSAklLIk-0-5-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-airplay-button class=\"media-button media-airplay-button\" id=\"vjs-iSAklLIk-0-6-trigger\">\n<media-icon name=\"airplay-enter\" class=\"media-button-icon media-airplay-button-enter-icon\">\n</media-icon>\n<media-icon name=\"airplay-exit\" class=\"media-button-icon media-airplay-button-exit-icon\">\n</media-icon>\n</media-airplay-button>\n<media-tooltip trigger=\"vjs-iSAklLIk-0-6-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-iSAklLIk-0-7-trigger\">\n<media-icon name=\"pip-enter\" class=\"media-button-icon media-pip-button-enter-icon\">\n</media-icon>\n<media-icon name=\"pip-exit\" class=\"media-button-icon media-pip-button-exit-icon\">\n</media-icon>\n</media-pip-button>\n<media-tooltip trigger=\"vjs-iSAklLIk-0-7-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-iSAklLIk-0-8-trigger\">\n<media-icon name=\"fullscreen-enter\" class=\"media-button-icon media-fullscreen-button-enter-icon\">\n</media-icon>\n<media-icon name=\"fullscreen-exit\" class=\"media-button-icon media-fullscreen-button-exit-icon\">\n</media-icon>\n</media-fullscreen-button>\n<media-tooltip trigger=\"vjs-iSAklLIk-0-8-trigger\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-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 class=\"video-status-indicators\">\n<media-volume-indicator class=\"media-indicator media-volume-indicator\">\n<media-volume-indicator-fill class=\"media-indicator-content media-volume-indicator-fill\">\n<media-icon name=\"volume-high\" class=\"media-volume-indicator-high-icon\">\n</media-icon>\n<media-icon name=\"volume-low\" class=\"media-volume-indicator-low-icon\">\n</media-icon>\n<media-icon name=\"volume-off\" class=\"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<div class=\"media-indicator-content media-status-indicator-content\">\n<media-icon name=\"captions-on\" class=\"media-status-indicator-captions-on-icon\">\n</media-icon>\n<media-icon name=\"captions-off\" class=\"media-status-indicator-captions-off-icon\">\n</media-icon>\n<media-icon name=\"fullscreen-enter\" class=\"media-status-indicator-fullscreen-enter-icon\">\n</media-icon>\n<media-icon name=\"fullscreen-exit\" class=\"media-status-indicator-fullscreen-exit-icon\">\n</media-icon>\n<media-icon name=\"pip-enter\" class=\"media-status-indicator-pip-enter-icon\">\n</media-icon>\n<media-icon name=\"pip-exit\" class=\"media-status-indicator-pip-exit-icon\">\n</media-icon>\n<media-status-indicator-value class=\"media-status-indicator-value\">\n</media-status-indicator-value>\n</div>\n</media-status-indicator>\n<media-seek-indicator class=\"media-seek-indicator\">\n<media-icon 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<media-status-indicator actions=\"togglePaused\" class=\"media-playback-status-indicator\">\n<media-icon name=\"play\" class=\"media-playback-status-indicator-play-icon\">\n</media-icon>\n<media-icon name=\"pause\" class=\"media-playback-status-indicator-pause-icon\">\n</media-icon>\n</media-status-indicator>\n</div>\n</media-container>`);\n"],"mappings":";;;AAGA,MAAa,WACX,eAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBA6ZT"}

package/dist/dev/internal/skins/neutral-audio/register.d.ts

@@ -6,6 +6,7 @@ import "../../../define/ui/dialog-title.js";
 import "../../../define/ui/dialog-description.js";
 import "../../../define/ui/dialog-close.js";
 import "../../../define/ui/controls.js";
+import "../../../define/ui/buffering-indicator.js";
 import "../../../define/ui/controls-content.js";
 import "../../../define/ui/tooltip-group.js";
 import "../../../define/ui/time-slider.js";
@@ -34,5 +35,4 @@ import "../../../define/ui/mute-button.js";
 import "../../../define/ui/volume-popover.js";
 import "../../../define/ui/volume-slider.js";
 import "../../../define/ui/hotkey.js";
-import "../../../define/ui/status-announcer.js";
-import "../../../define/ui/buffering-indicator.js";
+import "../../../define/ui/status-announcer.js";

package/dist/dev/internal/skins/neutral-audio/template.js

@@ -29,7 +29,7 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 <media-icon family="neutral" name="spinner" class="media-buffering-indicator-spinner-icon">
 </media-icon>
 </media-buffering-indicator>
-<media-play-button class="media-button media-play-button" id="vjs-nAo4ezjf-0-trigger">
+<media-play-button class="media-button media-play-button" id="vjs-W_MfTVYB-0-trigger">
 <media-icon family="neutral" name="restart" class="media-button-icon media-play-button-restart-icon">
 </media-icon>
 <media-icon family="neutral" name="play" class="media-button-icon media-play-button-play-icon">
@@ -37,34 +37,34 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 <media-icon family="neutral" name="pause" class="media-button-icon media-play-button-pause-icon">
 </media-icon>
 </media-play-button>
-<media-tooltip trigger="vjs-nAo4ezjf-0-trigger" boundary="viewport" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-W_MfTVYB-0-trigger" boundary="viewport" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">
 </media-tooltip-shortcut>
 </media-tooltip>
 </div>
-<media-seek-button seconds="-10" class="media-button media-seek-button" id="vjs-nAo4ezjf-0-2-trigger">
+<media-seek-button seconds="-10" class="media-button media-seek-button" id="vjs-W_MfTVYB-0-2-trigger">
 <div class="media-seek-button-content">
 <media-icon family="neutral" name="seek" class="media-button-icon media-seek-button-backward-icon">
 </media-icon>
 <span class="media-seek-button-label media-seek-button-backward-label">10</span>
 </div>
 </media-seek-button>
-<media-tooltip trigger="vjs-nAo4ezjf-0-2-trigger" boundary="viewport" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-W_MfTVYB-0-2-trigger" boundary="viewport" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">
 </media-tooltip-shortcut>
 </media-tooltip>
-<media-seek-button seconds="10" class="media-button media-seek-button" id="vjs-nAo4ezjf-0-3-trigger">
+<media-seek-button seconds="10" class="media-button media-seek-button" id="vjs-W_MfTVYB-0-3-trigger">
 <div class="media-seek-button-content">
 <media-icon family="neutral" name="seek" class="media-button-icon">
 </media-icon>
 <span class="media-seek-button-label media-seek-button-forward-label">10</span>
 </div>
 </media-seek-button>
-<media-tooltip trigger="vjs-nAo4ezjf-0-3-trigger" boundary="viewport" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-W_MfTVYB-0-3-trigger" boundary="viewport" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">
@@ -98,7 +98,7 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 </media-time-slider>
 </media-controls-group>
 <media-controls-group class="audio-controls-end">
-<media-mute-button commandfor="vjs-IMkbfqkS-0-popup" class="media-button media-mute-button" id="vjs-nAo4ezjf-0-4-trigger">
+<media-mute-button commandfor="vjs-4kthzEOq-0-popup" class="media-button media-mute-button" id="vjs-W_MfTVYB-0-4-trigger">
 <media-icon family="neutral" name="volume-off" class="media-button-icon media-mute-button-off-icon">
 </media-icon>
 <media-icon family="neutral" name="volume-low" class="media-button-icon media-mute-button-low-icon">
@@ -106,13 +106,13 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 <media-icon family="neutral" name="volume-high" class="media-button-icon media-mute-button-high-icon">
 </media-icon>
 </media-mute-button>
-<media-tooltip trigger="vjs-nAo4ezjf-0-4-trigger" delay="0" sticky side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-W_MfTVYB-0-4-trigger" delay="0" sticky side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">
 </media-tooltip-shortcut>
 </media-tooltip>
-<media-volume-popover open-on-hover delay="200" close-delay="100" side="left" boundary="viewport" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-volume-popover" id="vjs-IMkbfqkS-0-popup">
+<media-volume-popover open-on-hover delay="200" close-delay="100" side="left" boundary="viewport" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-volume-popover" id="vjs-4kthzEOq-0-popup">
 <media-volume-slider class="media-slider media-volume-slider" thumb-alignment="edge" orientation="horizontal">
 <media-slider-track class="media-slider-track">
 <media-slider-fill class="media-slider-fill">
@@ -122,15 +122,15 @@ const template = createTemplate(`<media-container class="media-skin media-contai
 </media-slider-thumb>
 </media-volume-slider>
 </media-volume-popover>
-<media-playback-rate-button commandfor="vjs-Dapd3-W_-0-popup" class="media-button media-playback-rate-button" id="vjs-nAo4ezjf-0-5-trigger">
+<media-playback-rate-button commandfor="vjs-ALt053S7-0-popup" class="media-button media-playback-rate-button" id="vjs-W_MfTVYB-0-5-trigger">
 </media-playback-rate-button>
-<media-tooltip trigger="vjs-nAo4ezjf-0-5-trigger" boundary="viewport" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
+<media-tooltip trigger="vjs-W_MfTVYB-0-5-trigger" boundary="viewport" side="top" class="media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip">
 <media-tooltip-label>
 </media-tooltip-label>
 <media-tooltip-shortcut class="media-tooltip-shortcut">
 </media-tooltip-shortcut>
 </media-tooltip>
-<media-menu side="top" align="center" boundary="viewport" class="media-popup media-popup-surface media-menu-popup audio-settings-menu-popup" id="vjs-Dapd3-W_-0-popup">
+<media-menu side="top" align="center" boundary="viewport" class="media-popup media-popup-surface media-menu-popup audio-settings-menu-popup" id="vjs-ALt053S7-0-popup">
 <media-menu-content class="media-menu-content">
 <media-playback-rate-radio-group class="media-menu-radio-group">
 <template>

package/dist/dev/internal/skins/neutral-audio/template.js.map

@@ -1 +1 @@
-{"version":3,"file":"template.js","names":[],"sources":["../../../../../src/internal/skins/neutral-audio/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 audio-skin\" data-theme=\"neutral\" data-preset=\"audio\">\n<slot>\n</slot>\n<media-error-dialog class=\"audio-dialog-root\">\n<media-dialog-backdrop class=\"audio-dialog-backdrop\">\n</media-dialog-backdrop>\n<media-dialog-popup class=\"audio-dialog-popup\">\n<div class=\"audio-dialog-content\">\n<media-dialog-title class=\"audio-dialog-title\">\n</media-dialog-title>\n<media-dialog-description class=\"audio-dialog-description\">\n</media-dialog-description>\n</div>\n<div class=\"audio-dialog-actions\">\n<media-dialog-close class=\"media-button audio-dialog-close\">\n</media-dialog-close>\n</div>\n</media-dialog-popup>\n</media-error-dialog>\n<media-controls visibility=\"always\">\n<media-controls-content class=\"audio-controls audio-controls-content\">\n<media-tooltip-group>\n<media-controls-group class=\"audio-controls-start\">\n<div class=\"audio-play-button\">\n<media-buffering-indicator class=\"media-buffering-indicator audio-play-button-buffering-indicator\">\n<media-icon family=\"neutral\" name=\"spinner\" class=\"media-buffering-indicator-spinner-icon\">\n</media-icon>\n</media-buffering-indicator>\n<media-play-button class=\"media-button media-play-button\" id=\"vjs-nAo4ezjf-0-trigger\">\n<media-icon family=\"neutral\" name=\"restart\" class=\"media-button-icon media-play-button-restart-icon\">\n</media-icon>\n<media-icon family=\"neutral\" name=\"play\" class=\"media-button-icon media-play-button-play-icon\">\n</media-icon>\n<media-icon family=\"neutral\" name=\"pause\" class=\"media-button-icon media-play-button-pause-icon\">\n</media-icon>\n</media-play-button>\n<media-tooltip trigger=\"vjs-nAo4ezjf-0-trigger\" boundary=\"viewport\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n</div>\n<media-seek-button seconds=\"-10\" class=\"media-button media-seek-button\" id=\"vjs-nAo4ezjf-0-2-trigger\">\n<div class=\"media-seek-button-content\">\n<media-icon family=\"neutral\" name=\"seek\" class=\"media-button-icon media-seek-button-backward-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-nAo4ezjf-0-2-trigger\" boundary=\"viewport\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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 media-seek-button\" id=\"vjs-nAo4ezjf-0-3-trigger\">\n<div class=\"media-seek-button-content\">\n<media-icon family=\"neutral\" name=\"seek\" class=\"media-button-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-nAo4ezjf-0-3-trigger\" boundary=\"viewport\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-controls-group class=\"audio-time-slider-group\">\n<media-time-group class=\"media-time-group\">\n<media-time class=\"media-time-toggle media-time-current-value\" type=\"current\" toggle>\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-time-slider class=\"media-slider audio-time-slider\">\n<media-slider-track class=\"media-slider-track\">\n<media-slider-buffer class=\"media-slider-buffer\">\n</media-slider-buffer>\n<media-slider-fill class=\"media-slider-fill\">\n</media-slider-fill>\n</media-slider-track>\n<media-slider-thumb class=\"media-slider-thumb audio-time-slider-thumb\">\n</media-slider-thumb>\n<media-slider-preview class=\"media-slider-preview\" overflow=\"clamp\">\n<div class=\"media-slider-preview-content media-popup-surface media-tooltip audio-time-slider-preview-content\">\n<media-slider-value class=\"audio-time-slider-value\" type=\"pointer\">\n</media-slider-value>\n</div>\n</media-slider-preview>\n</media-time-slider>\n</media-controls-group>\n<media-controls-group class=\"audio-controls-end\">\n<media-mute-button commandfor=\"vjs-IMkbfqkS-0-popup\" class=\"media-button media-mute-button\" id=\"vjs-nAo4ezjf-0-4-trigger\">\n<media-icon family=\"neutral\" name=\"volume-off\" class=\"media-button-icon media-mute-button-off-icon\">\n</media-icon>\n<media-icon family=\"neutral\" name=\"volume-low\" class=\"media-button-icon media-mute-button-low-icon\">\n</media-icon>\n<media-icon family=\"neutral\" name=\"volume-high\" class=\"media-button-icon media-mute-button-high-icon\">\n</media-icon>\n</media-mute-button>\n<media-tooltip trigger=\"vjs-nAo4ezjf-0-4-trigger\" delay=\"0\" sticky side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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=\"left\" boundary=\"viewport\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-volume-popover\" id=\"vjs-IMkbfqkS-0-popup\">\n<media-volume-slider class=\"media-slider media-volume-slider\" thumb-alignment=\"edge\" orientation=\"horizontal\">\n<media-slider-track class=\"media-slider-track\">\n<media-slider-fill class=\"media-slider-fill\">\n</media-slider-fill>\n</media-slider-track>\n<media-slider-thumb class=\"media-slider-thumb media-volume-slider-thumb\">\n</media-slider-thumb>\n</media-volume-slider>\n</media-volume-popover>\n<media-playback-rate-button commandfor=\"vjs-Dapd3-W_-0-popup\" class=\"media-button media-playback-rate-button\" id=\"vjs-nAo4ezjf-0-5-trigger\">\n</media-playback-rate-button>\n<media-tooltip trigger=\"vjs-nAo4ezjf-0-5-trigger\" boundary=\"viewport\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-menu side=\"top\" align=\"center\" boundary=\"viewport\" class=\"media-popup media-popup-surface media-menu-popup audio-settings-menu-popup\" id=\"vjs-Dapd3-W_-0-popup\">\n<media-menu-content class=\"media-menu-content\">\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-item-indicator\">\n<media-icon family=\"neutral\" name=\"check\" class=\"media-menu-radio-item-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>\n</media-controls-group>\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-status-announcer class=\"media-status-announcer\">\n</media-status-announcer>\n</media-container>`);\n"],"mappings":";;;AAGA,MAAa,WACX,eAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBAmLT"}
+{"version":3,"file":"template.js","names":[],"sources":["../../../../../src/internal/skins/neutral-audio/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 audio-skin\" data-theme=\"neutral\" data-preset=\"audio\">\n<slot>\n</slot>\n<media-error-dialog class=\"audio-dialog-root\">\n<media-dialog-backdrop class=\"audio-dialog-backdrop\">\n</media-dialog-backdrop>\n<media-dialog-popup class=\"audio-dialog-popup\">\n<div class=\"audio-dialog-content\">\n<media-dialog-title class=\"audio-dialog-title\">\n</media-dialog-title>\n<media-dialog-description class=\"audio-dialog-description\">\n</media-dialog-description>\n</div>\n<div class=\"audio-dialog-actions\">\n<media-dialog-close class=\"media-button audio-dialog-close\">\n</media-dialog-close>\n</div>\n</media-dialog-popup>\n</media-error-dialog>\n<media-controls visibility=\"always\">\n<media-controls-content class=\"audio-controls audio-controls-content\">\n<media-tooltip-group>\n<media-controls-group class=\"audio-controls-start\">\n<div class=\"audio-play-button\">\n<media-buffering-indicator class=\"media-buffering-indicator audio-play-button-buffering-indicator\">\n<media-icon family=\"neutral\" name=\"spinner\" class=\"media-buffering-indicator-spinner-icon\">\n</media-icon>\n</media-buffering-indicator>\n<media-play-button class=\"media-button media-play-button\" id=\"vjs-W_MfTVYB-0-trigger\">\n<media-icon family=\"neutral\" name=\"restart\" class=\"media-button-icon media-play-button-restart-icon\">\n</media-icon>\n<media-icon family=\"neutral\" name=\"play\" class=\"media-button-icon media-play-button-play-icon\">\n</media-icon>\n<media-icon family=\"neutral\" name=\"pause\" class=\"media-button-icon media-play-button-pause-icon\">\n</media-icon>\n</media-play-button>\n<media-tooltip trigger=\"vjs-W_MfTVYB-0-trigger\" boundary=\"viewport\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\n<media-tooltip-label>\n</media-tooltip-label>\n<media-tooltip-shortcut class=\"media-tooltip-shortcut\">\n</media-tooltip-shortcut>\n</media-tooltip>\n</div>\n<media-seek-button seconds=\"-10\" class=\"media-button media-seek-button\" id=\"vjs-W_MfTVYB-0-2-trigger\">\n<div class=\"media-seek-button-content\">\n<media-icon family=\"neutral\" name=\"seek\" class=\"media-button-icon media-seek-button-backward-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-W_MfTVYB-0-2-trigger\" boundary=\"viewport\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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 media-seek-button\" id=\"vjs-W_MfTVYB-0-3-trigger\">\n<div class=\"media-seek-button-content\">\n<media-icon family=\"neutral\" name=\"seek\" class=\"media-button-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-W_MfTVYB-0-3-trigger\" boundary=\"viewport\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-controls-group class=\"audio-time-slider-group\">\n<media-time-group class=\"media-time-group\">\n<media-time class=\"media-time-toggle media-time-current-value\" type=\"current\" toggle>\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-time-slider class=\"media-slider audio-time-slider\">\n<media-slider-track class=\"media-slider-track\">\n<media-slider-buffer class=\"media-slider-buffer\">\n</media-slider-buffer>\n<media-slider-fill class=\"media-slider-fill\">\n</media-slider-fill>\n</media-slider-track>\n<media-slider-thumb class=\"media-slider-thumb audio-time-slider-thumb\">\n</media-slider-thumb>\n<media-slider-preview class=\"media-slider-preview\" overflow=\"clamp\">\n<div class=\"media-slider-preview-content media-popup-surface media-tooltip audio-time-slider-preview-content\">\n<media-slider-value class=\"audio-time-slider-value\" type=\"pointer\">\n</media-slider-value>\n</div>\n</media-slider-preview>\n</media-time-slider>\n</media-controls-group>\n<media-controls-group class=\"audio-controls-end\">\n<media-mute-button commandfor=\"vjs-4kthzEOq-0-popup\" class=\"media-button media-mute-button\" id=\"vjs-W_MfTVYB-0-4-trigger\">\n<media-icon family=\"neutral\" name=\"volume-off\" class=\"media-button-icon media-mute-button-off-icon\">\n</media-icon>\n<media-icon family=\"neutral\" name=\"volume-low\" class=\"media-button-icon media-mute-button-low-icon\">\n</media-icon>\n<media-icon family=\"neutral\" name=\"volume-high\" class=\"media-button-icon media-mute-button-high-icon\">\n</media-icon>\n</media-mute-button>\n<media-tooltip trigger=\"vjs-W_MfTVYB-0-4-trigger\" delay=\"0\" sticky side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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=\"left\" boundary=\"viewport\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-volume-popover\" id=\"vjs-4kthzEOq-0-popup\">\n<media-volume-slider class=\"media-slider media-volume-slider\" thumb-alignment=\"edge\" orientation=\"horizontal\">\n<media-slider-track class=\"media-slider-track\">\n<media-slider-fill class=\"media-slider-fill\">\n</media-slider-fill>\n</media-slider-track>\n<media-slider-thumb class=\"media-slider-thumb media-volume-slider-thumb\">\n</media-slider-thumb>\n</media-volume-slider>\n</media-volume-popover>\n<media-playback-rate-button commandfor=\"vjs-ALt053S7-0-popup\" class=\"media-button media-playback-rate-button\" id=\"vjs-W_MfTVYB-0-5-trigger\">\n</media-playback-rate-button>\n<media-tooltip trigger=\"vjs-W_MfTVYB-0-5-trigger\" boundary=\"viewport\" side=\"top\" class=\"media-popup media-popup-safe-area media-popup-transition media-popup-surface media-tooltip\">\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-menu side=\"top\" align=\"center\" boundary=\"viewport\" class=\"media-popup media-popup-surface media-menu-popup audio-settings-menu-popup\" id=\"vjs-ALt053S7-0-popup\">\n<media-menu-content class=\"media-menu-content\">\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-item-indicator\">\n<media-icon family=\"neutral\" name=\"check\" class=\"media-menu-radio-item-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>\n</media-controls-group>\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-status-announcer class=\"media-status-announcer\">\n</media-status-announcer>\n</media-container>`);\n"],"mappings":";;;AAGA,MAAa,WACX,eAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBAmLT"}

package/dist/dev/internal/skins/neutral-live-audio/register.d.ts

@@ -6,6 +6,7 @@ import "../../../define/ui/dialog-title.js";
 import "../../../define/ui/dialog-description.js";
 import "../../../define/ui/dialog-close.js";
 import "../../../define/ui/controls.js";
+import "../../../define/ui/buffering-indicator.js";
 import "../../../define/ui/controls-content.js";
 import "../../../define/ui/tooltip-group.js";
 import "../../../define/ui/slider-track.js";
@@ -21,5 +22,4 @@ import "../../../define/ui/volume-popover.js";
 import "../../../define/ui/volume-slider.js";
 import "../../../define/ui/hotkey.js";
 import "../../../define/ui/status-announcer.js";
-import "../../../define/ui/buffering-indicator.js";
 import "../../../define/ui/live-button.js";