@gcorevideo/player 2.24.11 → 2.24.13

package/dist/player.d.ts

@@ -0,0 +1,3264 @@
+/**
+ * Video player for the Gcore streaming platform
+ *
+ * @remarks
+ * This package provides a video player for the Gcore streaming platform.
+ * It is built on top of the {@link https://github.com/clappr/clappr | Clappr} library and provides a framework for building custom integrations.
+ * Start with {@link Player} for more information.
+ *
+ * Various plugins (marked with `PLUGIN` keyword) are available to extend the core functionality with additional features.
+ * @example
+ * ```ts
+ * import { Player, MediaControl, ErrorScreen } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(MediaControl)
+ * Player.registerPlugin(ErrorScreen)
+ *
+ * const player = new Player({
+ *   autoPlay: true,
+ *   mute: true,
+ *   sources: [{ source: 'https://example.com/a.mpd', mimeType: 'application/dash+xml' }],
+ * })
+ *
+ * player.attachTo(document.getElementById('container'))
+ * ```
+ *
+ * @packageDocumentation
+ */
+
+import { $ } from '@clappr/core';
+import { Container } from '@clappr/core';
+import { ContainerPlugin } from '@clappr/core';
+import { Core } from '@clappr/core';
+import { CorePlugin } from '@clappr/core';
+import { Logger } from '@gcorevideo/utils';
+import { LogTracer } from '@gcorevideo/utils';
+import { reportError as reportError_2 } from '@gcorevideo/utils';
+import { SentryTracer } from '@gcorevideo/utils';
+import { setTracer } from '@gcorevideo/utils';
+import { trace } from '@gcorevideo/utils';
+import { UIContainerPlugin } from '@clappr/core';
+import { UICorePlugin } from '@clappr/core';
+import { UIObject } from '@clappr/core';
+
+/**
+ * `PLUGIN` that makes possible to switch audio tracks via the media control UI.
+ * @beta
+ * @remarks
+ * The plugin is activated when there are multiple audio tracks available.
+ * The plugin adds a button showing the current audio track and a dropdown to switch to another audio track.
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ */
+declare class AudioTracks extends UICorePlugin {
+    private currentTrack;
+    private tracks;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    static get version(): string;
+    private static readonly template;
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+    };
+    /**
+     * @internal
+     */
+    get events(): {
+        'click [data-audiotracks-select]': string;
+        'click #audiotracks-button': string;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onCoreReady;
+    private onActiveContainerChanged;
+    private shouldRender;
+    /**
+     * @internal
+     */
+    render(): this;
+    private onTrackSelect;
+    private selectAudioTrack;
+    private hideMenu;
+    private toggleMenu;
+    private buttonElement;
+    private buttonElementText;
+    private trackElement;
+    private getTitle;
+    private startTrackSwitching;
+    private updateText;
+    private highlightCurrentTrack;
+}
+export { AudioTracks as AudioSelector }
+export { AudioTracks }
+
+/**
+ * `PLUGIN` that displays a big mute button over the video when it's being played muted.
+ * @beta
+ * @remarks
+ * When pressed, it unmutes the video.
+ * @example
+ * ```ts
+ * import { BigMuteButton } from '@gcorevideo/player'
+ * Player.registerPlugin(BigMuteButton)
+ * ```
+ */
+export declare class BigMuteButton extends UICorePlugin {
+    private autoPlay;
+    private hidden;
+    private _adIsPlaying;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    private static readonly template;
+    /**
+     * @internal
+     */
+    get events(): {
+        click: string;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onCoreReady;
+    private onContainerChanged;
+    private onPlay;
+    private onStop;
+    private onPause;
+    private onContainerVolume;
+    private onPlaybackEnded;
+    private onStartAd;
+    private onFinishAd;
+    /**
+     * @internal
+     */
+    render(): this;
+    private mount;
+    private hide;
+    private show;
+    private clicked;
+}
+
+/**
+ * `PLUGIN` that adds a button to extend the media controls UI with extra options.
+ * @beta
+ * @remarks
+ * The plugin renders small gear icon to the right of the media controls.
+ * It provides a base for attaching custom settings UI in the gear menu
+ *
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * @example
+ * You can use bottom gear to add custom settings UI to the gear menu.
+ *
+ * ```ts
+ * import { BottomGear } from '@gcorevideo/player/plugins/bottom-gear';
+ *
+ * class CustomOptionsPlugin extends UICorePlugin {
+ *   // ...
+ *
+ *   override get events() {
+ *     return {
+ *       'click #my-button': 'doMyAction',
+ *     }
+ *   }
+ *
+ *   private doMyAction() {
+ *     // ...
+ *   }
+ *
+ *   override render() {
+ *     const bottomGear = this.core.getPlugin('bottom_gear');
+ *     if (!bottomGear) {
+ *       return this;
+ *     }
+ *     this.$el.html('<button class="custom-option">Custom option</button>');
+ *     // Put rendered element into the gear menu
+ *     bottomGear.addItem('custom').html(this.$el)
+ *     return this;
+ *   }
+ *
+ *   // alternatively, add an option with a submenu
+ *   override render() {
+ *     this.$el.html(template(templateHtml)({
+ *       // ...
+ *     })));
+ *     return this;
+ *   }
+ *
+ *   private addGearOption() {
+ *     this.core.getPlugin('bottom_gear')
+ *       .addItem('custom', this.$el)
+ *       .html($('<button class="custom-option">Custom option</button>'))
+ *   }
+ *
+ *   override bindEvents() {
+ *     this.listenToOnce(this.core, ClapprEvents.CORE_READY, () => {
+ *       const bottomGear = this.core.getPlugin('bottom_gear');
+ *       assert(bottomGear, 'bottom_gear plugin is required');
+ *       // simple case
+ *       this.listenTo(bottomGear, GearEvents.RENDERED, this.render);
+ *       // or with a submenu
+ *       this.listenTo(bottomGear, GearEvents.RENDERED, this.addGearOption);
+ *      });
+ *   }
+ * }
+ * ```
+ */
+export declare class BottomGear extends UICorePlugin {
+    private hd;
+    private numItems;
+    private collapsed;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    static get version(): string;
+    private static readonly template;
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+    };
+    /**
+     * @internal
+     */
+    get events(): {
+        'click #gear-button': string;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    /**
+     * Adds a custom option to the gear menu
+     * @param name - A unique name of the option
+     * @param $subMenu - The submenu to attach to the option
+     * @returns The added item placeholder to attach custom markup
+     * @remarks
+     * When called with $submenu param, a click on the added item will toggle the submenu visibility.
+     *
+     * When added without submenu, it's responsibility of the caller to handle the click event however needed.
+     * @example
+     * ```ts
+     * class MyPlugin extends UICorePlugin {
+     *   override render() {
+     *     this.$el.html('<div class="my-awesome-settings">...</div>')
+     *     this.core.getPlugin('bottom_gear')
+     *       ?.addItem('custom', this.$el)
+     *       .html($('<button>Custom settings</button>'))
+     *     return this
+     *   }
+     * }
+     * ```
+     */
+    addItem(name: string, $subMenu?: ZeptoResult): ZeptoResult;
+    private bindContainerEvents;
+    private highDefinitionUpdate;
+    /**
+     * @internal
+     */
+    render(): this;
+    /**
+     * Collapses any submenu open back to the gear menu.
+     * @remarks
+     * Should be called by the UI plugin that added a gear item with a submenu when the latter is closed (e.g., when a "back" button is clicked).
+     */
+    refresh(): void;
+    private collapseSubmenus;
+    private toggleMenu;
+    private collapse;
+    private onCoreReady;
+    private onMediaControlRendered;
+    private mount;
+    private alignSubmenu;
+}
+
+/**
+ * `PLUGIN` that measures data about playback, which can be useful for analyzing performance and UX.
+ * @beta
+ * @remarks
+ * This plugin does not render anything and is supposed to be extended or used together with other plugins that actually render something.
+ *
+ * @see {@link NerdStats} - a plugin that visualises the playback metrics
+ *
+ * Configuration options - {@link ClapprStatsSettings}
+ *
+ * Events - {@link ClapprStatsEvents}
+ */
+export declare class ClapprStats extends ContainerPlugin {
+    private timerId;
+    private lastDecodedFramesCount;
+    private metrics;
+    private timers;
+    private runEach;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    private get playbackName();
+    private get playbackType();
+    private now;
+    private inc;
+    private start;
+    private stop;
+    constructor(container: Container);
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    /**
+     * @internal
+     */
+    destroy(): void;
+    /**
+     * Returns the collected metrics.
+     * @returns Measurements collected so far
+     */
+    exportMetrics(): ClapprStatsMetrics;
+    clearMetrics(): void;
+    private onBitrate;
+    private stopReporting;
+    private startTimers;
+    private onFirstPlaying;
+    private playAfterPause;
+    private onPlay;
+    private onPause;
+    private onSeek;
+    private onTimeUpdate;
+    private onContainerUpdateWhilePlaying;
+    private onBuffering;
+    private onBufferfull;
+    private onProgress;
+    private onCompletion;
+    private buildReport;
+    private fetchFPS;
+    private calcBitrates;
+    private calcBufferingPercentage;
+    private html5FetchFPS;
+}
+
+/**
+ * @beta
+ */
+export declare type ClapprStatsBitrateTrack = {
+    start: number;
+    end?: number;
+    time?: number;
+    bitrate: number;
+};
+
+/**
+ * @beta
+ */
+export declare enum ClapprStatsChronograph {
+    Startup = "startup",
+    Watch = "watch",
+    Pause = "pause",
+    Buffering = "buffering",
+    Session = "session"
+}
+
+/**
+ * @beta
+ */
+export declare enum ClapprStatsCounter {
+    Play = "play",
+    Pause = "pause",
+    Error = "error",
+    Buffering = "buffering",
+    DecodedFrames = "decodedFrames",
+    DroppedFrames = "droppedFrames",
+    Fps = "fps",
+    ChangeLevel = "changeLevel",
+    Seek = "seek",
+    Fullscreen = "fullscreen",
+    DvrUsage = "dvrUsage"
+}
+
+/**
+ * @beta
+ */
+export declare enum ClapprStatsEvents {
+    /**
+     * Emitted periodically with current measurements.
+     */
+    REPORT = "clappr:stats:report"
+}
+
+/**
+ * @beta
+ */
+export declare type ClapprStatsMetrics = {
+    /**
+     * Events count counters
+     */
+    counters: {
+        /**
+         *
+         */
+        [ClapprStatsCounter.Play]: number;
+        [ClapprStatsCounter.Pause]: number;
+        [ClapprStatsCounter.Error]: number;
+        [ClapprStatsCounter.Buffering]: number;
+        [ClapprStatsCounter.DecodedFrames]: number;
+        [ClapprStatsCounter.DroppedFrames]: number;
+        [ClapprStatsCounter.Fps]: number;
+        [ClapprStatsCounter.ChangeLevel]: number;
+        [ClapprStatsCounter.Seek]: number;
+        [ClapprStatsCounter.Fullscreen]: number;
+        [ClapprStatsCounter.DvrUsage]: number;
+    };
+    /**
+     * Time measurements - accumulated duration of time-based activities
+     */
+    chrono: {
+        /**
+         * Time spent in the startup phase
+         */
+        [ClapprStatsChronograph.Startup]: number;
+        /**
+         * Total time spent in the watch phase
+         */
+        [ClapprStatsChronograph.Watch]: number;
+        /**
+         *
+         */
+        [ClapprStatsChronograph.Pause]: number;
+        [ClapprStatsChronograph.Buffering]: number;
+        [ClapprStatsChronograph.Session]: number;
+    };
+    extra: {
+        playbackName: string;
+        playbackType: string;
+        bitratesHistory: ClapprStatsBitrateTrack[];
+        bitrateWeightedMean: number;
+        bitrateMostUsed: number;
+        buffersize: number;
+        watchHistory: Array<[number, number]>;
+        watchedPercentage: number;
+        bufferingPercentage: number;
+        bandwidth: number;
+        duration: number;
+        currentTime: number;
+    };
+};
+
+/**
+ * Config options for the {@link ClapprStats} plugin
+ * @beta
+ */
+export declare interface ClapprStatsSettings {
+    /**
+     * The interval in milliseconds of periodic measurements.
+     * The plugin will emit a {@link ClapprStatsEvents.REPORT} event with the collected metrics at the specified interval.
+     */
+    runEach?: number;
+}
+
+/**
+ * A small `PLUGIN` that toggles the playback state on click over the video container
+ * @beta
+ */
+export declare class ClickToPause extends ContainerPlugin {
+    private pointerEnabled;
+    private timer;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private click;
+    private settingsUpdate;
+    private togglePlay;
+    private clearTimer;
+}
+
+/**
+ * `PLUGIN` that allows marking up the timeline of the video
+ * @beta
+ * @remarks
+ * The plugin decorates the seekbar with notches to indicate the clips of the video and displays current clip text in the left panel
+ *
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * Configuration options - {@link ClipsPluginSettings}
+ */
+export declare class Clips extends UICorePlugin {
+    private barStyle;
+    private clips;
+    private oldContainer;
+    private svgMask;
+    private static readonly template;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+    };
+    get version(): string;
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    render(): this;
+    destroy(): UIObject;
+    disable(): void;
+    enable(): void;
+    /**
+     * Get the text of the clip at the given time
+     * @param time - The time to get the text for
+     * @returns The text of the clip at the given time
+     */
+    getText(time: TimeValue): string | undefined;
+    private onCoreReady;
+    private onMcRender;
+    private onContainerChanged;
+    private playerResize;
+    private onTimeUpdate;
+    private parseClips;
+    private makeSvg;
+    private setSVGMask;
+    private setClipText;
+}
+
+/**
+ * Configuration options for the {@link Clips} plugin.
+ * @beta
+ */
+export declare interface ClipsPluginSettings {
+    /**
+     * The compiled text of the clips description, one clip per line in format:
+     * `HH:MM:SS text` or `MM:SS text` or `SS text`
+     */
+    text: string;
+}
+
+/**
+ * `PLUGIN` that provides a UI to select the subtitles when available.
+ * @beta
+ *
+ * @remarks
+ * The plugin is activated when closed captions tracks are detected in the media source.
+ * It shows a familiar "CC" button with a dropdown menu to select the subtitles language.
+ *
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * Configuration options -  {@link ClosedCaptionsPluginSettings}
+ * @example
+ * ```ts
+ * import { ClosedCaptions } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(ClosedCaptions)
+ *
+ * new Player({
+ *   ...
+ *   cc: {
+ *     language: 'pt-BR',
+ *   },
+ * })
+ * ```
+ */
+declare class ClosedCaptions extends UICorePlugin {
+    private isPreselectedApplied;
+    private active;
+    private track;
+    private tracks;
+    private $line;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    static get version(): string;
+    private static readonly template;
+    private static readonly templateString;
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+    };
+    /**
+     * @internal
+     */
+    get events(): {
+        'click #cc-select li a': string;
+        'click #cc-button': string;
+    };
+    private get preselectedLanguage();
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onCoreReady;
+    private onContainerChanged;
+    private onSubtitleAvailable;
+    private onSubtitleChanged;
+    private applyTracks;
+    private onStartAd;
+    private onFinishAd;
+    private playerResize;
+    /**
+     * Hides the subtitles menu and the subtitles.
+     */
+    hide(): void;
+    /**
+     * Shows the subtitles menu and the subtitles.
+     */
+    show(): void;
+    private shouldRender;
+    private resizeFont;
+    /**
+     * @internal
+     */
+    render(): this;
+    private findById;
+    private selectItem;
+    private onItemSelect;
+    private applyPreselectedSubtitles;
+    private hideMenu;
+    private toggleMenu;
+    private itemElement;
+    private allItemElements;
+    private selectSubtitles;
+    private getSubtitleText;
+    private setSubtitleText;
+    private clearSubtitleText;
+    private updateSelection;
+    private highlightCurrentSubtitles;
+    private renderIcon;
+}
+export { ClosedCaptions }
+export { ClosedCaptions as Subtitles }
+
+/**
+ * Configuration options for the {@link ClosedCaptions} plugin.
+ * @beta
+ */
+export declare type ClosedCaptionsPluginSettings = {
+    /**
+     * Initially selected subtitles language.
+     */
+    language?: string;
+};
+
+/**
+ * A `PLUGIN` that configures {@link https://cdn.cta.tech/cta/media/media/resources/standards/pdfs/cta-5004-final.pdf | CMCD} for playback
+ * @beta
+ * @remarks
+ * Configuration options - {@link CmcdConfigOptions}.
+ * @example
+ * ```ts
+ * import { CmcdConfig } from '@gcorevideo/player'
+ * Player.registerPlugin(CmcdConfig)
+ *
+ * const player = new Player({
+ *   source: 'https://example.com/video.mp4',
+ *   cmcd: {
+ *     sessionId: '1234567890',
+ *     contentId: 'f572d396fae9206628714fb2ce00f72e94f2258f',
+ *   },
+ * })
+ * ```
+ */
+export declare class CmcdConfig extends CorePlugin {
+    private sid;
+    private cid;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get version(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): string;
+    constructor(core: Core);
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    /**
+     * Returns the current `sid` and `cid` values.
+     * Useful when the auto-generated values need to be known.
+     * @returns `sid` and `cid` values
+     */
+    exportIds(): {
+        sid: string;
+        cid: string;
+    };
+    private updateSettings;
+    private generateContentId;
+}
+
+/**
+ * Config options for the {@link CmcdConfig} plugin
+ * @beta
+ */
+export declare interface CmcdConfigOptions {
+    /**
+     * `sid` value. If ommitted, a random UUID will be generated
+     */
+    sessionId?: string;
+    /**
+     * `cid` value.
+     * If ommitted, the pathname part of the first source URL will be used
+     */
+    contentId?: string;
+}
+
+/**
+ * @public
+ */
+export declare type ContainerPluginConstructor = {
+    new (container: Container): PlayerPlugin;
+    type: string;
+};
+
+/**
+ * Dimensions of the player container DOM element.
+ * @public
+ */
+export declare type ContainerSize = {
+    width: number;
+    height: number;
+};
+
+/**
+ * `PLUGIN` that displays a small context menu when clicked on the player container.
+ * @beta
+ * @remarks
+ * Configuration options - {@link ContextMenuPluginSettings}
+ *
+ * Should not be used together with {@link ClickToPause} plugin
+ */
+export declare class ContextMenu extends UIContainerPlugin {
+    private open;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+    };
+    private static readonly template;
+    /**
+     * @internal
+     */
+    get events(): {
+        'click [role="menuitem"]': string;
+    };
+    constructor(container: Container);
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    /**
+     * @internal
+     */
+    destroy(): UIObject;
+    private onContainerClick;
+    private onContextMenu;
+    private show;
+    private hide;
+    private runAction;
+    /**
+     * @internal
+     */
+    render(): this;
+    private hideOnBodyClick;
+}
+
+/**
+ * Context menu plugin settings
+ * @beta
+ */
+export declare interface ContextMenuPluginSettings {
+    options?: MenuOption[];
+}
+
+/**
+ * @public
+ */
+export declare type CorePluginConstructor = {
+    new (core: Core): PlayerPlugin;
+    type: string;
+};
+
+/**
+ * A plain JS object that must conform to the DASH.js settings schema.
+ * @public
+ * {@link https://cdn.dashjs.org/latest/jsdoc/module-Settings.html | DASH.js settings}
+ */
+export declare type DashSettings = Record<string, unknown>;
+
+/**
+ * `PLUGIN` that adds the DVR controls to the media control UI
+ *
+ * @beta
+ *
+ * @remarks
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * The plugin renders live stream indicator.
+ * If DVR is enabled, the indicator shows whether the current position is at the live edge of the stream or not.
+ * In the latter case, the indicator can be clicked to seek to the live edge.
+ */
+export declare class DvrControls extends UICorePlugin {
+    private static readonly template;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    get events(): {
+        'click #gplayer-mc-back-to-live': string;
+    };
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onCoreReady;
+    private onActiveContainerChanged;
+    private clicked;
+    /**
+     * @internal
+     */
+    render(): this;
+    private onMetadataLoaded;
+    private mount;
+    private onDvrStateChanged;
+    private toggleState;
+}
+
+/**
+ * Levels of severity of errors. Non-fatal errors usually can be ignored.
+ * @public
+ */
+export declare type ErrorLevel = 'FATAL' | 'WARN' | 'INFO';
+
+/**
+ * `PLUGIN` that displays fatal errors nicely in the overlay on top of the player.
+ * @public
+ * @remarks
+ * A fatal error is an error that prevents the player from playing the content.
+ * It's usually a network error that persists after multiple retries.
+ *
+ * The error screen should not be confused with the content stub that is shown when no media sources are available.
+ * This can happen due to the lack of the support of the given sources type or because the sources are misconfigured (e.g., omitted).
+ *
+ * Configuration options - {@link ErrorScreenPluginSettings}
+ *
+ * @example
+ * ```ts
+ * import { ErrorScreen, Player } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(ErrorScreen)
+ * ```
+ */
+export declare class ErrorScreen extends UICorePlugin {
+    private err;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    private static readonly template;
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+        'data-error-screen': string;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onPlay;
+    private unmount;
+    /**
+     * @internal
+     */
+    get events(): {
+        'click .player-error-screen__reload': string;
+    };
+    private reload;
+    private onActiveContainerChanged;
+    private onError;
+    /**
+     * @internal
+     */
+    render(): this;
+}
+
+/**
+ * Configuration options for the {@link ErrorScreen} plugin.
+ * @public
+ */
+export declare type ErrorScreenPluginSettings = {
+    /**
+     * Whether to hide the reload button.
+     */
+    noReload?: boolean;
+};
+
+/**
+ * Settings for the {@link ErrorScreen} plugin.
+ * @public
+ */
+export declare type ErrorScreenSettings = {
+    /**
+     * Whether to hide the reload button. The reload button triggers reload of the current source.
+     */
+    noReload?: boolean;
+};
+
+/**
+ * Extended events for the {@link MediaControl} plugin
+ * @beta
+ */
+export declare enum ExtendedEvents {
+    MEDIACONTROL_VOLUME = "mediacontrol:volume",
+    MEDIACONTROL_MENU_COLLAPSE = "mediacontrol:menu:collapse"
+}
+
+/**
+ * `PLUGIN` that changes the favicon according to the player's state.
+ * @beta
+ * @remarks
+ * There are three states: stopped, playing and paused.
+ */
+export declare class Favicon extends CorePlugin {
+    private oldIcon;
+    private playIcon;
+    private pauseIcon;
+    private stopIcon;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    constructor(core: Core);
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private containerChanged;
+    /**
+     * @internal
+     */
+    disable(): void;
+    /**
+     * @internal
+     */
+    destroy(): void;
+    private createIcon;
+    private setPlayIcon;
+    private setPauseIcon;
+    private resetIcon;
+    private changeIcon;
+}
+
+/**
+ * @beta
+ */
+export declare interface FaviconPluginSettings {
+    /**
+     * CSS color of the favicon.
+     */
+    faviconColor?: string;
+}
+
+/**
+ * Events triggered by the plugin
+ * @beta
+ */
+export declare enum GearEvents {
+    /**
+     * Subscribe to this event to accurately attach an item to the gear menu
+     */
+    RENDERED = "rendered"
+}
+
+/**
+ * `PLUGIN` that integrates with Google Analytics
+ * @beta
+ */
+export declare class GoogleAnalytics extends ContainerPlugin {
+    private account;
+    private trackerName;
+    private domainName;
+    private currentHDState;
+    get name(): string;
+    get supportedVersion(): {
+        min: string;
+    };
+    constructor(container: Container);
+    embedScript(): void;
+    addEventListeners(): void;
+    onReady(): void;
+    onPlay(): void;
+    onStop(): void;
+    onEnded(): void;
+    onBuffering(): void;
+    onBufferFull(): void;
+    onError(): void;
+    onHD(isHD: boolean): void;
+    private onPlaybackChanged;
+    onDVR(dvrInUse: boolean): void;
+    onPause(): void;
+    onSeek(): void;
+    onVolumeChanged(): void;
+    onFullscreen(): void;
+    push(array: string[]): void;
+}
+
+/**
+ * Telemetry init event data
+ * @beta
+ */
+export declare interface InitEventData {
+    event: TelemetryEvent.Init;
+}
+
+/**
+ * An ISO 639-1 language code.
+ * @example `pt`
+ * @public
+ */
+export declare type LangTag = string;
+
+export { Logger }
+
+/**
+ * `PLUGIN` that adds custom logo to the player.
+ * @beta
+ */
+export declare class Logo extends UIContainerPlugin {
+    private hasStartedPlaying;
+    private $logoContainer;
+    get name(): string;
+    get supportedVersion(): {
+        min: string;
+    };
+    get template(): any;
+    get attributes(): {
+        class: string;
+        'data-logo': string;
+    };
+    private get shouldRender();
+    bindEvents(): void;
+    stopListening(): this;
+    private onPlay;
+    private onStop;
+    private update;
+    constructor(container: Container);
+    render(): this;
+    private setLogoImgAttrs;
+    private setLogoWidth;
+    private setPosition;
+    private setStyles;
+    private setStyle;
+}
+
+export { LogTracer }
+
+/**
+ * `PLUGIN` that provides basic playback controls UI and a foundation for developing custom UI.
+ * @beta
+ * @remarks
+ * The methods exposed are to be used by the other plugins that extend the media control UI.
+ *
+ * Configuration options:
+ *
+ * - `mediaControl`: {@link MediaControlSettings} - specifies the allowed media control elements in each area
+ *
+ * - `persistConfig`: boolean - `common` option, makes the plugin persist the media control settings
+ *
+ * - `chromeless`: boolean
+ */
+export declare class MediaControl extends UICorePlugin {
+    private buttonsColor;
+    private currentDurationValue;
+    private currentPositionValue;
+    private currentSeekBarPercentage;
+    private disabledClickableList;
+    private displayedDuration;
+    private displayedPosition;
+    private displayedSeekBarPercentage;
+    private draggingSeekBar;
+    private draggingVolumeBar;
+    private fullScreenOnVideoTagSupported;
+    private hideId;
+    private hideVolumeId;
+    private intendedVolume;
+    private keepVisible;
+    private kibo;
+    private lastMouseX;
+    private lastMouseY;
+    private metadataLoaded;
+    private hasUpdate;
+    private persistConfig;
+    private renderTimerId;
+    private rendered;
+    private settings;
+    private userDisabled;
+    private userKeepVisible;
+    private verticalVolume;
+    private $duration;
+    private $fullscreenToggle;
+    private $multiCameraSelector;
+    private $playPauseToggle;
+    private $playStopToggle;
+    private $position;
+    private $seekBarContainer;
+    private $seekBarHover;
+    private $seekBarLoaded;
+    private $seekBarPosition;
+    private $seekBarScrubber;
+    private $volumeBarContainer;
+    private $volumeBarBackground;
+    private $volumeBarFill;
+    private $volumeBarScrubber;
+    private $volumeContainer;
+    private $volumeIcon;
+    private static readonly template;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    private get disabled();
+    /**
+     * Use in mediacontrol-based plugins to access the active container
+     * @internal
+     */
+    get container(): any;
+    /**
+     * @internal
+     * @deprecated Use core.activePlayback directly
+     */
+    get playback(): any;
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+        'data-media-control-skin-1': string;
+    };
+    /**
+     * @internal
+     */
+    get events(): {
+        'click [data-play]': string;
+        'click [data-pause]': string;
+        'click [data-playpause]': string;
+        'click [data-stop]': string;
+        'click [data-playstop]': string;
+        'click [data-fullscreen]': string;
+        'click .bar-container[data-volume]': string;
+        'click .drawer-icon[data-volume]': string;
+        'mouseenter .drawer-container[data-volume]': string;
+        'mouseleave .drawer-container[data-volume]': string;
+        'mousedown .bar-container[data-volume]': string;
+        'touchstart .bar-container[data-volume]': string;
+        'mousemove .bar-container[data-volume]': string;
+        'touchmove .bar-container[data-volume]': string;
+        'mousedown .bar-scrubber[data-seekbar]': string;
+        'mousedown .bar-container[data-seekbar]': string;
+        'touchstart .bar-scrubber[data-seekbar]': string;
+        'touchstart .bar-container[data-seekbar]': string;
+        'mousemove .bar-container[data-seekbar]': string;
+        'touchmove .bar-container[data-seekbar]': string;
+        'mouseleave .bar-container[data-seekbar]': string;
+        'touchend .bar-container[data-seekbar]': string;
+        'mouseenter .media-control-layer[data-controls]': string;
+        'mouseleave .media-control-layer[data-controls]': string;
+    };
+    get currentSeekPos(): number;
+    /**
+     * Current volume [0..100]
+     */
+    get volume(): number;
+    /**
+     * Muted state
+     */
+    get muted(): boolean;
+    constructor(core: Core);
+    /**
+     * @internal
+     */
+    getExternalInterface(): {
+        setVolume: (value: number, isInitialVolume?: boolean) => void;
+        getVolume: () => number;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private bindContainerEvents;
+    /**
+     * Hides the media control UI
+     */
+    disable(): void;
+    /**
+     * Reenables the plugin disabled earlier with the {@link MediaControl.disable} method
+     */
+    enable(): void;
+    /**
+     *
+     * @returns  Vertical space available to render something on top of the container.
+     * @remarks
+     * This takes into account the container height and excludes the height of the controls bar
+     */
+    getAvailableHeight(): number;
+    /**
+     * Set the initial volume, which is preserved when playback is interrupted by an advertisement
+     */
+    setInitialVolume(): void;
+    private onVolumeChanged;
+    private onLoadedMetadata;
+    private updateVolumeUI;
+    private changeTogglePlay;
+    private mousemoveOnSeekBar;
+    private mouseleaveOnSeekBar;
+    private onVolumeClick;
+    private mousemoveOnVolumeBar;
+    private playerResize;
+    private togglePlayPause;
+    private togglePlayStop;
+    private startSeekDrag;
+    private startVolumeDrag;
+    private stopDrag;
+    private updateDrag;
+    private getVolumeFromUIEvent;
+    private toggleMute;
+    /**
+     * Set the volume
+     * @param value - The volume value
+     * @param isInitialVolume - save as the initial volume
+     * @remarks
+     * Initial volume can be restored later
+     */
+    setVolume(value: number, isInitialVolume?: boolean): void;
+    private toggleFullscreen;
+    private onActiveContainerChanged;
+    private showVolumeBar;
+    private hideVolumeBar;
+    private ended;
+    private updateProgressBar;
+    private onTimeUpdate;
+    private renderSeekBar;
+    private drawDurationAndPosition;
+    private seek;
+    private setUserKeepVisible;
+    private resetUserKeepVisible;
+    private isVisible;
+    private show;
+    private hide;
+    private updateCursorStyle;
+    private updateSettings;
+    private onHdUpdate;
+    private createCachedElements;
+    /**
+     * Get a media control element DOM node
+     * @param name - The name of the media control element
+     * @returns The DOM node to render to or extend
+     * @remarks
+     * Use this method to render custom media control UI in a plugin
+     * @example
+     * ```ts
+     * class MyPlugin extends UICorePlugin {
+     *   override render() {
+     *     this.$el.html('<div data-clips>Here we go</div>')
+     *     this.core.getPlugin('media_control').mount('clips', this.$el)
+     *     return this
+     *   }
+     * }
+     * ```
+     */
+    mount(name: MediaControlElement, element: ZeptoResult): void;
+    /**
+     * Toggle the visibility of a media control element
+     * @param name - The name of the media control element
+     * @param show - Visibility state
+     */
+    toggleElement(area: MediaControlElement, show: boolean): void;
+    private getRightPanel;
+    private getLeftPanel;
+    private getCenterPanel;
+    private resetIndicators;
+    private initializeIcons;
+    private setSeekPercentage;
+    private seekRelative;
+    private bindKeyAndShow;
+    private bindKeyEvents;
+    private unbindKeyEvents;
+    private parseColors;
+    private applyButtonStyle;
+    /**
+     * @internal
+     */
+    destroy(): UIObject;
+    private cancelRenderTimer;
+    private configure;
+    /**
+     * @internal
+     */
+    render(): this;
+    private handleFullScreenOnBtn;
+    private onStartAd;
+    private onFinishAd;
+    private hideControllAds;
+    private static getPageX;
+    private static getPageY;
+    /**
+     * Enable the user interaction disabled earlier
+     */
+    enableControlButton(): void;
+    /**
+     * Disable the user interaction for the control buttons
+     */
+    disabledControlButton(): void;
+    private isSeekEnabledForHtml5Playback;
+    private getElementLocation;
+    private onDvrStateChanged;
+}
+
+/**
+ * Built-in media control elements.
+ * @beta
+ */
+export declare type MediaControlElement = MediaControlLeftElement | MediaControlLayerElement | MediaControlRightElement;
+
+/**
+ * Media control elements that appear in main layer, spanning the entire width of the player.
+ * @beta
+ */
+export declare type MediaControlLayerElement = 'seekbar' | 'seekBarContainer';
+
+/**
+ * Media control elements that appear in the left area.
+ * @beta
+ */
+export declare type MediaControlLeftElement = 'clipText' | 'duration' | 'dvr' | 'playpause' | 'playstop' | 'position' | 'volume' | 'clips';
+
+/**
+ * Media control elements that appear in the right area.
+ * @beta
+ */
+export declare type MediaControlRightElement = 'audiotracks' | 'cc' | 'fullscreen' | 'hd-indicator' | 'gear' | 'multicamera' | 'pip' | 'vr';
+
+/**
+ * Specifies the allowed media control elements in each area.
+ * Can be used to restrict rendered media control elements.
+ * @beta
+ */
+export declare type MediaControlSettings = {
+    left: MediaControlLeftElement[];
+    right: MediaControlRightElement[];
+    default: MediaControlLayerElement[];
+    seekEnabled: boolean;
+};
+
+/**
+ * @beta
+ */
+export declare type MenuOption = {
+    /**
+     * Menu item label text. One of `label` or `labelKey` must be specified.
+     */
+    label?: string;
+    /**
+     * Menu item label localisation key, if specified, the `label` will be ignored
+     */
+    labelKey?: string;
+    /**
+     * Menu item name. Must be unique.
+     */
+    name: string;
+    /**
+     * Menu item handler function
+     */
+    handler?: () => void;
+    /**
+     * Menu item icon, plain HTML string
+     */
+    icon?: string;
+};
+
+/**
+ * `PLUGIN` that adds support for loading multiple streams and switching between them using the media control UI.
+ * @beta
+ */
+export declare class MultiCamera extends UICorePlugin {
+    private currentCamera;
+    private currentTime;
+    private playing;
+    private multicamera;
+    private noActiveStreams;
+    get name(): string;
+    get supportedVersion(): {
+        min: string;
+    };
+    static get version(): string;
+    get template(): any;
+    get attributes(): {
+        class: string;
+        'data-multicamera': string;
+    };
+    get events(): {
+        'click [data-multicamera-selector-select]': string;
+        'click [data-multicamera-button]': string;
+    };
+    constructor(core: Core);
+    bindEvents(): void;
+    unBindEvents(): void;
+    private onPlay;
+    private bindPlaybackEvents;
+    private reload;
+    private shouldRender;
+    render(): this;
+    private onCameraSelect;
+    activeById(id: number, active: boolean): void;
+    private setLiveStatus;
+    private behaviorLive;
+    private behaviorOne;
+    private behaviorAll;
+    private findAndInitNextStream;
+    private showError;
+    private hideError;
+    private changeById;
+    private getCamerasList;
+    private getCurrentCamera;
+    private findElementById;
+    private findIndexById;
+    private onShowLevelSelectMenu;
+    private hideSelectLevelMenu;
+    private toggleContextMenu;
+    private levelElement;
+    private highlightCurrentLevel;
+}
+
+/**
+ * `PLUGIN` that displays useful statistics regarding the playback as well as the network quality estimation.
+ * @beta
+ *
+ * @remarks
+ * Depends on:
+ *
+ * - {@link BottomGear} - where the button is attached
+ *
+ * - {@link ClapprStats} - to get the metrics from
+ *
+ * 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.
+ */
+declare class NerdStats extends UICorePlugin {
+    private container;
+    private speedtestMetrics;
+    private metrics;
+    private open;
+    private shortcut;
+    private iconPosition;
+    private static readonly buttonTemplate;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    private static readonly template;
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+    };
+    /**
+     * @internal
+     */
+    get events(): {
+        click: string;
+        'click #nerd-stats-close': string;
+        'click #nerd-stats-refresh': string;
+    };
+    private clicked;
+    private get statsBoxElem();
+    private get statsBoxWidthThreshold();
+    private get playerWidth();
+    private get playerHeight();
+    constructor(core: Core);
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onCoreReady;
+    private onActiveContainerChanged;
+    /**
+     * @internal
+     */
+    destroy(): UIObject;
+    private toggle;
+    private show;
+    private hide;
+    private onPlayerResize;
+    private updateResolution;
+    private estimateQuality;
+    private updateMetrics;
+    private updateCustomMetrics;
+    private updateEstimatedQuality;
+    private setStatsBoxSize;
+    /**
+     * @internal
+     */
+    render(): this;
+    private attach;
+    private clearSpeedtestMetrics;
+    private refreshSpeedTest;
+    private formatPlaybackName;
+}
+export { NerdStats as ClapprNerdStats }
+export { NerdStats }
+
+/**
+ * `PLUGIN` that 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.
+ */
+export declare class PictureInPicture extends UICorePlugin {
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    static get version(): string;
+    private static buttonTemplate;
+    /**
+     * @internal
+     */
+    get events(): {
+        'click button': string;
+    };
+    get attributes(): {
+        class: string;
+    };
+    private get videoElement();
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private isPiPSupported;
+    /**
+     * @internal
+     */
+    render(): this;
+    private togglePictureInPicture;
+    private requestPictureInPicture;
+    private exitPictureInPicture;
+}
+
+/**
+ * An error occurred during the playback.
+ * @public
+ */
+export declare interface PlaybackError {
+    /**
+     * Error code.
+     */
+    code: PlaybackErrorCode;
+    /**
+     * Detailed description of the error.
+     */
+    description: string;
+    /**
+     * Level of severity of the error.
+     */
+    level: ErrorLevel;
+    /**
+     * Error message. Non-fatal usually can be ignored.
+     */
+    message: string;
+    /**
+     * Name of the component that originated the error.
+     * @example
+     * - 'core'
+     * - 'dash'
+     * - 'media_control'
+     */
+    origin: string;
+    /**
+     * Component subsystem of the error origin, together with the `origin` uniquely identifies the originating component.
+     */
+    scope: PlayerComponentType;
+    /**
+     * UI description of the error.
+     */
+    UI?: {
+        title: string;
+        message: string;
+        icon?: string;
+    };
+}
+
+/**
+ * Codes of errors occurring within the playback component.
+ * @public
+ */
+export declare enum PlaybackErrorCode {
+    /**
+     * An unknown or uncategorised error.
+     */
+    Generic = "GENERIC_ERROR",
+    /**
+     * The media source is not available. Typically a network error.
+     */
+    MediaSourceUnavailable = "MEDIA_SOURCE_UNAVAILABLE",
+    /**
+     * The media source is not accessible due to some protection policy.
+     */
+    MediaSourceAccessDenied = "MEDIA_SOURCE_ACCESS_DENIED"
+}
+
+/**
+ * Module to perform the playback.
+ * @public
+ */
+export declare type PlaybackModule = 'dash' | 'hls' | 'html5_video';
+
+/**
+ * `PLUGIN` that allows changing the playback speed of the video.
+ * @beta
+ *
+ * @remarks
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * - {@link BottomGear}
+ *
+ * It renders an option in the gear menu, which opens a dropdown with the options to change the playback rate.
+ * Note that the playback rate change is supported only for VOD or DVR-enabled live streams.
+ *
+ * Plugin settings - {@link PlaybackRateSettings}
+ *
+ * @example
+ * ```ts
+ * import { Player, PlaybackRateSettings } from '@gcorevideo/player'
+ * Player.registerPlugin(PlaybackRate)
+ * const player = new Player({
+ *   playbackRate: {
+ *     options: [
+ *       { value: 0.5, label: '0.5x' },
+ *       { value: 1, label: '1x' },
+ *     ],
+ *     defaultValue: 1,
+ *   },
+ * })
+ * ```
+ */
+export declare class PlaybackRate extends UICorePlugin {
+    private selectedRate;
+    private metadataLoaded;
+    private mountTimerId;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    private static readonly buttonTemplate;
+    private static readonly listTemplate;
+    constructor(core: Core);
+    private get playbackRates();
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+    };
+    /**
+     * @internal
+     */
+    get events(): {
+        'click [data-rate]': string;
+        'click #playback-rate-back-button': string;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onCoreReady;
+    private onActiveContainerChange;
+    private onMediaControlRendered;
+    private onGearRendered;
+    private mount;
+    private onMetaDataLoaded;
+    private allRateElements;
+    private rateElement;
+    private onPlaybackRateChange;
+    private shouldMount;
+    /**
+     * @internal
+     */
+    render(): this;
+    /**
+     * @internal
+     */
+    destroy(): UIObject;
+    private onPlay;
+    private syncRate;
+    private resetPlaybackRate;
+    private onStop;
+    private onSelect;
+    private goBack;
+    private setSelectedRate;
+    private getTitle;
+    private highlightCurrentRate;
+    private updateGearOptionLabel;
+}
+
+/**
+ * @beta
+ */
+export declare type PlaybackRateOption = {
+    value: number;
+    label: string;
+};
+
+/**
+ * @beta
+ */
+export declare type PlaybackRateSettings = {
+    options?: PlaybackRateOption[];
+    defaultValue?: number;
+};
+
+/**
+ * Type of a stream
+ * @public
+ */
+export declare type PlaybackType = 'live' | 'vod';
+
+/**
+ * `MAIN` component to use in the application code.
+ * @public
+ * @remarks
+ * The Player object provides very basic API to control playback.
+ * To build a sophisticated UI, use the plugins framework to tap into the Clappr core.
+ * {@link https://github.com/clappr/clappr/wiki/Architecture}
+ */
+export declare class Player {
+    private config;
+    private emitter;
+    private player;
+    private ready;
+    private rootNode;
+    constructor(config: PlayerConfig);
+    /**
+     * Adds a listener to a player event
+     * @param event - event type, see {@link PlayerEvent}
+     * @param handler - a callback function to handle the event
+     */
+    on<E extends PlayerEvent>(event: E, handler: PlayerEventHandler<E>): void;
+    /**
+     * Removes a previously added event listener
+     * @param event - See {@link PlayerEvent}
+     * @param handler - a callback attached earlier to that event type
+     */
+    off<E extends PlayerEvent>(event: E, handler: PlayerEventHandler<E>): void;
+    /**
+     * Configures the player.
+     *
+     * @param config - complete or partial configuration
+     * @remarks
+     * Can be called multiple times.
+     * Each consequent call extends the previous configuration with only the new keys overridden.
+     *
+     * After a reconfiguration, if something significant has changed, it might make sense reinitialize the player (i.e, a `.destroy()` followed by an `.init()` call).
+     */
+    configure(config: Partial<PlayerConfig>): void;
+    /**
+     * Initializes the player at the given container element.
+     * @param playerElement - DOM element to host the player
+     * @remarks
+     * The player will be initialized and attached to the given element.
+     *
+     * All the core plugins will be initialized at this point.
+     *
+     * If no sources were configured, it will trigger an error.
+     *
+     * The player container will be initialized and then all the registered UI plugins.
+     *
+     * If the `autoPlay` option is set, then it will trigger playback immediately.
+     *
+     * It is an error to call this method twice. If you need to attache player to another DOM element,
+     * first call {@link Player.destroy} and then {@link Player.attachTo}.
+     *
+     * @example
+     * ```ts
+     * const player = new Player({
+     *   sources: [{ source: 'https://example.com/a.mpd', mimeType: 'application/dash+xml' }],
+     * })
+     * document.addEventListener('DOMContentLoaded', () => {
+     *   player.attachTo(document.getElementById('video-container'))
+     * })
+     * ```
+     */
+    attachTo(playerElement: HTMLElement): void;
+    /**
+     * Destroys the player, releasing all resources and unmounting its UI from the DOM.
+     */
+    destroy(): void;
+    /**
+     * Current playback (time since the beginning of the stream), if appropriate.
+     *
+     * @returns Time in seconds
+     * @remarks
+     * For live streams, it returns the current time within the current segment.
+     */
+    getCurrentTime(): number;
+    /**
+     * Duration of the current media in seconds, if appropriate.
+     *
+     * @returns Time in seconds
+     * @remarks
+     * For live streams, it returns the duration of the current segment.
+     */
+    getDuration(): number;
+    /**
+     * Indicates whether DVR is enabled.
+     */
+    isDvrEnabled(): boolean;
+    /**
+     * Indicates whether DVR is in use.
+     * @remarks
+     * DVR mode, if it is enabled, is triggered we a user seeks behind the live edge.
+     */
+    isDvrInUse(): boolean;
+    /**
+     * Indicates muted state of the video.
+     * @remarks
+     * Note that muted state is independent from the volume level.
+     * See {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/muted}
+     */
+    isMuted(): boolean;
+    /**
+     * Indicates the playing state.
+     */
+    isPlaying(): boolean;
+    /**
+     * Mutes the sound of the video.
+     */
+    mute(): void;
+    /**
+     * Unmutes the video sound.
+     */
+    unmute(): void;
+    /**
+     * Pauses playback.
+     */
+    pause(): void;
+    /**
+     * Starts playback.
+     */
+    play(): void;
+    /**
+     * Resizes the player container element and everything within it.
+     * @param newSize - new size of the player
+     * @remarks
+     * Use this method when the player itself does not detect properly the change in size of its container element.
+     * It can be a case for orientation change on some mobile devices.
+     */
+    resize(newSize: ContainerSize): void;
+    /**
+     * Seeks to the given time.
+     * @param time - time to seek to in seconds (since the beginning of the stream)
+     */
+    seek(time: number): void;
+    /**
+     * Gets the current volume of the media content being played.
+     * @returns a number between 0 and 1
+     */
+    getVolume(): number;
+    /**
+     * Sets the current volume of the media content being played.
+     * @param volume - a number between 0 and 1
+     */
+    setVolume(volume: number): void;
+    /**
+     * Stops playback.
+     */
+    stop(): void;
+    /**
+     * Registers a plugin.
+     * @param plugin - a plugin class
+     * @remarks
+     * Use this method to extend the player with custom behavior.
+     * The plugin class must inherit from one of the Clappr UIPlugin, UIContainerPlugin or CorePlugin classes.
+     * A core plugin will be initialized and attached to the player when the player is initialized.
+     * A UI plugin will be initialized and attached to the player container is initialized.
+     *
+     * @see {@link https://github.com/clappr/clappr/wiki/Architecture}
+     * @example
+     * ```ts
+     * import MyPlugin from './MyPlugin.js'
+     *
+     * Player.registerPlugin(MyPlugin)
+     * ```
+     */
+    static registerPlugin(plugin: PlayerPluginConstructor): void;
+    /**
+     * Unregisters a plugin registered earlier with {@link Player.registerPlugin}.
+     * @remarks
+     * It can be also used to unregister a built-in default plugin.
+     *
+     * Currently, the plugins that are always registered are:
+     *
+     * - {@link https://github.com/clappr/clappr-core/blob/3126c3a38a6eee9d5aba3918b194e6380fa1178c/src/plugins/strings/strings.js | 'strings'}, which supports internationalization of the player UI
+     *
+     * - {@link https://github.com/clappr/clappr-core/blob/3126c3a38a6eee9d5aba3918b194e6380fa1178c/src/plugins/sources/sources.js | 'sources'}, which lets to specify multiple media sources and selects the first suitable playback module
+     *
+     * @param name - name of the plugin
+     */
+    static unregisterPlugin(name: string): void;
+    private static getRegisteredPlugins;
+    private static corePlugins;
+    private setConfig;
+    private initPlayer;
+    private tuneIn;
+    private triggerAutoPlay;
+    private safeTriggerEvent;
+    private events;
+    private buildCoreOptions;
+    private configurePlaybacks;
+    private buildMediaSourcesList;
+    private bindContainerEventListeners;
+    private bindCoreListeners;
+}
+
+/**
+ * Subsystems of a player component.
+ * @public
+ */
+export declare type PlayerComponentType = 'container' | 'core' | 'playback';
+
+/**
+ * Configuration options for the player
+ *
+ * @remarks
+ *  You can specify multiple sources, each in two forms: just a plain URL or a full object with `source` and `mimeType` fields {@link PlayerMediaSource}.
+ *  The player will pick the first viable media source according to the source availability, and either the transport preference or standard transport selection order.
+ *
+ * `priorityTransport` is used to specify the preferred transport protocol
+ * when multiple sources are available.
+ * It will first try to use the transport specified if it's supported (by a playback engine) and the source is available.
+ * Otherwise it will try the other transports in the regular order (dash, hls, mpegts).
+ *
+ * The `autoPlay` option should be used together with the {@link PlayerConfig.mute | mute} to avoid issues with the browsers' autoplay policies.
+ *
+ * Note that the `playbackType` is specified explicitly in the examle below, but a playback engine might be able to detect the type of the stream automatically.
+ *
+ * A plugin options can be specified in the configuration object under a unique key, typically corresponding to the plugin name.
+ * The plugin object will have access to the internal normalized configuration object that contains all the custom options.
+ * in the examle below, the `poster` field is the `Poster` plugin configuration options.
+ *
+ * @example
+ * ```ts
+ * {
+ *   autoPlay: true,
+ *   mute: true,
+ *   playbackType: 'live',
+ *   priorityTransport: 'dash',
+ *   sources: [{
+ *     source: 'https://example.com/myownair66.mpd',
+ *     mimeType: 'application/dash+xml',
+ *   }, {
+ *     source: 'https://example.com/myownair66.m3u8',
+ *     mimeType: 'application/x-mpegURL',
+ *   }],
+ *   poster: {
+ *     url: settings.poster,
+ *   },
+ * }
+ * ```
+ * @public
+ */
+export declare interface PlayerConfig extends Record<string, unknown> {
+    /**
+     * Start playback automatically when the player is ready
+     * @defaultValue false
+     */
+    autoPlay?: boolean;
+    /**
+     * Configuration settings for the DASH playback engine
+     * @defaultValue \{\}
+     * {@link https://cdn.dashjs.org/latest/jsdoc/module-Settings.html}
+     */
+    dash?: DashSettings;
+    /**
+     * Controls the debug output level
+     * @defaultValue 'none'
+     */
+    debug?: PlayerDebugSettings;
+    /**
+     * A language code for the player UI, for example, `es`. Must reference a key in the {@link PlayerConfig.strings | strings} record.
+     * @defaultValue 'en'
+     */
+    language?: string;
+    /**
+     * Repeat playback when the media ends.
+     * Is used with the `vod` {@link PlayerConfig.playbackType | playbackType}
+     * @defaultValue false
+     */
+    loop?: boolean;
+    /**
+     * Mute the audio output in order to comply with browsers' autoplay policy.
+     * @defaultValue false
+     */
+    mute?: boolean;
+    /**
+     * Stream type.
+     * @remarks
+     * Should only be set if known in advance, as it should not change once determined.
+     * Otherwise it might cause inconsistencies in the UI plugins behavior, for instance, glitches with rendering of the DVR controls or seek bar.
+     */
+    playbackType?: PlaybackType;
+    /**
+     * Preferred transport protocol when multiple sources are available.
+     * @defaultValue 'dash'
+     */
+    priorityTransport?: TransportPreference;
+    /**
+     * List of media sources, at least one is required.
+     */
+    sources: PlayerMediaSource[];
+    /**
+     * Localization strings for the player UI.
+     */
+    strings?: TranslationSettings;
+}
+
+/**
+ * @remarks `true` is equivalent to `'all'`, `false` is equivalent to `'none'`
+ * @public
+ */
+export declare type PlayerDebugSettings = PlayerDebugTag | boolean;
+
+/**
+ * Debug output category selector
+ * @public
+ */
+export declare type PlayerDebugTag = 'all' | 'clappr' | 'dash' | 'hls' | 'none';
+
+/**
+ * A top-level event on the player object
+ * @public
+ */
+export declare enum PlayerEvent {
+    /**
+     * Playback has reached the end of the media.
+     */
+    Ended = "ended",
+    /**
+     * An error occurred.
+     * Parameters: {@link PlaybackError}
+     */
+    Error = "error",
+    /**
+     * The player has switched to or from the fullscreen mode.
+     * Parameters:`boolean` isFullscreen
+     */
+    Fullscreen = "fullscreen",
+    /**
+     * The player is ready to use.
+     */
+    Ready = "ready",
+    /**
+     * Playback has started.
+     */
+    Play = "play",
+    /**
+     * Playback has been paused.
+     */
+    Pause = "pause",
+    /**
+     * The player's container has been resized.
+     * Parameters: {@link ContainerSize}
+     */
+    Resize = "resize",
+    /**
+     * The player is seeking to a new position.
+     */
+    Seek = "seek",
+    /**
+     * Playback has been stopped.
+     */
+    Stop = "stop",
+    /**
+     * The current playback time has changed.
+     * Parameters: {@link TimePosition}
+     */
+    TimeUpdate = "timeupdate",
+    /**
+     * The volume has changed.
+     * Parameters: `number` volume in the range 0..1
+     */
+    VolumeUpdate = "volumeupdate"
+}
+
+/**
+ * Type of a listener callback function for a player event.
+ * See the description of the event parameters in {@link PlayerEvent}.
+ * @public
+ */
+export declare type PlayerEventHandler<E extends PlayerEvent> = (...args: PlayerEventParams<E>) => void;
+
+/**
+ * @public
+ */
+export declare type PlayerEventParams<E extends PlayerEvent> = E extends PlayerEvent.Seek ? [number] : E extends PlayerEvent.VolumeUpdate ? [number] : E extends PlayerEvent.TimeUpdate ? [TimePosition] : E extends PlayerEvent.Resize ? [{
+    width: number;
+    height: number;
+}] : E extends PlayerEvent.Fullscreen ? [boolean] : E extends PlayerEvent.Error ? [PlaybackError] : [];
+
+/**
+ * A media source to fetch the media data from
+ * @public
+ */
+export declare type PlayerMediaSource = string | PlayerMediaSourceDesc;
+
+/**
+ * Describes a media source with its MIME type and URL.
+ *
+ * @remarks
+ * When the MIME type is provided, it helps the player determine the appropriate playback engine.
+ * If omitted, the player will attempt to detect the type from the source URL extension.
+ * @public
+ */
+export declare interface PlayerMediaSourceDesc {
+    /**
+     * The MIME type of the media source (e.g. `"video/mp4"`, `"application/x-mpegURL"`).
+     * Necessary if the type cannot be detected from file extension of the source URL.
+     */
+    mimeType?: string;
+    /**
+     * URL of the media source
+     */
+    source: string;
+}
+
+/**
+ * @public
+ * @see {@link https://clappr.github.io/classes/UIContainerPlugin.html},
+ * {@link https://clappr.github.io/classes/ContainerPlugin.html}
+ */
+export declare type PlayerPlugin = {
+    name: string;
+};
+
+/**
+ * @public
+ */
+export declare type PlayerPluginConstructor = CorePluginConstructor | ContainerPluginConstructor;
+
+/**
+ * `PLUGIN` that displays a poster image in the background and a big play button on top when playback is stopped
+ * @beta
+ * @remarks
+ * When the playback is stopped or not yet started, the media control UI is disabled and hidden.
+ * Media control gets activated once the metadata is loaded after playback is initiated.
+ * This plugin displays a big play button on top of the poster image to allow user to start playback.
+ * Note that the poster image, if specified via the player config, will be used to update video element's poster attribute by the
+ * HTML5-video-based playback module.
+ *
+ * Configuration options - {@link PosterPluginSettings}
+ *
+ * @example
+ * ```ts
+ * new Player({
+ *  ...
+ *  poster: {
+ *    showForNoOp: true,
+ *    url: 'https://via.placeholder.com/150.png',
+ *  }
+ * })
+ * ```
+ */
+export declare class Poster extends UIContainerPlugin {
+    private hasFatalError;
+    private playing;
+    private playRequested;
+    private $playButton;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    private static readonly template;
+    private get shouldRender();
+    private get isNoOp();
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+    };
+    /**
+     * @internal
+     */
+    get events(): {
+        click: string;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    /**
+     * Reenables earlier disabled plugin
+     */
+    enable(): void;
+    /**
+     * Disables the plugin, unmounting it from the DOM
+     */
+    disable(): void;
+    private onError;
+    private onPlay;
+    private onPlayIntent;
+    private onStop;
+    private updatePlayButton;
+    private showPlayButton;
+    private hidePlayButton;
+    private clicked;
+    private shouldHideOnPlay;
+    private update;
+    private updatePoster;
+    private showPoster;
+    private hidePoster;
+    /**
+     * @internal
+     */
+    render(): this;
+    /**
+     * @internal
+     */
+    destroy(): this;
+}
+
+/**
+ * Config options for the {@link Poster} plugin
+ * @beta
+ */
+export declare interface PosterPluginSettings {
+    /**
+     * Custom CSS background
+     */
+    custom?: string;
+    /**
+     * Whether to show the poster image when the playback is noop (i.e., when there is no appropriate video playback engine for current media sources set or the media sources are not set at all)
+     */
+    showForNoOp?: boolean;
+    /**
+     * Poster image URL
+     */
+    url?: string;
+    /**
+     * Whether to show the poster after playback has ended, by default `true`
+     */
+    showOnVideoEnd?: boolean;
+}
+
+/**
+ * A level of quality within a media source/representation.
+ * @public
+ */
+export declare interface QualityLevel {
+    /**
+     * Zero-based index of the quality level.
+     * Quality levels go from low to high
+     */
+    level: number;
+    /**
+     * Width of the video frame, pixels.
+     */
+    width: number;
+    /**
+     * Height of the video frame, pixels.
+     */
+    height: number;
+    /**
+     * Bitrate of the video, bps.
+     */
+    bitrate: number;
+}
+
+/**
+ * `PLUGIN` that provides a UI to select the desired quality level of the playback.
+ * @beta
+ *
+ * @remarks
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * - {@link BottomGear}
+ *
+ * The plugin is rendered as an item in the gear menu, which, when clicked, shows a list of quality levels to choose from.
+ *
+ * Configuration options - {@link QualityLevelsPluginSettings}
+ *
+ * @example
+ * ```ts
+ * new Player({
+ *   qualityLevels: {
+ *     restrictResolution: 360,
+ *     labels: { 360: 'SD', 720: 'HD' },
+ *   },
+ * })
+ * ```
+ */
+declare class QualityLevels extends UICorePlugin {
+    private levels;
+    private levelLabels;
+    private removeAuto;
+    private isHd;
+    private currentText;
+    private selectedLevelId;
+    private static readonly buttonTemplate;
+    private static readonly listTemplate;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    static get version(): string;
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+        'data-level-selector': string;
+    };
+    get events(): {
+        'click .gear-sub-menu_btn': string;
+        'click .go-back': string;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onCoreReady;
+    private onGearRendered;
+    private onActiveContainerChange;
+    private updateHd;
+    private onStop;
+    private shouldRender;
+    /**
+     * @internal
+     */
+    render(): this;
+    private renderDropdown;
+    private updateButton;
+    private get pluginOptions();
+    private get maxLevel();
+    private onLevelsAvailable;
+    private makeLevelsLabels;
+    private onSelect;
+    private goBack;
+    private setLevel;
+    private allLevelElements;
+    private levelElement;
+    private onLevelSwitchStart;
+    private onLevelSwitchEnd;
+    private updateText;
+    private getLevelLabel;
+    private onBitrate;
+    private highlightCurrentLevel;
+}
+export { QualityLevels as LevelSelector }
+export { QualityLevels }
+
+/**
+ * Configuration options for the {@link QualityLevels} plugin.
+ * @beta
+ */
+export declare interface QualityLevelsPluginSettings {
+    /**
+     * The maximum resolution to allow in the level selector.
+     */
+    restrictResolution?: number;
+    /**
+     * The labels to show in the level selector.
+     * @example
+     * ```ts
+     * { 360: 'SD', 720: 'HD' }
+     * ```
+     */
+    labels?: Record<number, string>;
+}
+
+export { reportError_2 as reportError }
+
+/**
+ * `PLUGIN` that adds a seek time indicator when the mouse pointer is over the seek bar.
+ * @beta
+ * @remarks
+ * Configuration options - {@link SeekTimeSettings}
+ */
+export declare class SeekTime extends UICorePlugin {
+    get name(): string;
+    get supportedVersion(): {
+        min: string;
+    };
+    private static readonly template;
+    get attributes(): {
+        class: string;
+    };
+    private get isLiveStreamWithDvr();
+    private get showDuration();
+    private hoveringOverSeekBar;
+    private hoverPosition;
+    private displayedDuration;
+    private displayedSeekTime;
+    private duration;
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onCoreReady;
+    private onContainerChanged;
+    private onTimeUpdate;
+    private showTime;
+    private hideTime;
+    private calculateHoverPosition;
+    private getSeekTime;
+    private update;
+    private shouldBeVisible;
+    /**
+     * @internal
+     */
+    render(): this;
+    private mount;
+}
+
+/**
+ * Configuration options for the SeekTime plugin.
+ * @beta
+ */
+export declare type SeekTimeSettings = {
+    /**
+     * Whether to show the duration of the video. Applies only to the VOD streams.
+     * @beta
+     */
+    duration?: boolean;
+};
+
+export { SentryTracer }
+
+export { setTracer }
+
+/**
+ * `PLUGIN` that adds a share button to the media control UI.
+ * @beta
+ */
+export declare class Share extends UICorePlugin {
+    private hide;
+    private container;
+    get name(): string;
+    get supportedVersion(): {
+        min: string;
+    };
+    get template(): any;
+    get attributes(): {
+        class: string;
+        'data-share': string;
+    };
+    get events(): {
+        'click [data-share-button]': string;
+        'click [data-share-close]': string;
+        'click [data-share-fb]': string;
+        'click [data-share-tw]': string;
+        'click [data-share-link]': string;
+        'click [data-share-embed]': string;
+    };
+    bindEvents(): void;
+    unBindEvents(): void;
+    canShowShare(): void;
+    private onReady;
+    render(): this;
+    hideShare(): void;
+    showShare(): void;
+    initializeIcons(): void;
+    onShareShow(): void;
+    onShareHide(): void;
+    onShareFB(): void;
+    onShareTW(): void;
+    onShareLinkClick(): void;
+    onShareEmbedClick(): void;
+}
+
+/**
+ * `PLUGIN` that allows skipping time by tapping on the left or right side of the video.
+ * @beta
+ */
+export declare class SkipTime extends UICorePlugin {
+    get name(): string;
+    get supportedVersion(): {
+        min: string;
+    };
+    get container(): any;
+    private static readonly template;
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+    };
+    private position;
+    /**
+     * @internal
+     */
+    get events(): {
+        'click #mc-skip-left': string;
+        'click #mc-skip-mid': string;
+        'click #mc-skip-right': string;
+    };
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onContainerChanged;
+    private setBack;
+    private handleRewindClicks;
+    private handleSkip;
+    private setMidClick;
+    private setForward;
+    private toggleFullscreen;
+    /**
+     * @internal
+     */
+    render(): this;
+    private mount;
+}
+
+/**
+ * `PLUGIN` that is managing the automatic failover between media sources.
+ * @public
+ * @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. Below is a simplified diagram:
+ *
+ * ```markdown
+ * 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 |
+ *                  +-------------------+
+ *
+ * ```
+ *
+ * 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)
+ * ```
+ */
+export declare class SourceController extends CorePlugin {
+    private sourcesList;
+    private currentSourceIndex;
+    private sourcesDelay;
+    private active;
+    private autoPlay;
+    private switching;
+    private sync;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @param core - The Clappr core instance.
+     */
+    constructor(core: Core);
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onCoreReady;
+    private onActiveContainerChanged;
+    private bindContainerEventListeners;
+    private reset;
+    private retryPlayback;
+    private getNextMediaSource;
+    /**
+     * @internal
+     */
+    static get version(): string;
+}
+
+/**
+ * Custom events emitted by the plugin
+ * @public
+ */
+export declare enum SpinnerEvents {
+    /**
+     * Emitted at the end of the spinner animation cycle to facilitate smooth UI updates,
+     * for instance, {@link SourceController} listens to this event to reload the source when the spinner is hidden
+     */
+    SYNC = "plugins:spinner:sync"
+}
+
+/**
+ * `PLUGIN` that shows a pending operation indicator when playback is buffering or in a similar state.
+ * @public
+ * @remarks
+ * It is aliased as `Spinner` for convenience.
+ * Events emitted - {@link SpinnerEvents}
+ * Other plugins can use {@link SpinnerThreeBounce.show | show} and {@link SpinnerThreeBounce.hide | hide} methods to
+ * implement custom pending/progress indication scenarios.
+ */
+declare class SpinnerThreeBounce extends UIContainerPlugin {
+    private userShown;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    get attributes(): {
+        'data-spinner': string;
+        class: string;
+    };
+    private showTimeout;
+    private template;
+    private hasFatalError;
+    private hasBuffering;
+    constructor(container: Container);
+    private onBuffering;
+    private onBufferFull;
+    private onPlay;
+    private onStop;
+    private onError;
+    /**
+     * Shows the spinner.
+     *
+     * The method call prevents spinner's built-in logic from automatically hiding it until {@link SpinnerThreeBounce.hide} is called
+     *
+     * @param delay - The delay in milliseconds before the spinner is shown.
+     */
+    show(delay?: number): void;
+    /**
+     * Hides the spinner.
+     */
+    hide(): void;
+    private _show;
+    private _hide;
+    /**
+     * @internal
+     */
+    render(): this;
+}
+export { SpinnerThreeBounce as Spinner }
+export { SpinnerThreeBounce }
+
+/**
+ * Playback stall event data
+ * @beta
+ */
+export declare interface StallEventData {
+    event: TelemetryEvent.Stall;
+    /**
+     * Accumulated buffering duration over the measurement interval, ms
+     */
+    total_ms: number;
+    /**
+     * Number of stalls
+     */
+    count: number;
+    /**
+     * Playback time when the stall is reported at the end of a stall measurement interval, s
+     */
+    time: number;
+}
+
+/**
+ * Telemetry start event data
+ * @beta
+ */
+export declare interface StartEventData {
+    event: TelemetryEvent.Start;
+}
+
+/**
+ * `PLUGIN` that 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' },
+ *        })
+ *     },
+ *   },
+ *   ...
+ * })
+ * ```
+ */
+export declare class Telemetry extends ContainerPlugin {
+    /**
+     * The name of the plugin.
+     */
+    get name(): string;
+    /**
+     * The supported version of the plugin.
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    private started;
+    private timeStart;
+    private stallSent;
+    private stallLastTime;
+    private watchSent;
+    private bufTracking;
+    private numStalls;
+    /**
+     * The time when buffering last started.
+     */
+    private bufLastStarted;
+    /**
+     * The accumulated buffering duration.
+     */
+    private stallAcc;
+    constructor(container: Container);
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private startLevelSwitch;
+    private endLevelSwitch;
+    private onBuffering;
+    private onBufferFull;
+    private onReady;
+    private sendInit;
+    private send;
+    private sendStall;
+    private onTimeUpdate;
+    private onStart;
+}
+
+/**
+ * Telemetry event type
+ * @beta
+ */
+export declare enum TelemetryEvent {
+    Init = 1,
+    Start = 2,
+    Watch = 3,
+    Stall = 4
+}
+
+/**
+ * Telemetry event data
+ * @beta
+ */
+export declare type TelemetryEventData = StallEventData | InitEventData | StartEventData | WatchEventData;
+
+/**
+ * Plugin settings
+ * @beta
+ */
+export declare interface TelemetryPluginSettings {
+    /**
+     * Sends the statistics record to the storage.
+     * The actual delivery is presumably async and batched.
+     */
+    send: TelemetrySendFn;
+}
+
+/**
+ * Telemetry record
+ * @beta
+ */
+export declare type TelemetryRecord = {
+    type: PlaybackType;
+} & TelemetryEventData;
+
+/**
+ * Callback to send the telemetry record to the storage.
+ * @param data - The telemetry record to send.
+ * @beta
+ */
+export declare type TelemetrySendFn = (data: TelemetryRecord) => void;
+
+/**
+ * `PLUGIN` that displays the thumbnails of the video when available.
+ * @beta
+ * @remarks
+ * The plugin needs specially crafted VTT file with a thumbnail sprite sheet to work.
+ * The VTT consist of timestamp records followed by a thumbnail area
+ *
+ * Configuration options - {@link ThumbnailsPluginSettings}
+ *
+ * @example
+ * ```ts
+ * import { Thumbnails } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(Thumbnails)
+ *
+ * new Player({
+ *   thumbnails: {
+ *     backdropHeight: 200,
+ *     backdropMinOpacity: 0.9,
+ *     backdropMaxOpacity: 0.99,
+ *     spotlightHeight: 100,
+ *     vtt: '1\n00:00:00,000 --> 00:00:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,0,100,56\n\n2\n00:00:10,000 --> 00:00:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,0,100,56\n\n3\n00:00:20,000 --> 00:00:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,0,100,56\n\n4\n00:00:30,000 --> 00:00:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,0,100,56\n\n5\n00:00:40,000 --> 00:00:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,0,100,56\n\n6\n00:00:50,000 --> 00:01:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,0,100,56\n\n7\n00:01:00,000 --> 00:01:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,0,100,56\n\n8\n00:01:10,000 --> 00:01:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,56,100,56\n\n9\n00:01:20,000 --> 00:01:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,56,100,56\n\n10\n00:01:30,000 --> 00:01:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,56,100,56\n\n11\n00:01:40,000 --> 00:01:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,56,100,56\n\n12\n00:01:50,000 --> 00:02:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,56,100,56\n\n13\n00:02:00,000 --> 00:02:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,56,100,56\n\n14\n00:02:10,000 --> 00:02:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,56,100,56\n\n15\n00:02:20,000 --> 00:02:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,112,100,56\n\n16\n00:02:30,000 --> 00:02:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,112,100,56\n\n17\n00:02:40,000 --> 00:02:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,112,100,56\n\n18\n00:02:50,000 --> 00:03:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,112,100,56\n\n19\n00:03:00,000 --> 00:03:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,112,100,56\n\n20\n00:03:10,000 --> 00:03:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,112,100,56\n\n21\n00:03:20,000 --> 00:03:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,112,100,56\n\n22\n00:03:30,000 --> 00:03:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,168,100,56\n\n23\n00:03:40,000 --> 00:03:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,168,100,56\n\n24\n00:03:50,000 --> 00:04:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,168,100,56\n\n25\n00:04:00,000 --> 00:04:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,168,100,56\n\n26\n00:04:10,000 --> 00:04:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,168,100,56\n\n27\n00:04:20,000 --> 00:04:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,168,100,56\n\n28\n00:04:30,000 --> 00:04:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,168,100,56\n\n29\n00:04:40,000 --> 00:04:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,224,100,56\n\n30\n00:04:50,000 --> 00:05:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,224,100,56\n\n31\n00:05:00,000 --> 00:05:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,224,100,56\n\n32\n00:05:10,000 --> 00:05:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,224,100,56\n\n33\n00:05:20,000 --> 00:05:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,224,100,56\n\n34\n00:05:30,000 --> 00:05:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,224,100,56\n\n35\n00:05:40,000 --> 00:05:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,224,100,56\n\n36\n00:05:50,000 --> 00:06:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,280,100,56\n\n37\n00:06:00,000 --> 00:06:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,280,100,56\n\n38\n00:06:10,000 --> 00:06:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,280,100,56\n\n39\n00:06:20,000 --> 00:06:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,280,100,56\n\n40\n00:06:30,000 --> 00:06:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,280,100,56\n\n41\n00:06:40,000 --> 00:06:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,280,100,56\n\n42\n00:06:50,000 --> 00:07:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,280,100,56\n\n43\n00:07:00,000 --> 00:07:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,336,100,56\n\n44\n00:07:10,000 --> 00:07:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,336,100,56\n\n45\n00:07:20,000 --> 00:07:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,336,100,56\n\n46\n00:07:30,000 --> 00:07:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,336,100,56\n\n47\n00:07:40,000 --> 00:07:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,336,100,56\n\n48\n00:07:50,000 --> 00:08:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,336,100,56\n\n49\n00:08:00,000 --> 00:08:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,336,100,56\n',
+ *     sprite:
+ *      'https://static.gvideo.co/videoplatform/sprites/2675/2452164_3dk4NsRt6vWsffEr.mp4_sprite.jpg',
+ *   },
+ * })
+ * ```
+ */
+export declare class Thumbnails extends UICorePlugin {
+    private $backdropCarouselImgs;
+    private spriteSheetHeight;
+    private spriteSheetWidth;
+    private hoverPosition;
+    private showing;
+    private thumbsLoaded;
+    private spotlightHeight;
+    private backdropHeight;
+    private thumbs;
+    /**
+     * @internal
+     */
+    get name(): string;
+    /**
+     * @internal
+     */
+    get supportedVersion(): {
+        min: string;
+    };
+    /**
+     * @internal
+     */
+    get attributes(): {
+        class: string;
+    };
+    private static readonly template;
+    constructor(core: Core);
+    private buildSpriteConfig;
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private bindContainerEvents;
+    private onCoreReady;
+    private loadSpriteSheet;
+    private onContainerChanged;
+    private init;
+    private mount;
+    private onMouseMoveSeekbar;
+    private onMouseLeave;
+    private buildThumbImage;
+    private loadBackdrop;
+    private setText;
+    private updateCarousel;
+    private updateSpotlightThumb;
+    private getThumbIndexForTime;
+    private update;
+    private fixElements;
+    private get shouldRender();
+    render(): this;
+}
+
+/**
+ * Plugin configuration options for the thumbnails plugin.
+ * @beta
+ */
+export declare type ThumbnailsPluginSettings = {
+    backdropHeight?: number;
+    backdropMaxOpacity?: number;
+    backdropMinOpacity?: number;
+    spotlightHeight?: number;
+    sprite: string;
+    vtt: string;
+};
+
+/**
+ * Current playback time and total duration of the media.
+ * @public
+ */
+export declare interface TimePosition {
+    /**
+     * Current playback time, 0..duration
+     */
+    current: TimeValue;
+    /**
+     * Total duration of the media content (or DVR window size or segment duration for live streams)
+     */
+    total: TimeValue;
+}
+
+/**
+ * Time progress information indicated by Clappr CONTAINER_PROGRESS and PLAYBACK_PROGRESS events.
+ * @beta
+ */
+export declare type TimeProgress = {
+    /**
+     * Current playback time
+     */
+    start: TimeValue;
+    /**
+     * Current buffer length beginning from the start (=current) time
+     */
+    current: TimeValue;
+    /**
+     * Total duration of the media content
+     */
+    total: TimeValue;
+};
+
+/**
+ * For the plugin development
+ * @beta
+ * @deprecated  Use TimePosition instead
+ */
+export declare type TimeUpdate = TimePosition;
+
+/**
+ * Playback time position in seconds since the beginning of the stream.
+ * For the live streams this is limited to the length of a segment. When DVR is enabled, this refers to the
+ * @public
+ */
+export declare type TimeValue = number;
+
+export { trace }
+
+/**
+ * @public
+ */
+export declare type TranslationKey = string;
+
+/**
+ * Localization strings for the player UI.
+ * @remarks
+ * The keys are language codes, and the values are objects with keys being the translation keys and values being the translations.
+ *
+ * This dictionary is used to localize the player UI, including the error messages and is shared across all the player components (including the plugins).
+ *
+ * @example
+ * ```
+ * {
+ *   en: {
+ *     play: 'Play',
+ *     ...
+ *   },
+ *   es: {
+ *     play: 'Reproducir',
+ *     ...
+ *   },
+ *   ...
+ * }
+ * ```
+ *
+ * @public
+ */
+export declare type TranslationSettings = Partial<Record<LangTag, Record<TranslationKey, string>>>;
+
+/**
+ * Preferred streaming media delivery protocol
+ * @public
+ */
+export declare type TransportPreference = 'dash' | 'hls';
+
+/**
+ * Version information about the gplayer and its main dependencies
+ * @returns Version information about the gplayer and its main dependencies
+ * @beta
+ */
+export declare function version(): {
+    gplayer: string;
+    clappr: string;
+    dashjs: string;
+    hlsjs: string;
+};
+
+/**
+ * `PLUGIN` that mutes the sound and fades it in when the mouse is over the player.
+ * @beta
+ *
+ * @remarks
+ * When the user moves the mouse over and away from the player, the sound is unmuted and unmuted with a fade effect.
+ *
+ * Depends on {@link MediaControl} plugin.
+ * Configuration options - {@link VolumeFadeSettings}
+ */
+export declare class VolumeFade extends UICorePlugin {
+    private activeVolume;
+    private duration;
+    private timerId;
+    /**
+     * @internal
+     */
+    get name(): string;
+    constructor(core: Core);
+    /**
+     * @internal
+     */
+    bindEvents(): void;
+    private onCoreReady;
+    private onVolumeChange;
+    private onEnter;
+    private onLeave;
+    private fade;
+    private stopFade;
+}
+
+/**
+ * Events emitted by the VolumeFade plugin.
+ * @beta
+ */
+export declare enum VolumeFadeEvents {
+    FADE = "core:volume:fade"
+}
+
+/**
+ * @beta
+ */
+export declare type VolumeFadeSettings = {
+    /**
+     * Initial active volume level, effective until volume is changed via media control
+     */
+    level?: number;
+    /**
+     * Fade duration, ms
+     */
+    duration?: number;
+};
+
+/**
+ * Telemetry watch event data
+ * @beta
+ */
+export declare interface WatchEventData {
+    event: TelemetryEvent.Watch;
+}
+
+/**
+ * {@link https://zeptojs.com/#$() | Zepto query result}
+ * @beta
+ */
+export declare type ZeptoResult = ReturnType<typeof $>;
+
+export { }