import { type ReadSignal, type StoreContext } from 'maverick.js'; import { Component, type HTMLCustomElement } from 'maverick.js/element'; import type { DOMEvent } from 'maverick.js/std'; import { type MediaContext } from '../../core/api/context'; import { SliderStoreFactory } from './slider/api/store'; declare global { interface MaverickElements { 'media-slider-video': MediaSliderVideoElement; } } /** * Used to load a low-resolution video to be displayed when the user is hovering over or dragging * the time slider. The preview video will automatically be updated to be in-sync with the current * preview position, so ensure it has the same length as the original media (i.e., same duration). * * @docs {@link https://www.vidstack.io/docs/player/components/sliders/slider-video} * @example * ```html * * * * ``` */ export declare class SliderVideo extends Component { static el: import("maverick.js/element").CustomElementDefinition; protected _media: MediaContext; protected _slider: StoreContext; protected _video: HTMLVideoElement | null; protected _canPlay: import("maverick.js").WriteSignal; protected _error: import("maverick.js").WriteSignal; protected _src: ReadSignal; protected _hidden: ReadSignal; protected onAttach(): void; protected onConnect(): void; render(): import("maverick.js").JSX.Element; protected _getSrc(): string | null | undefined; protected _isLoading(): boolean; protected _isHidden(): boolean; protected _onSrcChange(): void; protected _onCanPlay(event?: Event): void; protected _onError(event?: Event): void; protected _onTimeUpdate(): void; protected _setVideo(el: HTMLVideoElement | null): void; } export interface MediaSliderVideoElement extends HTMLCustomElement { } export interface SliderVideoAPI { props: SliderVideoProps; events: SliderVideoEvents; } export interface SliderVideoProps { /** * The URL of a media resource to use. * * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/src} */ src: string | undefined; } export interface SliderVideoEvents { 'can-play': SliderVideoCanPlayEvent; error: SliderVideoErrorEvent; } /** * Fired when the user agent can play the media, but estimates that **not enough** data has been * loaded to play the media up to its end without having to stop for further buffering of content. * * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/canplay_event} */ export interface SliderVideoCanPlayEvent extends DOMEvent { /** The `canplay` media event. */ trigger?: Event; } /** * Fired when media loading or playback has encountered any issues (for example, a network * connectivity problem). The event detail contains a potential message containing more * information about the error (empty string if nothing available), and a code that identifies * the general type of error that occurred. * * @see {@link https://html.spec.whatwg.org/multipage/media.html#error-codes} * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/error_event} */ export interface SliderVideoErrorEvent extends DOMEvent { /** The `error` media event. */ trigger: Event; }