import * as React from 'react';
import type { MediaHandle } from '../useMediaElement.js';
import type { MediaTextTrack } from '../mediaStore.js';
import { type MediaControlsSize } from './mediaContext.js';
import { PlayButton } from './parts/PlayButton.js';
import { Scrubber } from './parts/Scrubber.js';
import { Time } from './parts/Time.js';
import { Volume } from './parts/Volume.js';
import { Mute } from './parts/Mute.js';
import { Rate } from './parts/Rate.js';
import { Captions } from './parts/Captions.js';
import { PictureInPicture } from './parts/PictureInPicture.js';
import { Fullscreen } from './parts/Fullscreen.js';
import { Spacer } from './parts/Spacer.js';
export interface MediaControlsRootProps {
    /** Media element handle the controls drive; omit to control every value yourself. */
    media?: MediaHandle | undefined;
    /** Controlled playing state. */
    playing?: boolean | undefined;
    /** Controlled playback position, in seconds. */
    currentTime?: number | undefined;
    /** Media duration, in seconds. */
    duration?: number | undefined;
    /** Buffered ranges as [start, end] seconds. */
    buffered?: [number, number][] | undefined;
    /** Controlled volume from 0 to 1. */
    volume?: number | undefined;
    /** Controlled muted state. */
    muted?: boolean | undefined;
    /** Controlled playback rate. */
    playbackRate?: number | undefined;
    /** Controlled text tracks (captions|subtitles drive the Captions part). */
    textTracks?: MediaTextTrack[] | undefined;
    /** Called with the next playing state. */
    onPlayingChange?: ((playing: boolean) => void) | undefined;
    /** Called with the position, in seconds, the user seeks to. */
    onSeek?: ((seconds: number) => void) | undefined;
    /** Called with the next volume (0 to 1). */
    onVolumeChange?: ((volume: number) => void) | undefined;
    /** Called with the next muted state. */
    onMutedChange?: ((muted: boolean) => void) | undefined;
    /** Called with the next playback rate. */
    onRateChange?: ((rate: number) => void) | undefined;
    /** Controlled captions: the track id to show, or null for off. */
    onCaptionsChange?: ((trackId: string | null) => void) | undefined;
    /** Material variant of the control bar. */
    variant?: 'regular' | 'clear' | undefined;
    /** Material refraction on the toolbar chrome (data-ag-refraction). */
    refraction?: boolean | undefined;
    /** Accessible name of the control group. */
    label?: string | undefined;
    /** keyboard shortcuts bound on Root (and shortcutTarget) only; default true */
    shortcuts?: boolean | undefined;
    /** Extra element on which the keyboard shortcuts are bound (they are always bound on the root). */
    shortcutTarget?: HTMLElement | null | undefined;
    /** Content rendered inside the component. */
    children?: React.ReactNode | undefined;
    /** Class name merged onto the root element. */
    className?: string | undefined;
}
export declare function sizeForWidth(width: number): MediaControlsSize;
declare function Root(props: MediaControlsRootProps): React.ReactElement;
export declare const MediaControls: {
    readonly Root: typeof Root;
    readonly PlayButton: typeof PlayButton;
    readonly Scrubber: typeof Scrubber;
    readonly Time: typeof Time;
    readonly Volume: typeof Volume;
    readonly Mute: typeof Mute;
    readonly Rate: typeof Rate;
    readonly Captions: typeof Captions;
    readonly PictureInPicture: typeof PictureInPicture;
    readonly Fullscreen: typeof Fullscreen;
    readonly Spacer: typeof Spacer;
};
export type MediaControls = typeof MediaControls;
export {};
//# sourceMappingURL=MediaControls.d.ts.map