@gcorevideo/player 2.19.15 → 2.20.1

package/dist/index.js

@@ -12459,7 +12459,7 @@ var PlaybackErrorCode;
 // license that can be found in the LICENSE file.
 const AUTO$2 = -1;
 const { now: now$2 } = Utils;
-const T$e = 'playback.dash';
+const T$f = 'playback.dash';
 // @ts-expect-error
 class DashPlayback extends HTML5Video {
     _levels = null;
@@ -12729,10 +12729,10 @@ class DashPlayback extends HTML5Video {
     }
     _onPlaybackError = (event) => {
         // TODO
-        trace(`${T$e} _onPlaybackError`, { event });
+        trace(`${T$f} _onPlaybackError`, { event });
     };
     _onDASHJSSError = (event) => {
-        trace(`${T$e} _onDASHJSSError`, { event });
+        trace(`${T$f} _onDASHJSSError`, { event });
         this._stopTimeUpdateTimer();
         // Note that the other error types are deprecated
         const e = event.error;
@@ -12767,7 +12767,7 @@ class DashPlayback extends HTML5Video {
         }
     };
     triggerError(error) {
-        trace(`${T$e} triggerError`, { error });
+        trace(`${T$f} triggerError`, { error });
         this.trigger(Events$1.PLAYBACK_ERROR, {
             ...error,
             origin: this.name,
@@ -12807,7 +12807,7 @@ class DashPlayback extends HTML5Video {
     }
     get dvrEnabled() {
         if (!this._dash) {
-            trace(`${T$e} dvrEnable no dash player instance`);
+            trace(`${T$f} dvrEnable no dash player instance`);
             return false;
         }
         return (this._dash?.getDVRWindowSize() >= this._minDvrSize &&
@@ -12829,7 +12829,7 @@ class DashPlayback extends HTML5Video {
         this.trigger(Events$1.PLAYBACK_PROGRESS, progress, {});
     }
     play() {
-        trace(`${T$e} play`, { dash: !!this._dash });
+        trace(`${T$f} play`, { dash: !!this._dash });
         if (!this._dash) {
             this._setup();
         }
@@ -41576,7 +41576,7 @@ const AUTO$1 = -1;
 const DEFAULT_RECOVER_ATTEMPTS = 16;
 Events$1.register('PLAYBACK_FRAGMENT_CHANGED');
 Events$1.register('PLAYBACK_FRAGMENT_PARSING_METADATA');
-const T$d = 'playback.hls';
+const T$e = 'playback.hls';
 // @ts-expect-error
 class HlsPlayback extends HTML5Video {
     _ccIsSetup = false;
@@ -41806,7 +41806,7 @@ class HlsPlayback extends HTML5Video {
             maxBufferLength: 2,
             maxMaxBufferLength: 4,
         }, this.options.playback.hlsjsConfig);
-        trace(`${T$d} _createHLSInstance`, { config });
+        trace(`${T$e} _createHLSInstance`, { config });
         this._hls = new Hls(config);
     }
     _attachHLSMedia() {
@@ -41895,7 +41895,7 @@ class HlsPlayback extends HTML5Video {
         }
         else {
             Log.error('hlsjs: failed to recover', { evt, data });
-            trace(`${T$d} _recover failed to recover`, {
+            trace(`${T$e} _recover failed to recover`, {
                 type: data.type,
                 details: data.details,
             });
@@ -41981,7 +41981,7 @@ class HlsPlayback extends HTML5Video {
         this.trigger(Events$1.PLAYBACK_SETTINGSUPDATE);
     }
     _onHLSJSError(evt, data) {
-        trace(`${T$d} _onHLSJSError`, {
+        trace(`${T$e} _onHLSJSError`, {
             fatal: data.fatal,
             type: data.type,
             details: data.details,
@@ -42029,7 +42029,7 @@ class HlsPlayback extends HTML5Video {
                                     evt,
                                     data,
                                 });
-                                trace(`${T$d} _onHLSJSError trying to recover from network error`, {
+                                trace(`${T$e} _onHLSJSError trying to recover from network error`, {
                                     details: data.details,
                                 });
                                 error.level = PlayerError.Levels.WARN;
@@ -42042,7 +42042,7 @@ class HlsPlayback extends HTML5Video {
                             evt,
                             data,
                         });
-                        trace(`${T$d} _onHLSJSError trying to recover from media error`, {
+                        trace(`${T$e} _onHLSJSError trying to recover from media error`, {
                             details: data.details,
                         });
                         error.level = PlayerError.Levels.WARN;
@@ -42072,7 +42072,7 @@ class HlsPlayback extends HTML5Video {
                 return;
             }
             Log.warn('hlsjs: non-fatal error occurred', { evt, data });
-            trace(`${T$d} _onHLSJSError non-fatal error occurred`, {
+            trace(`${T$e} _onHLSJSError non-fatal error occurred`, {
                 type: data.type,
                 details: data.details,
             });
@@ -42144,9 +42144,9 @@ class HlsPlayback extends HTML5Video {
     }
     play() {
         !this._hls && this._setup();
-        assert.ok(this._hls, 'Hls.js instance is not available');
         !this._manifestParsed &&
             !this.options.hlsPlayback.preload &&
+            // @ts-expect-error
             this._hls.loadSource(this.options.src);
         super.play();
         this._startTimeUpdateTimer();
@@ -42400,7 +42400,7 @@ function registerPlaybacks() {
     Loader.registerPlayback(DashPlayback);
 }
 
-const T$c = 'GPlayer';
+const T$d = 'GPlayer';
 const DEFAULT_OPTIONS = {
     autoPlay: false,
     debug: 'none',
@@ -42495,7 +42495,7 @@ class Player {
         }
         const coreOpts = this.buildCoreOptions(playerElement);
         const { core, container } = Loader.registeredPlugins;
-        trace(`${T$c} init`, {
+        trace(`${T$d} init`, {
             registeredPlaybacks: Loader.registeredPlaybacks.map((p) => p.name),
         });
         coreOpts.plugins = {
@@ -42509,7 +42509,7 @@ class Player {
      * Destroys the player, releasing all resources and unmounting its UI from the DOM.
      */
     destroy() {
-        trace(`${T$c} destroy`, {
+        trace(`${T$d} destroy`, {
             player: !!this.player,
         });
         if (this.player) {
@@ -42669,7 +42669,7 @@ class Player {
         this.config = $.extend(true, this.config, config);
     }
     initPlayer(coreOptions) {
-        trace(`${T$c} initPlayer`, {
+        trace(`${T$d} initPlayer`, {
             autoPlay: coreOptions.autoPlay,
             sources: coreOptions.sources,
             // TODO selected options
@@ -42694,7 +42694,7 @@ class Player {
         }
     }
     triggerAutoPlay() {
-        trace(`${T$c} triggerAutoPlay`);
+        trace(`${T$d} triggerAutoPlay`);
         setTimeout(() => {
             this.player?.play({
                 autoPlay: true,
@@ -42712,7 +42712,7 @@ class Player {
     // TODO test
     events = {
         onReady: () => {
-            trace(`${T$c} onReady`, {
+            trace(`${T$d} onReady`, {
                 ready: this.ready,
             });
             if (this.ready) {
@@ -42746,7 +42746,7 @@ class Player {
     buildCoreOptions(rootNode) {
         const sources = this.buildMediaSourcesList();
         const source = sources[0];
-        trace(`${T$c} buildCoreOptions`, {
+        trace(`${T$d} buildCoreOptions`, {
             source,
             sources,
         });
@@ -42805,7 +42805,7 @@ class Player {
     bindCoreListeners() {
         const core = this.player?.core;
         core?.on(Events$1.CORE_SCREEN_ORIENTATION_CHANGED, ({ orientation }) => {
-            trace(`${T$c} on CORE_SCREEN_ORIENTATION_CHANGED`, {
+            trace(`${T$d} on CORE_SCREEN_ORIENTATION_CHANGED`, {
                 orientation,
                 rootNode: {
                     width: this.rootNode?.clientWidth,
@@ -42820,14 +42820,14 @@ class Player {
             }
         }, null);
         core?.on(Events$1.CORE_RESIZE, ({ width, height }) => {
-            trace(`${T$c} on CORE_RESIZE`, {
+            trace(`${T$d} on CORE_RESIZE`, {
                 width,
                 height,
             });
             this.safeTriggerEvent(PlayerEvent.Resize, { width, height });
         }, null);
         core?.on(Events$1.CORE_FULLSCREEN, (isFullscreen) => {
-            trace(`${T$c} CORE_FULLSCREEN`, {
+            trace(`${T$d} CORE_FULLSCREEN`, {
                 isFullscreen,
             });
             this.safeTriggerEvent(PlayerEvent.Fullscreen, isFullscreen);
@@ -42835,7 +42835,7 @@ class Player {
     }
 }
 
-var version$1 = "2.19.15";
+var version$1 = "2.20.1";
 
 var packages = {
 	"node_modules/@clappr/core": {
@@ -43141,7 +43141,7 @@ const volumeOffIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fil
 
 const pluginHtml$7 = "<div class=\"big-mute-icon-wrapper\" data-big-mute>\n    <div class=\"big-mute-icon gcore-skin-border-color\" data-big-mute-icon></div>\n</div>\n";
 
-const T$b = "plugins.big_mute_button";
+const T$c = "plugins.big_mute_button";
 /**
  * @beta
  */
@@ -43170,7 +43170,7 @@ class BigMuteButton extends UICorePlugin {
         this.listenTo(this.core, Events$1.CORE_READY, this.onCoreReady);
         this.listenTo(this.core, 'core:advertisement:start', this.onStartAd);
         this.listenTo(this.core, 'core:advertisement:finish', this.onFinishAd);
-        trace(`${T$b} bindEvents`, {
+        trace(`${T$c} bindEvents`, {
             mediacontrol: !!this.core.mediaControl,
         });
         this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.mediaControlRendered);
@@ -43206,12 +43206,12 @@ class BigMuteButton extends UICorePlugin {
     }
     mediaControlRendered() {
         const container = this.core.activeContainer;
-        trace(`${T$b} mediaControlRendered`, {
+        trace(`${T$c} mediaControlRendered`, {
             container: !!container,
         });
         if (container) {
             this.listenTo(container.playback, Events$1.PLAYBACK_PLAY, () => {
-                trace(`${T$b} PLAYBACK_PLAY`);
+                trace(`${T$c} PLAYBACK_PLAY`);
                 this.render();
             });
         }
@@ -43235,7 +43235,7 @@ class BigMuteButton extends UICorePlugin {
         }
         const { autoPlay, wasMuted } = this.options;
         const volume = container.volume;
-        trace(`${T$b} shouldRender`, {
+        trace(`${T$c} shouldRender`, {
             autoPlay,
             wasMuted,
             volume,
@@ -43244,7 +43244,7 @@ class BigMuteButton extends UICorePlugin {
     }
     render() {
         if (this.shouldRender()) {
-            trace(`${T$b} render`, {
+            trace(`${T$c} render`, {
                 el: !!this.$el,
             });
             this.$el.html(this.template());
@@ -43290,7 +43290,7 @@ const gearIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"n
 const gearHdIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n  <g clip-path=\"url(#clip0_28_1567)\">\n    <path\n      d=\"M19.14 12.94C19.18 12.64 19.2 12.33 19.2 12C19.2 11.68 19.18 11.36 19.13 11.06L21.16 9.47999C21.34 9.33999 21.39 9.06999 21.28 8.86999L19.36 5.54999C19.24 5.32999 18.99 5.25999 18.77 5.32999L16.38 6.28999C15.88 5.90999 15.35 5.58999 14.76 5.34999L14.4 2.80999C14.36 2.56999 14.16 2.39999 13.92 2.39999H10.08C9.83999 2.39999 9.64999 2.56999 9.60999 2.80999L9.24999 5.34999C8.65999 5.58999 8.11999 5.91999 7.62999 6.28999L5.23999 5.32999C5.01999 5.24999 4.76999 5.32999 4.64999 5.54999L2.73999 8.86999C2.61999 9.07999 2.65999 9.33999 2.85999 9.47999L4.88999 11.06C4.83999 11.36 4.79999 11.69 4.79999 12C4.79999 12.31 4.81999 12.64 4.86999 12.94L2.83999 14.52C2.65999 14.66 2.60999 14.93 2.71999 15.13L4.63999 18.45C4.75999 18.67 5.00999 18.74 5.22999 18.67L7.61999 17.71C8.11999 18.09 8.64999 18.41 9.23999 18.65L9.59999 21.19C9.64999 21.43 9.83999 21.6 10.08 21.6H13.92C14.16 21.6 14.36 21.43 14.39 21.19L14.75 18.65C15.34 18.41 15.88 18.09 16.37 17.71L18.76 18.67C18.98 18.75 19.23 18.67 19.35 18.45L21.27 15.13C21.39 14.91 21.34 14.66 21.15 14.52L19.14 12.94ZM12 15.6C10.02 15.6 8.39999 13.98 8.39999 12C8.39999 10.02 10.02 8.39999 12 8.39999C13.98 8.39999 15.6 10.02 15.6 12C15.6 13.98 13.98 15.6 12 15.6Z\"\n      fill=\"#C9C9C9\"/>\n    <rect x=\"13\" width=\"11\" height=\"7\" rx=\"1\" fill=\"#F6413B\"/>\n    <path\n      d=\"M14.6962 6V1.63636H15.3546V3.53267H17.53V1.63636H18.1905V6H17.53V4.0973H15.3546V6H14.6962ZM20.562 6H19.1493V1.63636H20.6067C21.0343 1.63636 21.4015 1.72372 21.7083 1.89844C22.0151 2.07173 22.2502 2.32102 22.4135 2.64631C22.5783 2.97017 22.6607 3.35866 22.6607 3.81179C22.6607 4.26634 22.5776 4.65696 22.4114 4.98366C22.2466 5.31037 22.008 5.56179 21.6955 5.73793C21.383 5.91264 21.0051 6 20.562 6ZM19.8077 5.42472H20.5257C20.8581 5.42472 21.1344 5.36222 21.3546 5.23722C21.5748 5.1108 21.7395 4.92827 21.8489 4.68963C21.9583 4.44957 22.013 4.15696 22.013 3.81179C22.013 3.46946 21.9583 3.17898 21.8489 2.94034C21.7409 2.7017 21.5797 2.5206 21.3652 2.39702C21.1507 2.27344 20.8844 2.21165 20.5662 2.21165H19.8077V5.42472Z\"\n      fill=\"#C9C9C9\"/>\n  </g>\n  <defs>\n    <clipPath id=\"clip0_28_1567\">\n      <rect width=\"24\" height=\"24\" fill=\"white\"/>\n    </clipPath>\n  </defs>\n</svg>\n";
 
 const VERSION$5 = '2.19.12';
-const T$a = 'plugins.bottom_gear';
+const T$b = 'plugins.bottom_gear';
 /**
  * Custom events emitted by the plugin
  */
@@ -43375,11 +43375,11 @@ class BottomGear extends UICorePlugin {
         this.$el.find('.gear-wrapper').html(content);
     }
     onActiveContainerChanged() {
-        trace(`${T$a} onActiveContainerChanged`);
+        trace(`${T$b} onActiveContainerChanged`);
         this.bindContainerEvents();
     }
     bindContainerEvents() {
-        trace(`${T$a} bindContainerEvents`);
+        trace(`${T$b} bindContainerEvents`);
         this.listenTo(this.core.activeContainer, Events$1.CONTAINER_HIGHDEFINITIONUPDATE, this.highDefinitionUpdate);
     }
     highDefinitionUpdate(isHd) {
@@ -45499,7 +45499,7 @@ const qualityClasses = [
     'speedtest-quality-value-2',
     'speedtest-quality-value-3',
     'speedtest-quality-value-4',
-    'speedtest-quality-value-5'
+    'speedtest-quality-value-5',
 ];
 const getDownloadQuality = (speedValue) => {
     if (speedValue < 3) {
@@ -45563,7 +45563,22 @@ const drawSummary = (customMetrics, vodContainer, liveContainer) => {
 };
 // const T = 'plugins.clappr_nerd_stats';
 /**
+ * Displays useful network-related statistics.
  * @beta
+ *
+ * @remarks
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * - {@link BottomGear}
+ *
+ * - {@link ClapprStats}
+ *
+ * The plugin is rendered as an item in the gear menu.
+ *
+ * When clicked, it shows an overlay window with the information about the network speed, latency, etc,
+ * and recommended quality level.
  */
 class ClapprNerdStats extends UICorePlugin {
     container = null;
@@ -45576,21 +45591,31 @@ class ClapprNerdStats extends UICorePlugin {
     showing = false;
     shortcut;
     iconPosition;
+    /**
+     * @internal
+     */
     get name() {
         return 'nerd_stats';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
-    get template() {
-        return tmpl(pluginHtml$5);
-    }
+    static template = tmpl(pluginHtml$5);
+    /**
+     * @internal
+     */
     get attributes() {
         return {
             'data-clappr-nerd-stats': '',
-            'class': 'clappr-nerd-stats'
+            class: 'clappr-nerd-stats',
         };
     }
+    /**
+     * @internal
+     */
     get events() {
         return {
             'click [data-show-stats-button]': 'showOrHide',
@@ -45612,8 +45637,12 @@ class ClapprNerdStats extends UICorePlugin {
     }
     constructor(core) {
         super(core);
-        this.shortcut = core.options.clapprNerdStats?.shortcut ?? ['command+shift+s', 'ctrl+shift+s'];
-        this.iconPosition = core.options.clapprNerdStats?.iconPosition ?? 'bottom-right';
+        this.shortcut = core.options.clapprNerdStats?.shortcut ?? [
+            'command+shift+s',
+            'ctrl+shift+s',
+        ];
+        this.iconPosition =
+            core.options.clapprNerdStats?.iconPosition ?? 'bottom-right';
         this.customMetrics = {
             connectionSpeed: 0,
             ping: 0,
@@ -45621,6 +45650,9 @@ class ClapprNerdStats extends UICorePlugin {
         };
         configureSpeedTest(core.options.clapprNerdStats?.speedTestServers ?? []);
     }
+    /**
+     * @internal
+     */
     bindEvents() {
         const mediaControl = this.core.getPlugin('media_control');
         assert(mediaControl, 'media_control plugin is required');
@@ -45660,9 +45692,11 @@ class ClapprNerdStats extends UICorePlugin {
         this.core.$el.find(this.statsBoxElem).show();
         this.showing = true;
         this.refreshSpeedTest();
-        initSpeedTest(this.customMetrics).then(() => {
+        initSpeedTest(this.customMetrics)
+            .then(() => {
             startSpeedtest();
-        }).catch(e => {
+        })
+            .catch((e) => {
             reportError(e);
             this.disable();
         });
@@ -45677,13 +45711,19 @@ class ClapprNerdStats extends UICorePlugin {
     }
     addGeneralMetrics() {
         this.metrics.general = {
-            displayResolution: (this.playerWidth + 'x' + this.playerHeight),
-            volume: this.container?.volume
+            displayResolution: this.playerWidth + 'x' + this.playerHeight,
+            volume: this.container?.volume,
         };
     }
     addCustomMetrics() {
         this.metrics.custom = this.customMetrics;
-        const videoQualityNames = ['SD (480p)', 'HD (720p)', 'Full HD (1080p)', '2K (1440p)', '4K (2160p)'];
+        const videoQualityNames = [
+            'SD (480p)',
+            'HD (720p)',
+            'Full HD (1080p)',
+            '2K (1440p)',
+            '4K (2160p)',
+        ];
         const { connectionSpeed, ping } = this.customMetrics;
         if (!connectionSpeed || !ping) {
             const calculatingText = 'Calculating... Please wait.';
@@ -45695,17 +45735,19 @@ class ClapprNerdStats extends UICorePlugin {
         const pingQuality = getPingQuality(ping);
         const liveQuality = Math.min(downloadQuality, pingQuality);
         const prefix = 'Optimal for ';
-        this.metrics.custom.vodQuality = prefix + videoQualityNames[downloadQuality - 1];
-        this.metrics.custom.liveQuality = prefix + videoQualityNames[liveQuality - 1];
+        this.metrics.custom.vodQuality =
+            prefix + videoQualityNames[downloadQuality - 1];
+        this.metrics.custom.liveQuality =
+            prefix + videoQualityNames[liveQuality - 1];
     }
     updateMetrics(metrics) {
         Object.assign(this.metrics, metrics);
         this.addGeneralMetrics();
         this.addCustomMetrics();
         const scrollTop = this.core.$el.find(this.statsBoxElem).scrollTop();
-        this.$el.html(this.template({
+        this.$el.html(ClapprNerdStats.template({
             metrics: Formatter.format(this.metrics),
-            iconPosition: this.iconPosition
+            iconPosition: this.iconPosition,
         }));
         this.setStatsBoxSize();
         drawSpeedTestResults();
@@ -45725,7 +45767,11 @@ class ClapprNerdStats extends UICorePlugin {
             this.$el.find(this.statsBoxElem).addClass('narrow');
         }
     }
+    /**
+     * @internal
+     */
     render() {
+        // TODO append to the container
         this.core.$el.append(this.$el[0]);
         this.hide();
         return this;
@@ -46108,7 +46154,7 @@ class ClapprStats extends ContainerPlugin {
 //Copyright 2014 Globo.com Player authors. All rights reserved.
 // Use of this source code is governed by a BSD-style
 // license that can be found in the LICENSE file.
-const T$9 = 'plugins.click_to_pause_custom';
+const T$a = 'plugins.click_to_pause_custom';
 class ClickToPause extends ContainerPlugin {
     pointerEnabled = false;
     timer = null;
@@ -46128,7 +46174,7 @@ class ClickToPause extends ContainerPlugin {
     click() {
         const isLivePlayback = this.container.getPlaybackType() === Playback.LIVE;
         const isDvrEnabled = this.container.isDvrEnabled();
-        trace(`${T$9} click`, {
+        trace(`${T$a} click`, {
             isLivePlayback,
             isDvrEnabled,
         });
@@ -46146,7 +46192,7 @@ class ClickToPause extends ContainerPlugin {
     settingsUpdate() {
         const isLivePlayback = this.container.getPlaybackType() === Playback.LIVE;
         const pointerEnabled = !isLivePlayback || this.container.isDvrEnabled();
-        trace(`${T$9} settingsUpdate`, {
+        trace(`${T$a} settingsUpdate`, {
             isLivePlayback,
             pointerEnabled,
         });
@@ -46537,8 +46583,11 @@ const dvrHTML = "<div class=\"live-info\"><%= live %></div>\n<button type=\"butt
  * @beta
  *
  * @remarks
- * The plugin is rendered in the {@link MediaControl | media control} UI.
- * It renders the live stream indicator and the DVR seek bar if DVR is enabled.
+ * Depends on:
+ *
+ * - {@link MediaControl | media_control}
+ *
+ * The plugin renders the live stream indicator and the DVR seek bar, if DVR is enabled, in the media control UI.
  */
 class DvrControls extends UICorePlugin {
     static template = tmpl(dvrHTML);
@@ -46673,7 +46722,12 @@ const templateHtml = "<div class=\"player-error-screen__content\" data-error-scr
 
 const TIME_FOR_UPDATE = 10000;
 const MAX_RETRY = 10;
-const T$8 = 'plugins.error_screen';
+const T$9 = 'plugins.error_screen';
+/**
+ * Displays a descriptive error in the overlay on top of the player.
+ * @beta
+ * TODO
+ */
 class ErrorScreen extends UICorePlugin {
     _retry = 0;
     err = null;
@@ -46706,17 +46760,17 @@ class ErrorScreen extends UICorePlugin {
         this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this.onContainerChanged);
     }
     onCoreReady() {
-        trace(`${T$8} onCoreReady`);
+        trace(`${T$9} onCoreReady`);
         if (this.core.activePlayback) {
             this.listenTo(this.core.activePlayback, Events$1.PLAYBACK_PLAY, this.onPlay);
         }
     }
     onPlay() {
-        trace(`${T$8} onPlay`);
+        trace(`${T$9} onPlay`);
         this.destroyError();
     }
     destroyError() {
-        trace(`${T$8} destroyError`);
+        trace(`${T$9} destroyError`);
         this._retry = 0;
         this.err = null;
         if (this.timeout !== null) {
@@ -46772,7 +46826,7 @@ class ErrorScreen extends UICorePlugin {
         }
     }
     onError(err) {
-        trace(`${T$8} onError`, { err });
+        trace(`${T$9} onError`, { err });
         if (err.level === PlayerError.Levels.FATAL ||
             err.details === 'bufferStalledError' ||
             err.details === 'manifestParsingError') {
@@ -47267,7 +47321,7 @@ function keyName(keyCode) {
 
 const buttonHtml$2 = "<button class='gplayer-lite-btn gcore-skin-text-color gear-option'>\n    <% if (isHd) { %>\n        <span class=\"gear-option_hd-icon\"><%= hdIcon %></span>\n    <% } %>\n    <span>Quality</span>\n    <span class=\"gear-option_arrow-right-icon\"><%= arrowRightIcon %></span>\n    <span class='gear-option_value'><%= currentText %></span>\n</button>\n";
 
-const listHtml$1 = "<button class=\"gplayer-lite-btn go-back gcore-skin-text-color\">\n    <span class=\"arrow-left-icon\"><%= arrowLeftIcon %></span>\n    Quality\n</button>\n<ul class=\"gear-sub-menu\">\n    <% if (!removeAuto) { %>\n        <li>\n            <a href=\"#\" class='gear-sub-menu_btn gcore-skin-text-color' data-id=\"-1\" id=\"level_selector_auto\">\n                <span class=\"check-icon\"><%= checkIcon %></span>\n            Auto\n        </a>\n    </li>\n    <% } %>\n    <% for (const level of levels.slice().reverse()) { %>\n        <li <% if (maxLevel >= 0 && level.level > maxLevel) { %>class=\"level-disabled\"<% } %>>\n            <a href=\"#\" class='gear-sub-menu_btn gcore-skin-text-color' data-id=\"<%= level.level %>\" id=\"level_selector_<%= level.level %>\">\n                <span class=\"check-icon\"><%= checkIcon %></span>\n                <%= labels[level.level] %>\n            </a>\n        </li>\n    <% } %>\n</ul>\n";
+const listHtml$1 = "<button class=\"gplayer-lite-btn go-back gcore-skin-text-color\">\n    <span class=\"arrow-left-icon\"><%= arrowLeftIcon %></span>\n    Quality\n</button>\n<ul class=\"gear-sub-menu\">\n    <% if (!removeAuto) { %>\n        <li>\n            <a href=\"#\" class='gear-sub-menu_btn gcore-skin-text-color' data-id=\"-1\" id=\"level_selector_auto\">\n                <span class=\"check-icon\"><%= checkIcon %></span>\n            Auto\n        </a>\n    </li>\n    <% } %>\n    <% for (const level of levels.slice().reverse()) { %>\n        <li <% if (maxLevel >= 0 && level.level > maxLevel) { %>class=\"level-disabled\"<% } %>>\n            <a href=\"#\" class='gear-sub-menu_btn gcore-skin-text-color' data-id=\"<%= level.level %>\" id=\"level_selector_<%= level.height %>\">\n                <span class=\"check-icon\"><%= checkIcon %></span>\n                <%= labels[level.level] %>\n            </a>\n        </li>\n    <% } %>\n</ul>\n";
 
 const hdIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path\n    d=\"M14.9562 8.22232H13.9961V15.1873H14.9562C15.8914 15.1873 16.766 14.8253 17.4195 14.1676C18.0786 13.5037 18.4415 12.6281 18.4415 11.7026C18.4415 9.7837 16.8781 8.22253 14.9561 8.22253L14.9562 8.22232Z\"\n    fill=\"#C9C9C9\"/>\n  <path\n    d=\"M22.0801 4H1.91994C0.859222 4 0 4.86406 0 5.91994V17.4878C0 18.5437 0.859222 19.4078 1.91994 19.4078H22.0801C23.1408 19.4078 24 18.5437 24 17.4878V5.91994C24 4.86406 23.1408 4 22.0801 4ZM10.3975 15.3473C10.3975 15.6124 10.1827 15.8272 9.91754 15.8272C9.65216 15.8272 9.43761 15.6122 9.43761 15.3473V12.0239H5.55956V15.3473C5.55956 15.6124 5.34481 15.8272 5.07963 15.8272C4.81425 15.8272 4.5997 15.6122 4.5997 15.3473L4.59949 7.74042C4.59949 7.47524 4.81425 7.26049 5.07943 7.26049C5.34481 7.26049 5.55936 7.47544 5.55936 7.74042V11.0636H9.43741V7.74042C9.43741 7.47524 9.65216 7.26049 9.91734 7.26049C10.1827 7.26049 10.3973 7.47544 10.3973 7.74042L10.3975 15.3473ZM18.1005 14.8438C17.2652 15.6844 16.1486 16.1472 14.9561 16.1472H13.5161C13.2507 16.1472 13.0361 15.9323 13.0361 15.6673V7.74263C13.0361 7.47745 13.2509 7.26269 13.5161 7.26269H14.9561C17.4072 7.26269 19.4013 9.25438 19.4013 11.7027C19.4013 12.8835 18.9392 13.9991 18.1005 14.844V14.8438Z\"\n    fill=\"#C9C9C9\"/>\n</svg>\n";
 
@@ -47277,7 +47331,7 @@ const arrowLeftIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fil
 
 const checkIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n        d=\"M20.5793 4.19296C20.1216 3.86696 19.4777 3.96396 19.1424 4.40896L9.37295 17.3809L4.81634 12.107C4.45222 11.683 3.80218 11.6289 3.36709 11.9839C2.932 12.3389 2.87543 12.97 3.2416 13.393L8.64165 19.643C8.83708 19.869 9.12506 20 9.42849 20C9.4398 20 9.45114 20 9.46246 19.999C9.77926 19.989 10.0724 19.838 10.2586 19.59L20.8015 5.58996C21.1368 5.14496 21.0371 4.51896 20.5793 4.19296Z\"\n        fill=\"#C9C9C9\"/>\n</svg>\n";
 
-const T$7 = 'plugins.level_selector';
+const T$8 = 'plugins.level_selector';
 const VERSION$4 = '2.19.4';
 /**
  * A {@link MediaControl | media control} plugin that provides a UI to control the quality level of the playback.
@@ -47379,10 +47433,10 @@ class LevelSelector extends UICorePlugin {
         }
     }
     onStop() {
-        trace(`${T$7} onStop`);
+        trace(`${T$8} onStop`);
         const currentPlayback = this.core.activePlayback;
         this.listenToOnce(currentPlayback, Events$1.PLAYBACK_PLAY, () => {
-            trace(`${T$7} on PLAYBACK_PLAY after stop`, { selectedLevelId: this.selectedLevelId });
+            trace(`${T$8} on PLAYBACK_PLAY after stop`, { selectedLevelId: this.selectedLevelId });
             if (currentPlayback.getPlaybackType() === 'live') {
                 if (this.selectedLevelId !== -1) {
                     currentPlayback.currentLevel = this.selectedLevelId;
@@ -47478,13 +47532,13 @@ class LevelSelector extends UICorePlugin {
         return false;
     }
     goBack() {
-        trace(`${T$7} goBack`);
+        trace(`${T$8} goBack`);
         this.isOpen = false;
         this.core.trigger('gear:refresh');
         this.deferRender();
     }
     setLevel(index) {
-        trace(`${T$7} setIndexLevel`, { index });
+        trace(`${T$8} setIndexLevel`, { index });
         this.selectedLevelId = index;
         if (!this.core.activePlayback) {
             return;
@@ -47502,7 +47556,7 @@ class LevelSelector extends UICorePlugin {
         this.deferRender();
     }
     onShowLevelSelectMenu() {
-        trace(`${T$7} onShowLevelSelectMenu`);
+        trace(`${T$8} onShowLevelSelectMenu`);
         this.isOpen = true;
         this.renderDropdown();
         this.highlightCurrentLevel();
@@ -47538,11 +47592,11 @@ class LevelSelector extends UICorePlugin {
         return this.levelLabels[index] ?? formatLevelLabel(this.levels[index]);
     }
     updateCurrentLevel(info) {
-        trace(`${T$7} updateCurrentLevel`, { info });
+        trace(`${T$8} updateCurrentLevel`, { info });
         this.highlightCurrentLevel();
     }
     highlightCurrentLevel() {
-        trace(`${T$7} highlightCurrentLevel`, {
+        trace(`${T$8} highlightCurrentLevel`, {
             selectedLevelId: this.selectedLevelId,
         });
         this.allLevelElements().removeClass('current');
@@ -48868,7 +48922,7 @@ const streamsMomentoIcon = "<svg id=\"Слой_1\" data-name=\"Слой 1\" xmln
 const streamsWhiteNightsIcon = "<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"50\" height=\"50\" viewBox=\"0 0 50 50\">\n  <defs>\n    <clipPath id=\"clip-Icon\">\n      <rect width=\"50\" height=\"50\"/>\n    </clipPath>\n  </defs>\n  <g id=\"Icon\" clip-path=\"url(#clip-Icon)\">\n    <g id=\"icon2\" transform=\"translate(-0.041 0)\">\n      <path id=\"Контур_77\" data-name=\"Контур 77\" d=\"M6.493,13v8.266h6.275V19.74H8.31V17.714h4.006V16.3H8.31V14.53h4.365V13Zm7.5,0v8.266h1.7V15.732h.023l3.438,5.534h1.818V13h-1.7v5.545h-.023L15.8,13Z\" fill=\"#fff\"/>\n      <path id=\"Контур_76\" data-name=\"Контур 76\" d=\"M29.949,29.1V26.774H31.94a1.4,1.4,0,0,1,.938.272,1.1,1.1,0,0,1,.313.874,1.155,1.155,0,0,1-.313.9,1.375,1.375,0,0,1-.938.278ZM28.132,25.36v8.266h1.817V30.4h1.818a1.353,1.353,0,0,1,.984.3,1.637,1.637,0,0,1,.394.949c.046.333.079.681.1,1.042a3.2,3.2,0,0,0,.185.938h1.819a1.218,1.218,0,0,1-.191-.423,3.611,3.611,0,0,1-.093-.527c-.019-.185-.033-.367-.041-.544s-.016-.332-.023-.463a5.052,5.052,0,0,0-.087-.625,2.109,2.109,0,0,0-.2-.573,1.586,1.586,0,0,0-.359-.451,1.414,1.414,0,0,0-.556-.284v-.023a1.926,1.926,0,0,0,1-.81,2.494,2.494,0,0,0,.307-1.262,2.308,2.308,0,0,0-.165-.88,2.128,2.128,0,0,0-.486-.724,2.3,2.3,0,0,0-.764-.492,2.67,2.67,0,0,0-1-.179ZM43.506,30.5V25.36H41.689V30.5a2.065,2.065,0,0,1-.37,1.36,1.7,1.7,0,0,1-1.343.434,2.086,2.086,0,0,1-.886-.156,1.283,1.283,0,0,1-.758-.978,3.748,3.748,0,0,1-.058-.66V25.36H36.456V30.5a3.16,3.16,0,0,0,.92,2.5,3.807,3.807,0,0,0,2.6.81,3.82,3.82,0,0,0,2.593-.816,3.132,3.132,0,0,0,.937-2.492Z\" fill=\"#fff\"/>\n      <path id=\"Контур_80\" data-name=\"Контур 80\" d=\"M22.646,31.2H4.689a4.505,4.505,0,0,1-4.5-4.5V8.5A4.505,4.505,0,0,1,4.689,4h18.2a4.505,4.505,0,0,1,4.5,4.5v8.445l-.893.1a3.184,3.184,0,0,0-2.846,3.177V30.5l-.465.7ZM4.689,6a2.5,2.5,0,0,0-2.5,2.5V26.7a2.5,2.5,0,0,0,2.5,2.5H21.65V20.22a5.18,5.18,0,0,1,3.739-4.992V8.5a2.5,2.5,0,0,0-2.5-2.5Z\" fill=\"#fff\"/>\n      <path id=\"Контур_81\" data-name=\"Контур 81\" d=\"M30.127,47.884a1,1,0,0,1-1-1V43.267H26.846a5.206,5.206,0,0,1-5.2-5.2V20.222a5.206,5.206,0,0,1,5.2-5.2H44.692a5.206,5.206,0,0,1,5.2,5.2V38.068a5.206,5.206,0,0,1-5.2,5.2H35.058l-4.216,4.316A1,1,0,0,1,30.127,47.884ZM26.846,17.022a3.2,3.2,0,0,0-3.2,3.2V38.067a3.2,3.2,0,0,0,3.2,3.2h3.281a1,1,0,0,1,1,1v2.162l2.8-2.86a1,1,0,0,1,.715-.3H44.692a3.2,3.2,0,0,0,3.2-3.2V20.222a3.2,3.2,0,0,0-3.2-3.2Z\" fill=\"#fff\"/>\n    </g>\n  </g>\n</svg>\n";
 
 const VERSION$3 = '0.0.1';
-const T$6 = 'plugins.media_control_multicamera';
+const T$7 = 'plugins.media_control_multicamera';
 class MultiCamera extends UICorePlugin {
     currentCamera = null;
     currentTime = 0;
@@ -49010,7 +49064,7 @@ class MultiCamera extends UICorePlugin {
     }
     onCameraSelect(event) {
         const value = event.currentTarget.dataset.multicameraSelectorSelect;
-        trace(`${T$6} onCameraSelect`, { value });
+        trace(`${T$7} onCameraSelect`, { value });
         if (value !== undefined) {
             this.changeById(parseInt(value, 10));
         }
@@ -49137,13 +49191,13 @@ class MultiCamera extends UICorePlugin {
         }
     }
     changeById(id) {
-        trace(`${T$6} changeById`, { id });
+        trace(`${T$7} changeById`, { id });
         queueMicrotask(() => {
             const playbackOptions = this.core.options.playback || {};
             // TODO figure out what this does
             playbackOptions.recycleVideo = Browser.isMobile;
             this.currentCamera = this.findElementById(id) ?? null;
-            trace(`${T$6} changeById`, { id, currentCamera: this.currentCamera, multicamera: this.multicamera });
+            trace(`${T$7} changeById`, { id, currentCamera: this.currentCamera, multicamera: this.multicamera });
             if (!this.currentCamera) {
                 return;
             }
@@ -49160,7 +49214,7 @@ class MultiCamera extends UICorePlugin {
             // TODO remove?
             // for html5 playback:
             this.options.dvrEnabled = this.currentCamera.dvr;
-            trace(`${T$6} changeById`, { currentCamera: this.currentCamera });
+            trace(`${T$7} changeById`, { currentCamera: this.currentCamera });
             // TODO
             this.core.configure({
                 playback: playbackOptions,
@@ -49218,17 +49272,39 @@ const pipIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"no
 const buttonHtml$1 = "<button class=\"gplayer-lite-btn gcore-skin-button-color\">\n    <span><%= pipIcon %></span>\n</button>\n";
 
 const VERSION$2 = '0.0.1';
-const T$5 = `plugins.media_control_pip`;
+const T$6 = `plugins.pip`;
+/**
+ * Enables picture in picture mode.
+ * @beta
+ * @remarks
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * It renders a button to toggle picture in picture mode in the media control UI.
+ */
 class PictureInPicture extends UICorePlugin {
+    /**
+     * @internal
+     */
     get name() {
-        return 'media_control_pip';
+        return 'pip';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
+    /**
+     * @internal
+     */
     static get version() {
         return VERSION$2;
     }
+    /**
+     * @internal
+     */
     get events() {
         return {
             'click button': 'togglePictureInPicture',
@@ -49237,16 +49313,22 @@ class PictureInPicture extends UICorePlugin {
     get videoElement() {
         return this.core.activePlayback.el;
     }
+    /**
+     * @internal
+     */
     bindEvents() {
         this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.render);
     }
     isPiPSupported() {
-        trace(`${T$5} isPiPSupported`, {
+        trace(`${T$6} isPiPSupported`, {
             pictureInPictureEnabled: document.pictureInPictureEnabled,
             requestPictureInPicture: HTMLVideoElement.prototype.requestPictureInPicture,
         });
         return document.pictureInPictureEnabled && !!HTMLVideoElement.prototype.requestPictureInPicture;
     }
+    /**
+     * @internal
+     */
     render() {
         if (!this.isPiPSupported()) {
             return this;
@@ -49260,7 +49342,7 @@ class PictureInPicture extends UICorePlugin {
         return this;
     }
     togglePictureInPicture() {
-        trace(`${T$5} togglePictureInPicture`);
+        trace(`${T$6} togglePictureInPicture`);
         if (this.videoElement !== document.pictureInPictureElement) {
             this.requestPictureInPicture();
         }
@@ -49269,13 +49351,13 @@ class PictureInPicture extends UICorePlugin {
         }
     }
     requestPictureInPicture() {
-        trace(`${T$5} requestPictureInPicture`, {
+        trace(`${T$6} requestPictureInPicture`, {
             videoElement: !!this.videoElement,
         });
         this.videoElement.requestPictureInPicture();
     }
     exitPictureInPicture() {
-        trace(`${T$5} exitPictureInPicture`);
+        trace(`${T$6} exitPictureInPicture`);
         document.exitPictureInPicture();
     }
 }
@@ -49300,26 +49382,51 @@ const DEFAULT_PLAYBACK_RATES = [
 const DEFAULT_PLAYBACK_RATE = '1.0';
 // TODO
 const MEDIACONTROL_PLAYBACKRATE = 'playbackRate';
+/**
+ * Allows changing the playback speed of the video.
+ * @beta
+ *
+ * @remarks
+ * Depends on:
+ *
+ * - {@link MediaControl | media_control}
+ *
+ * - {@link BottomGear | bottom_gear}
+ *
+ * It renders a button in the gear menu, which opens a dropdown with the available playback rates.
+ */
 class PlaybackRate extends UICorePlugin {
     currentPlayback = null;
     playbackRates = DEFAULT_PLAYBACK_RATES;
     prevSelectedRate;
     selectedRate = DEFAULT_PLAYBACK_RATE;
+    /**
+     * @internal
+     */
     get name() {
-        return 'media_control_playback_rate';
+        return 'playback_rate';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
-    get template() {
-        return tmpl(pluginHtml$3);
-    }
+    static template = tmpl(pluginHtml$3);
+    static buttonTemplate = tmpl(buttonHtml);
+    static listTemplate = tmpl(listHtml);
+    /**
+     * @internal
+     */
     get attributes() {
         return {
             'class': this.name,
             'data-playback-rate-select': ''
         };
     }
+    /**
+     * @internal
+     */
     get events() {
         return {
             'click .gear-sub-menu_btn': 'onRateSelect',
@@ -49327,8 +49434,12 @@ class PlaybackRate extends UICorePlugin {
             'click .go-back': 'goBack',
         };
     }
+    /**
+     * @internal
+     */
     bindEvents() {
         this.listenTo(this.core, 'gear:rendered', this.render);
+        // TODO this.core.getPlugin('media_control'), bottom_gear
         this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this.reload);
         this.listenTo(this.core.mediaControl, MEDIACONTROL_PLAYBACKRATE, this.updatePlaybackRate);
         this.listenTo(this.core, 'core:advertisement:start', this.onStartAd);
@@ -49382,6 +49493,9 @@ class PlaybackRate extends UICorePlugin {
         this.currentPlayback = this.core.activePlayback;
         return !(this.currentPlayback?.tagName !== 'video' && this.currentPlayback?.tagName !== 'audio');
     }
+    /**
+     * @internal
+     */
     render() {
         const container = this.core.activeContainer;
         if (this.core.getPlaybackType() === Playback.LIVE && !container.isDvrEnabled()) {
@@ -49395,9 +49509,7 @@ class PlaybackRate extends UICorePlugin {
             this.selectedRate = cfg.defaultValue || DEFAULT_PLAYBACK_RATE;
         }
         if (this.shouldRender()) {
-            const t = tmpl(buttonHtml);
-            // const html = t({ playbackRates: this.playbackRates, title: this.getTitle() });
-            const button = t({
+            const button = PlaybackRate.buttonTemplate({
                 title: this.getTitle(),
                 speedIcon,
                 arrowRightIcon,
@@ -49445,8 +49557,7 @@ class PlaybackRate extends UICorePlugin {
         return false;
     }
     onShowMenu() {
-        const t = tmpl(listHtml);
-        this.$el.html(t({
+        this.$el.html(PlaybackRate.listTemplate({
             playbackRates: this.playbackRates,
             arrowLeftIcon,
             checkIcon,
@@ -49490,7 +49601,7 @@ const posterHTML = "<div class=\"play-wrapper\" data-poster></div>\n";
 //Copyright 2014 Globo.com Player authors. All rights reserved.
 // Use of this source code is governed by a BSD-style
 // license that can be found in the LICENSE file.
-const T$4 = 'plugins.poster_custom';
+const T$5 = 'plugins.poster_custom';
 /**
  * Displays a poster image in the background and a big play button on top when playback is stopped
  * @beta
@@ -49593,13 +49704,13 @@ class Poster extends UIContainerPlugin {
      * Disables the plugin, unmounting it from the DOM
      */
     disable() {
-        trace(`${T$4} disable`);
+        trace(`${T$5} disable`);
         this.hasStartedPlaying = false;
         this.playRequested = false;
         super.disable();
     }
     onError(error) {
-        trace(`${T$4} onError`, {
+        trace(`${T$5} onError`, {
             error,
             enabled: this.enabled,
         });
@@ -49612,18 +49723,18 @@ class Poster extends UIContainerPlugin {
         }
     }
     onPlay() {
-        trace(`${T$4} onPlay`);
+        trace(`${T$5} onPlay`);
         this.hasStartedPlaying = true;
         this.playRequested = false;
         this.update();
     }
     onPlayIntent() {
-        trace(`${T$4} onPlayIntent`);
+        trace(`${T$5} onPlayIntent`);
         this.playRequested = true;
         this.update();
     }
     onStop() {
-        trace(`${T$4} onStop`, {
+        trace(`${T$5} onStop`, {
             enabled: this.enabled,
         });
         this.hasStartedPlaying = false;
@@ -49631,7 +49742,7 @@ class Poster extends UIContainerPlugin {
         this.update();
     }
     updatePlayButton(show) {
-        trace(`${T$4} updatePlayButton`, {
+        trace(`${T$5} updatePlayButton`, {
             show,
             chromeless: this.options.chromeless,
             allowUserInteraction: this.options.allowUserInteraction,
@@ -49660,7 +49771,7 @@ class Poster extends UIContainerPlugin {
         this.$el.removeClass('clickable');
     }
     clicked() {
-        trace(`${T$4} clicked`, {
+        trace(`${T$5} clicked`, {
             hasStartedPlaying: this.hasStartedPlaying,
             chromeless: this.options.chromeless,
             allowUserInteraction: this.options.allowUserInteraction,
@@ -49684,7 +49795,7 @@ class Poster extends UIContainerPlugin {
         return !this.container.playback.isAudioOnly;
     }
     update() {
-        trace(`${T$4} update`, {
+        trace(`${T$5} update`, {
             shouldRender: this.shouldRender,
         });
         if (!this.shouldRender) {
@@ -49697,7 +49808,7 @@ class Poster extends UIContainerPlugin {
         this.updatePoster();
     }
     updatePoster() {
-        trace(`${T$4} updatePoster`, {
+        trace(`${T$5} updatePoster`, {
             hasStartedPlaying: this.hasStartedPlaying,
         });
         if (!this.hasStartedPlaying) {
@@ -49712,7 +49823,7 @@ class Poster extends UIContainerPlugin {
         this.$el.show();
     }
     hidePoster() {
-        trace(`${T$4} hidePoster`, {
+        trace(`${T$5} hidePoster`, {
             shouldHideOnPlay: this.shouldHideOnPlay(),
         });
         if (!this.options.disableMediaControl) {
@@ -50129,7 +50240,7 @@ const spinnerHTML = "<div data-bounce1></div>\n<div data-bounce2></div>\n<div da
 // Copyright 2014 Globo.com Player authors. All rights reserved.
 // Use of this source code is governed by a BSD-style
 // license that can be found in the LICENSE file.
-const T$3 = 'plugins.spinner';
+const T$4 = 'plugins.spinner';
 /**
  * Custom events emitted by the plugin
  */
@@ -50194,11 +50305,11 @@ class SpinnerThreeBounce extends UIContainerPlugin {
         this.hasBuffering = false;
     }
     onPlay() {
-        trace(`${T$3} onPlay`);
+        trace(`${T$4} onPlay`);
         this.hide();
     }
     onStop() {
-        trace(`${T$3} onStop`, {
+        trace(`${T$4} onStop`, {
             showOnError: this.options.spinner?.showOnError,
             hasFatalError: this.hasFatalError,
         });
@@ -50208,7 +50319,7 @@ class SpinnerThreeBounce extends UIContainerPlugin {
     }
     onError(e) {
         this.hasFatalError = e.code === PlaybackErrorCode.MediaSourceUnavailable;
-        trace(`${T$3} onError`, {
+        trace(`${T$4} onError`, {
             e,
             showOnError: this.options.spinner?.showOnError,
             hasFatalError: this.hasFatalError,
@@ -50242,7 +50353,7 @@ class SpinnerThreeBounce extends UIContainerPlugin {
      */
     render() {
         const showOnStart = this.options.spinner?.showOnStart;
-        trace(`${T$3} render`, {
+        trace(`${T$4} render`, {
             buffering: this.container.buffering,
             showOnStart,
         });
@@ -50261,129 +50372,200 @@ class SpinnerThreeBounce extends UIContainerPlugin {
     }
 }
 
-// An example implementation of client side performancestatistics
-const CUSTOM_EVENTS_CONTAINER_START = 'container:start';
-const WATCH_CUTOFF = 5;
-const HEATMAP_INTERVAL = 10;
-// TODO rewrite as core plugin
-class Statistics extends ContainerPlugin {
+const T$3 = 'plugins.source_controller';
+const INITIAL_RETRY_DELAY = 1000;
+const MAX_RETRY_DELAY = 5000;
+const RETRY_DELAY_BLUR = 500;
+const VERSION$1 = '0.0.1';
+function noSync(cb) {
+    queueMicrotask(cb);
+}
+/**
+ * This plugin is responsible for managing the automatic failover between sources.
+ * @beta
+ * @remarks
+ * Have a look at the {@link https://miro.com/app/board/uXjVLiN15tY=/?share_link_id=390327585787 | source failover diagram} for the details
+ * on how sources ordering and selection works.
+ *
+ * This plugin does not expose any public methods apart from required by the Clappr plugin interface.
+ * It is supposed to work autonomously.
+ *
+ * @example
+ * ```ts
+ * import { SourceController } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(SourceController)
+ * ```
+ */
+class SourceController extends CorePlugin {
+    /*
+     * The Logic itself is quite simple:
+     * * Here is the short diagram:
+     *
+     * sources_list:
+     *       - a.mpd  |    +--------------------+
+     *       - b.m3u8 |--->|         init       |
+     *       - ...    |    |--------------------|
+     *                     | current_source = 0 |
+     *                     +--------------------+
+     *                            |
+     *                            |  source = a.mpd
+     *                            |  playback = dash.js
+     *                            v
+     *                      +------------------+
+     *                  +-->|   load source    |
+     *                  |   +---------|--------+
+     *                  |             v
+     *                  |   +------------------+
+     *                  |   |       play       |
+     *                  |   +---------|--------+
+     *                  |             |
+     *                  |             v
+     *                  |   +-----------------------+
+     *                  |   |  on playback_error    |
+     *                  |   |-----------------------|
+     *                  |   | current_source =      |
+     *                  |   |  (current_source + 1) |
+     *                  |   |  % len sources_list   |
+     *                  |   |                       |
+     *                  |   | delay 1..3s           |
+     *                  |   +---------------|-------+
+     *                  |                   |
+     *                  |   source=b.m3u8   |
+     *                  |   playback=hls.js |
+     *                  +-------------------+
+     *
+     */
+    sourcesList = [];
+    currentSourceIndex = 0;
+    sourcesDelay = {};
+    active = false;
+    sync = noSync;
+    /**
+     * @internal
+     */
     get name() {
-        return 'statistics_gplayer';
+        return 'source_controller';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
-    started = false;
-    timeStart = 0;
-    heatmapSent = false;
-    heatmapLastTime = 0;
-    watchSent = false;
-    bufTracking = false;
-    lags = 0;
-    /**
-     * The time when buffering last started.
-     */
-    bufLastStarted = 0;
+    constructor(core) {
+        super(core);
+        this.sourcesList = this.core.options.sources;
+        if (this.core.options.source !== undefined) {
+            // prevent Clappr from loading all sources simultaneously
+            this.core.options.sources = [this.core.options.source];
+        }
+        else {
+            this.core.options.sources = this.core.options.sources.slice(0, 1);
+        }
+    }
     /**
-     * The accumulated buffering duration.
+     * @internal
      */
-    bufAccDuration = 0;
-    constructor(container) {
-        super(container);
-        assert(this.options.statistics &&
-            typeof this.options.statistics.send === 'function', 'Statistics plugin requires statistics options');
-    }
     bindEvents() {
-        // TODO remove this
-        this.listenToOnce(this.container, CUSTOM_EVENTS_CONTAINER_START, this.onStart);
-        this.listenToOnce(this.container, Events$1.CONTAINER_READY, this.onReady);
-        this.listenTo(this.container, Events$1.CONTAINER_STATE_BUFFERING, this.onBuffering);
-        this.listenTo(this.container, Events$1.CONTAINER_STATE_BUFFERFULL, this.onBufferFull);
-        this.listenTo(this.container.playback, Events$1.PLAYBACK_TIMEUPDATE, this.onTimeUpdateLive);
-        this.listenTo(this.container.playback, Events$1.PLAYBACK_LEVEL_SWITCH_START, this.startLevelSwitch);
-        this.listenTo(this.container.playback, Events$1.PLAYBACK_LEVEL_SWITCH_END, this.stopLevelSwitch);
-    }
-    startLevelSwitch() {
-        this.bufTracking = false;
-    }
-    stopLevelSwitch() {
-        this.bufTracking = true;
+        super.bindEvents();
+        this.listenTo(this.core, Events$1.CORE_ACTIVE_CONTAINER_CHANGED, () => this.onReady());
     }
-    onBuffering() {
-        if (this.bufTracking) {
-            this.bufLastStarted = performance.now();
+    onReady() {
+        trace(`${T$3} onReady`, {
+            retrying: this.active,
+            currentSource: this.sourcesList[this.currentSourceIndex],
+        });
+        const spinner = this.core.activeContainer?.getPlugin('spinner');
+        if (spinner) {
+            this.sync = (cb) => {
+                spinner.once(SpinnerEvents.SYNC, cb);
+            };
         }
-    }
-    onBufferFull() {
-        if (this.bufTracking && this.bufLastStarted) {
-            this.bufAccDuration += performance.now() - this.bufLastStarted;
-            this.lags++;
+        else {
+            this.sync = noSync;
         }
-        this.bufTracking = true;
-    }
-    onReady() {
-        this.initEvent();
-        if (this.options.autoPlay) {
-            this.onStart();
+        this.bindContainerEventListeners();
+        if (this.active) {
+            this.core.activeContainer?.getPlugin('poster_custom')?.disable();
+            spinner?.show();
         }
     }
-    initEvent() {
-        this.sendMessage('init');
-    }
-    sendMessage(state) {
-        this.send(state, {
-        // embed_url: this.options.referer,
-        // user_agent: Browser.userAgent
+    bindContainerEventListeners() {
+        this.core.activePlayback.on(Events$1.PLAYBACK_ERROR, (error) => {
+            trace(`${T$3} on PLAYBACK_ERROR`, {
+                error: {
+                    code: error?.code,
+                    description: error?.description,
+                    level: error?.level,
+                },
+                retrying: this.active,
+                currentSource: this.sourcesList[this.currentSourceIndex],
+            });
+            switch (error.code) {
+                case PlaybackErrorCode.MediaSourceUnavailable:
+                    this.core.activeContainer?.getPlugin('poster_custom')?.disable();
+                    this.retryPlayback();
+                    break;
+            }
         });
-    }
-    send(event, data = {}) {
-        this.options.statistics.send({
-            event,
-            type: this.container.getPlaybackType(),
-            ...data,
+        this.core.activePlayback.on(Events$1.PLAYBACK_PLAY, () => {
+            trace(`${T$3} on PLAYBACK_PLAY`, {
+                currentSource: this.sourcesList[this.currentSourceIndex],
+                retrying: this.active,
+            });
+            if (this.active) {
+                this.reset();
+                // TODO make poster reset its state on enable
+                this.core.activeContainer?.getPlugin('poster_custom')?.enable();
+                this.core.activeContainer?.getPlugin('spinner')?.hide();
+            }
         });
     }
-    sendHeatmap(time) {
-        const res = {
-            buffering: Math.round(this.bufAccDuration),
-            lags: this.lags,
-        };
-        this.bufAccDuration = 0;
-        this.lags = 0;
-        if (this.container.getPlaybackType() === Playback.VOD) {
-            res.timestamp = time;
-        }
-        this.send('heatmap', res);
-        this.heatmapSent = true;
-        this.heatmapLastTime = time;
+    reset() {
+        this.active = false;
+        this.sourcesDelay = {};
     }
-    onTimeUpdateLive({ current }) {
-        // TODO check the `current` values for the live streams
-        if (!this.timeStart) {
-            this.timeStart = current;
-        }
-        try {
-            const elapsed = current - this.timeStart;
-            const heatmapElapsed = current - this.heatmapLastTime;
-            // TODO check if the heatmap is only needed for the live streams
-            if (!this.heatmapSent || heatmapElapsed >= HEATMAP_INTERVAL) {
-                this.sendHeatmap(current);
-            }
-            if (!this.watchSent && elapsed >= WATCH_CUTOFF) {
-                this.watchSent = true;
-                this.sendMessage('watch');
-            }
-        }
-        catch (error) {
-            reportError(error);
-        }
+    retryPlayback() {
+        trace(`${T$3} retryPlayback enter`, {
+            currentSourceIndex: this.currentSourceIndex,
+            currentSource: this.sourcesList[this.currentSourceIndex],
+        });
+        this.active = true;
+        this.getNextMediaSource().then((nextSource) => {
+            trace(`${T$3} retryPlayback syncing...`, {
+                nextSource,
+            });
+            const rnd = RETRY_DELAY_BLUR * Math.random();
+            this.sync(() => {
+                trace(`${T$3} retryPlayback loading...`);
+                this.core.load(nextSource.source, nextSource.mimeType);
+                trace(`${T$3} retryPlayback loaded`, {
+                    nextSource,
+                });
+                setTimeout(() => {
+                    // this.core.activePlayback.consent()
+                    this.core.activePlayback.play();
+                    trace(`${T$3} retryPlayback playing`);
+                }, rnd);
+            });
+        });
     }
-    onStart() {
-        if (this.started) {
-            return;
-        }
-        this.started = true;
-        this.sendMessage('start');
+    getNextMediaSource() {
+        return new Promise((resolve) => {
+            this.sourcesDelay[this.currentSourceIndex] = Math.min(MAX_RETRY_DELAY, (this.sourcesDelay[this.currentSourceIndex] || INITIAL_RETRY_DELAY) * 2);
+            this.currentSourceIndex =
+                (this.currentSourceIndex + 1) % this.sourcesList.length;
+            const delay = this.sourcesDelay[this.currentSourceIndex] || INITIAL_RETRY_DELAY;
+            const s = this.sourcesList[this.currentSourceIndex];
+            setTimeout(() => resolve(s), delay);
+        });
+    }
+    /**
+     * @internal
+     */
+    static get version() {
+        return VERSION$1;
     }
 }
 
@@ -50395,7 +50577,7 @@ const comboboxHTML = "<button data-subtitles-button class='media-control-button
 
 const stringHTML = "<div class=\"subtitle-string\">\n  <p></p>\n</div>\n";
 
-const VERSION$1 = '2.19.14';
+const VERSION = '2.19.14';
 const LOCAL_STORAGE_SUBTITLES_ID = 'gplayer.plugins.subtitles.selected';
 const T$2 = 'plugins.subtitles';
 const NO_TRACK = { language: 'off' };
@@ -50449,7 +50631,7 @@ class Subtitles extends UICorePlugin {
      * @internal
      */
     static get version() {
-        return VERSION$1;
+        return VERSION;
     }
     static template = tmpl(comboboxHTML);
     static templateString = tmpl(stringHTML);
@@ -50761,6 +50943,183 @@ class Subtitles extends UICorePlugin {
     }
 }
 
+// An example implementation of client side performancestatistics
+const WATCH_CUTOFF = 5;
+const STALL_MEASURE_PERIOD = 10;
+const T$1 = 'plugins.telemetry';
+/**
+ * Telemetry event type
+ */
+var TelemetryEvent;
+(function (TelemetryEvent) {
+    TelemetryEvent[TelemetryEvent["Init"] = 1] = "Init";
+    TelemetryEvent[TelemetryEvent["Start"] = 2] = "Start";
+    TelemetryEvent[TelemetryEvent["Watch"] = 3] = "Watch";
+    TelemetryEvent[TelemetryEvent["Stall"] = 4] = "Stall";
+})(TelemetryEvent || (TelemetryEvent = {}));
+/**
+ * Collects and reports the performance statistics.
+ * @beta
+ * @remarks
+ * This plugin is experimental and its API is likely to change.
+ *
+ * Configuration options {@link TelemetryPluginSettings}
+ *
+ * @example
+ * ```ts
+ * import { Statistics } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(Statistics)
+ *
+ * const player = new Player({
+ *   statistics: {
+ *     send: (data) => {
+ *        fetch('/stats', {
+ *          method: 'POST',
+ *          body: JSON.stringify(data),
+ *          headers: { 'content-type': 'application/json' },
+ *        })
+ *     },
+ *   },
+ *   ...
+ * })
+ * ```
+ */
+class Telemetry extends ContainerPlugin {
+    /**
+     * The name of the plugin.
+     */
+    get name() {
+        return 'telemetry';
+    }
+    /**
+     * The supported version of the plugin.
+     */
+    get supportedVersion() {
+        return { min: CLAPPR_VERSION };
+    }
+    started = false;
+    timeStart = 0;
+    stallSent = false;
+    stallLastTime = 0;
+    watchSent = false;
+    bufTracking = false;
+    numStalls = 0;
+    /**
+     * The time when buffering last started.
+     */
+    bufLastStarted = 0;
+    /**
+     * The accumulated buffering duration.
+     */
+    stallAcc = 0;
+    constructor(container) {
+        super(container);
+        assert(this.options.telemetry &&
+            typeof this.options.telemetry.send === 'function', 'Telemetry plugin configuration is invalid: `send` option is required');
+    }
+    /**
+     * @internal
+     */
+    bindEvents() {
+        // TODO remove this
+        // this.listenToOnce(
+        //   this.container,
+        //   CUSTOM_EVENTS_CONTAINER_START,
+        //   this.onStart,
+        // )
+        this.listenToOnce(this.container, Events$1.CONTAINER_READY, this.onReady);
+        this.listenTo(this.container, Events$1.CONTAINER_STATE_BUFFERING, this.onBuffering);
+        this.listenTo(this.container, Events$1.CONTAINER_STATE_BUFFERFULL, this.onBufferFull);
+        this.listenTo(this.container.playback, Events$1.PLAYBACK_TIMEUPDATE, this.onTimeUpdate);
+        this.listenTo(this.container.playback, Events$1.PLAYBACK_LEVEL_SWITCH_START, this.startLevelSwitch);
+        this.listenTo(this.container.playback, Events$1.PLAYBACK_LEVEL_SWITCH_END, this.endLevelSwitch);
+    }
+    startLevelSwitch() {
+        this.bufTracking = false;
+    }
+    endLevelSwitch() {
+        this.bufTracking = true;
+    }
+    onBuffering() {
+        if (this.bufTracking) {
+            this.bufLastStarted = performance.now();
+        }
+    }
+    onBufferFull() {
+        if (this.bufTracking && this.bufLastStarted) {
+            this.stallAcc += performance.now() - this.bufLastStarted;
+            this.numStalls++;
+        }
+        this.bufTracking = true;
+    }
+    onReady() {
+        this.sendInit();
+        trace(`${T$1} onReady`, {
+            autoPlay: this.options.autoPlay,
+        });
+        if (this.options.autoPlay) {
+            this.onStart();
+        }
+        else {
+            this.listenToOnce(this.container.playback, Events$1.PLAYBACK_PLAY_INTENT, this.onStart);
+        }
+    }
+    sendInit() {
+        this.send({ event: TelemetryEvent.Init });
+    }
+    send(event) {
+        this.options.telemetry.send({
+            type: this.container.getPlaybackType(),
+            ...event,
+        });
+    }
+    sendStall(time) {
+        // TODO don't send if no stalls?
+        const res = {
+            event: TelemetryEvent.Stall,
+            count: this.numStalls,
+            time,
+            total_ms: Math.round(this.stallAcc * 1000),
+        };
+        this.stallAcc = 0;
+        this.numStalls = 0;
+        this.send(res);
+        this.stallSent = true;
+        this.stallLastTime = time;
+    }
+    onTimeUpdate({ current }) {
+        if (!this.timeStart) {
+            this.timeStart = current;
+        }
+        try {
+            const elapsed = current - this.timeStart;
+            const stallElapsed = current - this.stallLastTime;
+            if (!this.stallSent || stallElapsed >= STALL_MEASURE_PERIOD) {
+                this.sendStall(current);
+            }
+            if (!this.watchSent && elapsed >= WATCH_CUTOFF) {
+                this.watchSent = true;
+                this.send({
+                    event: TelemetryEvent.Watch,
+                });
+            }
+        }
+        catch (error) {
+            reportError(error);
+        }
+    }
+    onStart() {
+        if (this.started) {
+            return;
+        }
+        this.started = true;
+        this.send({
+            event: TelemetryEvent.Start,
+        });
+    }
+}
+
 var parseSrt$1 = {exports: {}};
 
 var parseSrt = parseSrt$1.exports;
@@ -50877,7 +51236,7 @@ const parseSRT = /*@__PURE__*/getDefaultExportFromCjs$1(parseSrtExports);
 
 const pluginHtml = "<div class=\"thumbnails-text\"></div>\n<% if (backdropHeight) { %>\n    <div class=\"backdrop\" style=\"height: <%= backdropHeight %>px;\">\n        <div class=\"carousel\"></div>\n    </div>\n<% }; %>\n<% if (spotlightHeight) { %>\n    <div class=\"spotlight\" style=\"height: <%= spotlightHeight %>px;\">\n    </div>\n<% }; %>\n";
 
-const T$1 = 'plugins.media_control_thumbnails';
+const T = 'plugins.media_control_thumbnails';
 class Thumbnails extends UICorePlugin {
     _$spotlight = null;
     _$backdrop = null;
@@ -51148,7 +51507,7 @@ class Thumbnails extends UICorePlugin {
     // calculate how far along the carousel should currently be slid
     // depending on where the user is hovering on the progress bar
     _updateCarousel() {
-        trace(`${T$1} _updateCarousel`, {
+        trace(`${T} _updateCarousel`, {
             backdropHeight: this._getOptions().backdropHeight,
         });
         if (!this._getOptions().backdropHeight) {
@@ -51207,7 +51566,7 @@ class Thumbnails extends UICorePlugin {
         }
     }
     _updateSpotlightThumb() {
-        trace(`${T$1} _updateSpotlightThumb`, {
+        trace(`${T} _updateSpotlightThumb`, {
             spotlightHeight: this._getOptions().spotlightHeight,
         });
         if (!this._getOptions().spotlightHeight) {
@@ -51252,7 +51611,7 @@ class Thumbnails extends UICorePlugin {
         return 0;
     }
     _renderPlugin() {
-        trace(`${T$1} _renderPlugin`, {
+        trace(`${T} _renderPlugin`, {
             show: this._show,
             thumbsLoaded: this._thumbsLoaded,
             thumbs: this._thumbs.length,
@@ -51270,7 +51629,7 @@ class Thumbnails extends UICorePlugin {
         }
     }
     _createElements() {
-        trace(`${T$1} _createElements`);
+        trace(`${T} _createElements`);
         this.$el.html(this.template({
             'backdropHeight': this._getOptions().backdropHeight,
             'spotlightHeight': this._getOptions().spotlightHeight
@@ -51285,203 +51644,6 @@ class Thumbnails extends UICorePlugin {
     }
 }
 
-const T = 'plugins.source_controller';
-const INITIAL_RETRY_DELAY = 1000;
-const MAX_RETRY_DELAY = 5000;
-const RETRY_DELAY_BLUR = 500;
-const VERSION = '0.0.1';
-function noSync(cb) {
-    queueMicrotask(cb);
-}
-/**
- * This plugin is responsible for managing the automatic failover between sources.
- * @beta
- * @remarks
- * Have a look at the {@link https://miro.com/app/board/uXjVLiN15tY=/?share_link_id=390327585787 | source failover diagram} for the details
- * on how sources ordering and selection works.
- *
- * This plugin does not expose any public methods apart from required by the Clappr plugin interface.
- * It is supposed to work autonomously.
- *
- * @example
- * ```ts
- * import { SourceController } from '@gcorevideo/player'
- *
- * Player.registerPlugin(SourceController)
- * ```
- */
-class SourceController extends CorePlugin {
-    /*
-     * The Logic itself is quite simple:
-     * * Here is the short diagram:
-     *
-     * sources_list:
-     *       - a.mpd  |    +--------------------+
-     *       - b.m3u8 |--->|         init       |
-     *       - ...    |    |--------------------|
-     *                     | current_source = 0 |
-     *                     +--------------------+
-     *                            |
-     *                            |  source = a.mpd
-     *                            |  playback = dash.js
-     *                            v
-     *                      +------------------+
-     *                  +-->|   load source    |
-     *                  |   +---------|--------+
-     *                  |             v
-     *                  |   +------------------+
-     *                  |   |       play       |
-     *                  |   +---------|--------+
-     *                  |             |
-     *                  |             v
-     *                  |   +-----------------------+
-     *                  |   |  on playback_error    |
-     *                  |   |-----------------------|
-     *                  |   | current_source =      |
-     *                  |   |  (current_source + 1) |
-     *                  |   |  % len sources_list   |
-     *                  |   |                       |
-     *                  |   | delay 1..3s           |
-     *                  |   +---------------|-------+
-     *                  |                   |
-     *                  |   source=b.m3u8   |
-     *                  |   playback=hls.js |
-     *                  +-------------------+
-     *
-     */
-    sourcesList = [];
-    currentSourceIndex = 0;
-    sourcesDelay = {};
-    active = false;
-    sync = noSync;
-    /**
-     * @internal
-     */
-    get name() {
-        return 'source_controller';
-    }
-    /**
-     * @internal
-     */
-    get supportedVersion() {
-        return { min: CLAPPR_VERSION };
-    }
-    constructor(core) {
-        super(core);
-        this.sourcesList = this.core.options.sources;
-        if (this.core.options.source !== undefined) {
-            // prevent Clappr from loading all sources simultaneously
-            this.core.options.sources = [this.core.options.source];
-        }
-        else {
-            this.core.options.sources = this.core.options.sources.slice(0, 1);
-        }
-    }
-    /**
-     * @internal
-     */
-    bindEvents() {
-        super.bindEvents();
-        this.listenTo(this.core, Events$1.CORE_ACTIVE_CONTAINER_CHANGED, () => this.onReady());
-    }
-    onReady() {
-        trace(`${T} onReady`, {
-            retrying: this.active,
-            currentSource: this.sourcesList[this.currentSourceIndex],
-        });
-        const spinner = this.core.activeContainer?.getPlugin('spinner');
-        if (spinner) {
-            this.sync = (cb) => {
-                spinner.once(SpinnerEvents.SYNC, cb);
-            };
-        }
-        else {
-            this.sync = noSync;
-        }
-        this.bindContainerEventListeners();
-        if (this.active) {
-            this.core.activeContainer?.getPlugin('poster_custom')?.disable();
-            spinner?.show();
-        }
-    }
-    bindContainerEventListeners() {
-        this.core.activePlayback.on(Events$1.PLAYBACK_ERROR, (error) => {
-            trace(`${T} on PLAYBACK_ERROR`, {
-                error: {
-                    code: error?.code,
-                    description: error?.description,
-                    level: error?.level,
-                },
-                retrying: this.active,
-                currentSource: this.sourcesList[this.currentSourceIndex],
-            });
-            switch (error.code) {
-                case PlaybackErrorCode.MediaSourceUnavailable:
-                    this.core.activeContainer?.getPlugin('poster_custom')?.disable();
-                    this.retryPlayback();
-                    break;
-            }
-        });
-        this.core.activePlayback.on(Events$1.PLAYBACK_PLAY, () => {
-            trace(`${T} on PLAYBACK_PLAY`, {
-                currentSource: this.sourcesList[this.currentSourceIndex],
-                retrying: this.active,
-            });
-            if (this.active) {
-                this.reset();
-                // TODO make poster reset its state on enable
-                this.core.activeContainer?.getPlugin('poster_custom')?.enable();
-                this.core.activeContainer?.getPlugin('spinner')?.hide();
-            }
-        });
-    }
-    reset() {
-        this.active = false;
-        this.sourcesDelay = {};
-    }
-    retryPlayback() {
-        trace(`${T} retryPlayback enter`, {
-            currentSourceIndex: this.currentSourceIndex,
-            currentSource: this.sourcesList[this.currentSourceIndex],
-        });
-        this.active = true;
-        this.getNextMediaSource().then((nextSource) => {
-            trace(`${T} retryPlayback syncing...`, {
-                nextSource,
-            });
-            const rnd = RETRY_DELAY_BLUR * Math.random();
-            this.sync(() => {
-                trace(`${T} retryPlayback loading...`);
-                this.core.load(nextSource.source, nextSource.mimeType);
-                trace(`${T} retryPlayback loaded`, {
-                    nextSource,
-                });
-                setTimeout(() => {
-                    // this.core.activePlayback.consent()
-                    this.core.activePlayback.play();
-                    trace(`${T} retryPlayback playing`);
-                }, rnd);
-            });
-        });
-    }
-    getNextMediaSource() {
-        return new Promise((resolve) => {
-            this.sourcesDelay[this.currentSourceIndex] = Math.min(MAX_RETRY_DELAY, (this.sourcesDelay[this.currentSourceIndex] || INITIAL_RETRY_DELAY) * 2);
-            this.currentSourceIndex =
-                (this.currentSourceIndex + 1) % this.sourcesList.length;
-            const delay = this.sourcesDelay[this.currentSourceIndex] || INITIAL_RETRY_DELAY;
-            const s = this.sourcesList[this.currentSourceIndex];
-            setTimeout(() => resolve(s), delay);
-        });
-    }
-    /**
-     * @internal
-     */
-    static get version() {
-        return VERSION;
-    }
-}
-
 var VolumeFadeEvents;
 (function (VolumeFadeEvents) {
     VolumeFadeEvents["FADE"] = "core:volume:fade";
@@ -51494,15 +51656,22 @@ class VolumeFade extends UICorePlugin {
     container = null;
     delay = 0;
     interval = null;
+    /**
+     * @internal
+     */
     get name() {
         return 'volume_fade';
     }
+    /**
+     * @internal
+     */
     bindEvents() {
+        // TODO on container changed
         this.listenTo(this.core, Events$1.CORE_READY, this.onCoreReady);
         if (this.core.mediaControl) {
             this.listenTo(this.core.mediaControl, 'mediacontrol:volume:user', this._onUserChangeVolume);
         }
-        this.listenTo(this.core, 'core:volume:config', this._onVolumeConfig);
+        // this.listenTo(this.core, 'core:volume:config', this._onVolumeConfig);
     }
     unBindEvents() {
         this.core.$el.off('mouseleave.volume');
@@ -51574,4 +51743,4 @@ class VolumeFade extends UICorePlugin {
     }
 }
 
-export { AudioSelector, BigMuteButton, BottomGear, ClapprNerdStats, ClapprStats, ClickToPause, ClipsPlugin, ContextMenu, DisableControls, DvrControls, ErrorScreen, Favicon, GearEvents, GoogleAnalytics, Kibo, LevelSelector, LogTracer, Logger, Logo, MediaControl, MultiCamera, PictureInPicture, PlaybackErrorCode, PlaybackRate, Player, PlayerEvent, Poster, SeekTime, SentryTracer, Share, SkipTime, SourceController, SpinnerEvents, SpinnerThreeBounce, Statistics, Subtitles, Thumbnails, VolumeFade, VolumeFadeEvents, reportError, setTracer, trace, version };
+export { AudioSelector, BigMuteButton, BottomGear, ClapprNerdStats, ClapprStats, ClickToPause, ClipsPlugin, ContextMenu, DisableControls, DvrControls, ErrorScreen, Favicon, GearEvents, GoogleAnalytics, Kibo, LevelSelector, LogTracer, Logger, Logo, MediaControl, MultiCamera, PictureInPicture, PlaybackErrorCode, PlaybackRate, Player, PlayerEvent, Poster, SeekTime, SentryTracer, Share, SkipTime, SourceController, SpinnerEvents, SpinnerThreeBounce, Subtitles, Telemetry, TelemetryEvent, Thumbnails, VolumeFade, VolumeFadeEvents, reportError, setTracer, trace, version };