@theoplayer/web-ui 1.5.0 → 1.6.0

package/dist/THEOplayerUI.d.ts

@@ -1,5 +1,5 @@
 /*!
- * THEOplayer Open Video UI for Web (v1.5.0)
+ * THEOplayer Open Video UI for Web (v1.6.0)
  * License: MIT
  */
 import { ChromelessPlayer, VideoQuality, THEOplayerError, MediaTrack, TextTrack, TextTracksList, EdgeStyle, VendorCast, CastState, PlayerConfiguration, SourceDescription } from 'theoplayer/chromeless';
@@ -13,6 +13,11 @@ declare class ControlBar extends HTMLElement {
     constructor();
     connectedCallback(): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-control-bar': ControlBar;
+    }
+}
 
 declare enum Attribute {
     CONFIGURATION = "configuration",
@@ -111,6 +116,11 @@ declare class Button extends HTMLElement {
      */
     protected handleClick(): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-button': Button;
+    }
+}
 
 declare function linkButtonTemplate(button: string, extraCss?: string): string;
 /**
@@ -139,6 +149,11 @@ declare class LinkButton extends HTMLElement {
     private readonly _onClick;
     protected handleClick(): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-link-button': LinkButton;
+    }
+}
 
 type Constructor<T> = abstract new (...args: any[]) => T;
 
@@ -216,6 +231,11 @@ declare class PlayButton extends PlayButton_base {
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
     private _updateAriaLabel;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-play-button': PlayButton;
+    }
+}
 
 type VolumeLevel = 'off' | 'low' | 'high';
 declare const MuteButton_base: typeof Button & Constructor<StateReceiverElement>;
@@ -242,6 +262,11 @@ declare class MuteButton extends MuteButton_base {
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
     private _updateAriaLabel;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-mute-button': MuteButton;
+    }
+}
 
 declare const SeekButton_base: typeof Button & Constructor<StateReceiverElement>;
 /**
@@ -267,6 +292,11 @@ declare class SeekButton extends SeekButton_base {
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
     private _updateAriaLabel;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-seek-button': SeekButton;
+    }
+}
 
 declare const TimeDisplay_base: {
     new (): HTMLElement;
@@ -295,6 +325,11 @@ declare class TimeDisplay extends TimeDisplay_base {
     private readonly _updateFromPlayer;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-time-display': TimeDisplay;
+    }
+}
 
 declare const DurationDisplay_base: {
     new (): HTMLElement;
@@ -315,6 +350,11 @@ declare class DurationDisplay extends DurationDisplay_base {
     set player(player: ChromelessPlayer | undefined);
     private readonly _updateFromPlayer;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-duration-display': DurationDisplay;
+    }
+}
 
 /**
  * `<theoplayer-radio-button>` - A button that can be checked.
@@ -341,6 +381,11 @@ declare class RadioButton extends Button {
     protected handleClick(): void;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-radio-button': RadioButton;
+    }
+}
 
 declare const RadioGroup_base: {
     new (): HTMLElement;
@@ -384,6 +429,11 @@ declare class RadioGroup extends RadioGroup_base {
     setCheckedRadioButton(checkedButton: RadioButton | null): void;
     private readonly _onButtonChange;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-radio-group': RadioGroup;
+    }
+}
 
 interface MenuOptions {
     template?: HTMLTemplateElement;
@@ -397,6 +447,9 @@ declare function menuTemplate(heading: string, content: string, extraCss?: strin
  * @attribute `menu-close-on-input` - Whether to automatically close the menu whenever one of its controls
  *   receives an input (e.g. when a radio button is clicked).
  * @attribute `menu-opened` (readonly) - Whether the menu is currently open.
+ *
+ * @slot `heading` - A slot for the menu's heading.
+ *
  * @group Components
  */
 declare class Menu extends HTMLElement {
@@ -415,6 +468,12 @@ declare class Menu extends HTMLElement {
     protected _upgradeProperty(prop: keyof this): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /**
+     * Whether to automatically close the menu whenever one of its controls
+     * receives an input (e.g. when a radio button is clicked).
+     */
+    get closeOnInput(): boolean;
+    set closeOnInput(value: boolean);
     /**
      * Open the menu.
      */
@@ -426,6 +485,11 @@ declare class Menu extends HTMLElement {
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
     private readonly _onContentInput;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-menu': Menu;
+    }
+}
 
 interface MenuGroupOptions {
     template?: HTMLTemplateElement;
@@ -509,6 +573,11 @@ declare class MenuGroup extends HTMLElement {
     private readonly _onMenuChange;
     private readonly _onKeyDown;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-menu-group': MenuGroup;
+    }
+}
 
 /**
  * `<theoplayer-menu-button>` - A menu button that opens a {@link Menu}.
@@ -528,6 +597,11 @@ declare class MenuButton extends Button {
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
     protected handleClick(): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-menu-button': MenuButton;
+    }
+}
 
 /**
  * `<theoplayer-menu-close-button>` - A button that closes its parent menu.
@@ -542,6 +616,11 @@ declare class CloseMenuButton extends Button {
     connectedCallback(): void;
     protected handleClick(): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-menu-close-button': CloseMenuButton;
+    }
+}
 
 /**
  * `<theoplayer-media-track-radio-button>` - A radio button that shows the label of a given media track,
@@ -563,6 +642,11 @@ declare class MediaTrackRadioButton extends RadioButton {
     private readonly _onTrackChange;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-media-track-radio-button': MediaTrackRadioButton;
+    }
+}
 
 type TrackType = 'audio' | 'video' | 'subtitles';
 declare const TrackRadioGroup_base: {
@@ -611,6 +695,11 @@ declare class TrackRadioGroup extends TrackRadioGroup_base {
     private readonly _onChange;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-track-radio-group': TrackRadioGroup;
+    }
+}
 
 /**
  * `<theoplayer-text-track-radio-button>` -A radio button that shows the label of a given text track, and switches to that track when clicked.
@@ -631,6 +720,11 @@ declare class TextTrackRadioButton extends RadioButton {
     private readonly _onTrackChange;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-text-track-radio-button': TextTrackRadioButton;
+    }
+}
 
 /**
  * `<theoplayer-text-track-off-radio-button>` - A radio button that disables the active subtitle track when clicked.
@@ -647,6 +741,11 @@ declare class TextTrackOffRadioButton extends RadioButton {
     private readonly _onTrackChange;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-text-track-off-radio-button': TextTrackOffRadioButton;
+    }
+}
 
 interface TextTrackStyleMap {
     fontFamily: string | undefined;
@@ -701,6 +800,11 @@ declare class TextTrackStyleRadioGroup extends TextTrackStyleRadioGroup_base {
     private _updateToPlayer;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-text-track-style-radio-group': TextTrackStyleRadioGroup;
+    }
+}
 
 declare const TextTrackStyleDisplay_base: {
     new (): HTMLElement;
@@ -730,20 +834,34 @@ declare class TextTrackStyleDisplay extends TextTrackStyleDisplay_base {
     private readonly _updateFromPlayer;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-text-track-style-display': TextTrackStyleDisplay;
+    }
+}
 
 /**
  * `<theoplayer-text-track-style-menu>` - A menu to change the {@link theoplayer!TextTrackStyle | text track style} of the player.
  *
+ * @slot `heading` - A slot for the menu's heading.
+ *
  * @group Components
  */
 declare class TextTrackStyleMenu extends MenuGroup {
     constructor();
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-text-track-style-menu': TextTrackStyleMenu;
+    }
+}
 
 declare const LanguageMenu_base: typeof MenuGroup & Constructor<StateReceiverElement>;
 /**
  * `<theoplayer-language-menu>` - A menu to change the spoken language and subtitles of the stream.
  *
+ * @slot `heading` - A slot for the menu's heading.
+ *
  * @group Components
  */
 declare class LanguageMenu extends LanguageMenu_base {
@@ -756,6 +874,11 @@ declare class LanguageMenu extends LanguageMenu_base {
     private readonly _updateTextTracks;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-language-menu': LanguageMenu;
+    }
+}
 
 declare const LanguageMenuButton_base: typeof MenuButton & Constructor<StateReceiverElement>;
 /**
@@ -774,6 +897,11 @@ declare class LanguageMenuButton extends LanguageMenuButton_base {
     set player(player: ChromelessPlayer | undefined);
     private readonly _updateTracks;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-language-menu-button': LanguageMenuButton;
+    }
+}
 
 declare const PlaybackRateRadioGroup_base: {
     new (): HTMLElement;
@@ -808,6 +936,11 @@ declare class PlaybackRateRadioGroup extends PlaybackRateRadioGroup_base {
     private readonly _onChange;
     private readonly _updateFromPlayer;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-playback-rate-radio-group': PlaybackRateRadioGroup;
+    }
+}
 
 /**
  * `<theoplayer-playback-rate-menu-button>` - A menu button that opens a [playback rate menu]{@link PlaybackRateMenu}.
@@ -819,15 +952,27 @@ declare class PlaybackRateMenuButton extends MenuButton {
     constructor();
     connectedCallback(): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-playback-rate-menu-button': PlaybackRateMenuButton;
+    }
+}
 
 /**
  * `<theoplayer-playback-rate-menu>` - A menu to change the playback rate of the player.
  *
+ * @slot `heading` - A slot for the menu's heading.
+ *
  * @group Components
  */
 declare class PlaybackRateMenu extends Menu {
     constructor();
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-playback-rate-menu': PlaybackRateMenu;
+    }
+}
 
 declare const PlaybackRateDisplay_base: {
     new (): HTMLElement;
@@ -847,6 +992,11 @@ declare class PlaybackRateDisplay extends PlaybackRateDisplay_base {
     get playbackRate(): number;
     set playbackRate(value: number);
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-playback-rate-display': PlaybackRateDisplay;
+    }
+}
 
 declare const ActiveQualityDisplay_base: {
     new (): HTMLElement;
@@ -870,6 +1020,11 @@ declare class ActiveQualityDisplay extends ActiveQualityDisplay_base {
     set targetVideoQualities(qualities: VideoQuality[] | undefined);
     private update_;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-active-quality-display': ActiveQualityDisplay;
+    }
+}
 
 /**
  * `<theoplayer-quality-radio-button>` - A radio button that shows the label of a given video quality,
@@ -897,6 +1052,11 @@ declare class QualityRadioButton extends RadioButton {
     private _updateTargetQuality;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-quality-radio-button': QualityRadioButton;
+    }
+}
 
 declare const QualityRadioGroup_base: {
     new (): HTMLElement;
@@ -922,6 +1082,11 @@ declare class QualityRadioGroup extends QualityRadioGroup_base {
     private readonly _updateTrack;
     private readonly _update;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-quality-radio-group': QualityRadioGroup;
+    }
+}
 
 declare const TextTrackStyleResetButton_base: typeof Button & Constructor<StateReceiverElement>;
 /**
@@ -937,16 +1102,28 @@ declare class TextTrackStyleResetButton extends TextTrackStyleResetButton_base {
     set player(player: ChromelessPlayer | undefined);
     protected handleClick(): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-text-track-style-reset-button': TextTrackStyleResetButton;
+    }
+}
 
 /**
  * `<theoplayer-settings-menu>` - A menu to change the settings of the player,
  * such as the active video quality and the playback speed.
  *
+ * @slot `heading` - A slot for the menu's heading.
+ *
  * @group Components
  */
 declare class SettingsMenu extends MenuGroup {
     constructor();
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-settings-menu': SettingsMenu;
+    }
+}
 
 /**
  * `<theoplayer-settings-menu-button>` - A menu button that opens a {@link SettingsMenu}.
@@ -958,6 +1135,11 @@ declare class SettingsMenuButton extends MenuButton {
     constructor();
     connectedCallback(): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-settings-menu-button': SettingsMenuButton;
+    }
+}
 
 declare const FullscreenButton_base: typeof Button & Constructor<StateReceiverElement>;
 /**
@@ -975,6 +1157,11 @@ declare class FullscreenButton extends FullscreenButton_base {
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
     private _updateAriaLabel;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-fullscreen-button': FullscreenButton;
+    }
+}
 
 declare class ColorStops {
     private _stops;
@@ -1106,6 +1293,11 @@ declare class PreviewThumbnail extends PreviewThumbnail_base {
     private showThumbnail_;
     private hideThumbnail_;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-preview-thumbnail': PreviewThumbnail;
+    }
+}
 
 declare const PreviewTimeDisplay_base: {
     new (): HTMLElement;
@@ -1136,6 +1328,11 @@ declare class PreviewTimeDisplay extends PreviewTimeDisplay_base {
     private readonly _update;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-preview-time-display': PreviewTimeDisplay;
+    }
+}
 
 declare const TimeRange_base: typeof Range & Constructor<StateReceiverElement>;
 /**
@@ -1180,6 +1377,11 @@ declare class TimeRange extends TimeRange_base {
     private readonly _onAdChange;
     protected handleKeyDown_(e: KeyboardEvent): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-time-range': TimeRange;
+    }
+}
 
 declare const VolumeRange_base: typeof Range & Constructor<StateReceiverElement>;
 /**
@@ -1198,6 +1400,11 @@ declare class VolumeRange extends VolumeRange_base {
     protected getAriaValueText(): string;
     protected handleInput(): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-volume-range': VolumeRange;
+    }
+}
 
 declare const ErrorDisplay_base: {
     new (): HTMLElement;
@@ -1224,6 +1431,11 @@ declare class ErrorDisplay extends ErrorDisplay_base {
     set fullscreen(fullscreen: boolean);
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-error-display': ErrorDisplay;
+    }
+}
 
 /**
  * A generic button to start and stop casting.
@@ -1237,7 +1449,7 @@ declare class CastButton extends Button {
     constructor(options?: ButtonOptions);
     connectedCallback(): void;
     /**
-     * The cast API for which this cast button.
+     * The cast API for this cast button.
      */
     get castApi(): VendorCast | undefined;
     set castApi(castApi: VendorCast | undefined);
