import { type StoreContext } from 'maverick.js';
import { Component, ComponentInstance, type HTMLCustomElement } from 'maverick.js/element';
import { type MediaContext } from '../../core/api/context';
import { Thumbnail } from '../thumbnail';
import { SliderStoreFactory } from './slider/api/store';
declare global {
    interface MaverickElements {
        'media-slider-thumbnail': MediaSliderThumbnailElement;
    }
}
/**
 * Used to display preview thumbnails when the user is hovering or dragging the time slider.
 * The time ranges in the WebVTT file will automatically be matched based on the current slider
 * pointer position.
 *
 * @docs {@link https://www.vidstack.io/docs/player/components/sliders/slider-thumbnail}
 * @example
 * ```html
 * <media-player thumbnails="https://media-files.vidstack.io/thumbnails.vtt">
 *   <media-time-slider>
 *     <media-slider-thumbnail slot="preview"></media-slider-thumbnail>
 *   </media-time-slider>
 * </media-player>
 * ```
 */
export declare class SliderThumbnail extends Component<SliderThumbnailAPI> {
    static el: import("maverick.js/element").CustomElementDefinition<SliderThumbnailAPI>;
    static register: (typeof Thumbnail)[];
    protected _media: MediaContext;
    protected _slider: StoreContext<typeof SliderStoreFactory>;
    constructor(instance: ComponentInstance<SliderThumbnailAPI>);
    protected _getTime(): number;
    render(): import("maverick.js").JSX.Element;
}
export interface SliderThumbnailAPI {
}
export interface MediaSliderThumbnailElement extends HTMLCustomElement<SliderThumbnail> {
}