@@ -1265,6 +1477,11 @@ declare class ChromecastButton extends ChromecastButton_base {
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
     private _updateAriaLabel;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-chromecast-button': ChromecastButton;
+    }
+}
 
 declare const ChromecastDisplay_base: {
     new (): HTMLElement;
@@ -1285,6 +1502,11 @@ declare class ChromecastDisplay extends ChromecastDisplay_base {
     set player(player: ChromelessPlayer | undefined);
     private readonly _updateFromPlayer;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-chromecast-display': ChromecastDisplay;
+    }
+}
 
 declare const AirPlayButton_base: typeof CastButton & Constructor<StateReceiverElement>;
 /**
@@ -1301,6 +1523,11 @@ declare class AirPlayButton extends AirPlayButton_base {
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
     private _updateAriaLabel;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-airplay-button': AirPlayButton;
+    }
+}
 
 declare const LoadingIndicator_base: {
     new (): HTMLElement;
@@ -1323,6 +1550,11 @@ declare class LoadingIndicator extends LoadingIndicator_base {
     private readonly _updateFromPlayer;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-loading-indicator': LoadingIndicator;
+    }
+}
 
 declare const GestureReceiver_base: {
     new (): HTMLElement;
@@ -1349,6 +1581,11 @@ declare class GestureReceiver extends GestureReceiver_base {
     handleTap(_event: MouseEvent): void;
     handleMouseClick(_event: MouseEvent): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-gesture-receiver': GestureReceiver;
+    }
+}
 
 declare const LiveButton_base: typeof Button & Constructor<StateReceiverElement>;
 /**
@@ -1380,12 +1617,20 @@ declare class LiveButton extends LiveButton_base {
     protected handleClick(): void;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-live-button': LiveButton;
+    }
+}
 
 declare const AdDisplay_base: {
     new (): HTMLElement;
     prototype: HTMLElement;
 } & Constructor<StateReceiverElement>;
 /**
+ * `<theoplayer-ad-countdown>` - A control that shows when an advertisement is playing,
+ * and the number of the current ad in the ad break (if the break has multiple ads).
+ *
  * @group Components
  */
 declare class AdDisplay extends AdDisplay_base {
@@ -1398,12 +1643,19 @@ declare class AdDisplay extends AdDisplay_base {
     set player(player: ChromelessPlayer | undefined);
     private readonly _updateFromPlayer;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-ad-display': AdDisplay;
+    }
+}
 
 declare const AdCountdown_base: {
     new (): HTMLElement;
     prototype: HTMLElement;
 } & Constructor<StateReceiverElement>;
 /**
+ * `<theoplayer-ad-countdown>` - A control that displays the remaining time of the current ad break.
+ *
  * @group Components
  */
 declare class AdCountdown extends AdCountdown_base {
@@ -1417,9 +1669,16 @@ declare class AdCountdown extends AdCountdown_base {
     private readonly _onAdChange;
     private readonly _update;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-ad-countdown': AdCountdown;
+    }
+}
 
 declare const AdClickThroughButton_base: typeof LinkButton & Constructor<StateReceiverElement>;
 /**
+ * `<theoplayer-ad-clickthrough-button>` - A button to open the advertisement's click-through webpage.
+ *
  * @group Components
  */
 declare class AdClickThroughButton extends AdClickThroughButton_base {
@@ -1435,9 +1694,17 @@ declare class AdClickThroughButton extends AdClickThroughButton_base {
     private readonly _updateFromPlayer;
     protected handleClick(): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-ad-clickthrough-button': AdClickThroughButton;
+    }
+}
 
 declare const AdSkipButton_base: typeof Button & Constructor<StateReceiverElement>;
 /**
+ * `<theoplayer-ad-skip-button>` - A button that skips the current advertisement (if skippable).
+ * If the ad cannot be skipped yet, it shows the remaining time until it can be skipped.
+ *
  * @group Components
  */
 declare class AdSkipButton extends AdSkipButton_base {
@@ -1454,6 +1721,11 @@ declare class AdSkipButton extends AdSkipButton_base {
     private readonly _onAdChange;
     private readonly _update;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-ad-skip-button': AdSkipButton;
+    }
+}
 
 declare enum ExtensionSlot {
     TopControlBar = "top-control-bar",
@@ -1461,6 +1733,8 @@ declare enum ExtensionSlot {
     Menu = "menu"
 }
 
+declare const READY_EVENT: "theoplayerready";
+
 /**
  * `<theoplayer-default-ui>` - A default UI for THEOplayer.
  *
@@ -1501,12 +1775,19 @@ declare enum ExtensionSlot {
  * @attribute `dvr-threshold` - The minimum length (in seconds) of a livestream's sliding window for the stream to be DVR
  *   and its stream type to be set to "dvr".
  *
+ * @slot `title` - A slot for the stream's title in the top control bar.
  * @slot `top-control-bar` - A slot for extra UI controls in the top control bar.
  * @slot `bottom-control-bar` - A slot for extra UI controls in the bottom control bar.
  * @slot `menu` - A slot for extra menus (see {@link Menu | `<theoplayer-menu>`}).
  * @group Components
  */
 declare class DefaultUI extends HTMLElement {
+    /**
+     * Fired when the backing player is created, and the {@link DefaultUI.player} property is set.
+     *
+     * @group Events
+     */
+    static READY_EVENT: typeof READY_EVENT;
     static get observedAttributes(): Attribute[];
     private readonly _ui;
     private readonly _titleSlot;
@@ -1541,6 +1822,11 @@ declare class DefaultUI extends HTMLElement {
      */
     get source(): SourceDescription | undefined;
     set source(value: SourceDescription | undefined);
+    /**
+     * Whether to automatically adjusts the player's height to fit the video's aspect ratio.
+     */
+    get fluid(): boolean;
+    set fluid(value: boolean);
     /**
      * Whether the player's audio is muted.
      */
@@ -1575,8 +1861,14 @@ declare class DefaultUI extends HTMLElement {
     disconnectedCallback(): void;
     attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
     private readonly _updateStreamType;
+    private readonly _dispatchReadyEvent;
     private readonly _onTitleSlotChange;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-default-ui': DefaultUI;
+    }
+}
 
 /**
  * An extension for the default UI.
@@ -1655,7 +1947,7 @@ declare function registerExtension(extension: Extension): void;
  *   and its stream type to be set to "dvr".
  * @attribute `paused` (readonly) - Whether the player is paused. Reflects `ui.player.paused`.
  * @attribute `ended` (readonly) - Whether the player is ended. Reflects `ui.player.ended`.
- * @attribute `casting` (readonly) - Whether the player is ended. Reflects `ui.player.cast.casting`.
+ * @attribute `casting` (readonly) - Whether the player is casting. Reflects `ui.player.cast.casting`.
  * @attribute `playing-ad` (readonly) - Whether the player is playing a linear ad. Reflects `ui.player.ads.playing`.
  * @attribute `has-error` (readonly) - Whether the player has encountered a fatal error.
  * @attribute `has-first-play` (readonly) - Whether the player has (previously) started playback for this stream.
@@ -1676,6 +1968,12 @@ declare function registerExtension(extension: Extension): void;
  * @group Components
  */
 declare class UIContainer extends HTMLElement {
+    /**
+     * Fired when the backing player is created, and the {@link UIContainer.player} property is set.
+     *
+     * @group Events
+     */
+    static READY_EVENT: typeof READY_EVENT;
     static get observedAttributes(): Attribute[];
     private _configuration;
     private readonly _playerEl;
@@ -1726,6 +2024,11 @@ declare class UIContainer extends HTMLElement {
     get source(): SourceDescription | undefined;
     set source(value: SourceDescription | undefined);
     private _setSource;
+    /**
+     * Whether to automatically adjusts the player's height to fit the video's aspect ratio.
+     */
+    get fluid(): boolean;
+    set fluid(value: boolean);
     /**
      * Whether the player's audio is muted.
      */
@@ -1826,6 +2129,11 @@ declare class UIContainer extends HTMLElement {
     private readonly _updateTextTrackMargins;
     private readonly _onPreviewTimeChange;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'theoplayer-ui': UIContainer;
+    }
+}
 
 export { ActiveQualityDisplay, AdClickThroughButton, AdCountdown, AdDisplay, AdSkipButton, AirPlayButton, Attribute, Button, ButtonOptions, CastButton, ChromecastButton, ChromecastDisplay, CloseMenuButton, ColorStops, Constructor, ControlBar, DefaultUI, DeviceType, DurationDisplay, ErrorDisplay, Extension, ExtensionSlot, FullscreenButton, GestureReceiver, LanguageMenu, LanguageMenuButton, LinkButton, LiveButton, LoadingIndicator, MediaTrackRadioButton, Menu, MenuButton, MenuGroup, MenuGroupOptions, MenuOptions, MuteButton, PlayButton, PlaybackRateDisplay, PlaybackRateMenu, PlaybackRateMenuButton, PlaybackRateRadioGroup, PreviewThumbnail, PreviewTimeDisplay, QualityRadioButton, QualityRadioGroup, RadioButton, RadioGroup, Range, RangeOptions, SeekButton, SettingsMenu, SettingsMenuButton, StateReceiverElement, StateReceiverMixin, StateReceiverPropertyMap, StreamType, TextTrackOffRadioButton, TextTrackRadioButton, TextTrackStyleDisplay, TextTrackStyleMap, TextTrackStyleMenu, TextTrackStyleOption, TextTrackStyleRadioGroup, TextTrackStyleResetButton, TimeDisplay, TimeRange, TrackRadioGroup, TrackType, UIContainer, VolumeLevel, VolumeRange, buttonTemplate, linkButtonTemplate, menuGroupTemplate, menuTemplate, rangeTemplate, registerExtension };
 export as namespace THEOplayerUI;