vidstack
Version:
Build awesome media experiences on the web.
54 lines (53 loc) • 1.95 kB
TypeScript
import { Component, ComponentInstance, type HTMLCustomElement } from 'maverick.js/element';
import { type MediaContext } from '../../core/api/context';
declare global {
interface MaverickElements {
'media-seek-button': MediaSeekButtonElement;
}
}
/**
* A button for seeking the current media playback forwards or backwards by a specified amount.
*
* @docs {@link https://www.vidstack.io/docs/player/components/buttons/seek-button}
* @slot forward - Used to override the default seek forward icon.
* @slot backward - Used to override the default seek backward icon.
* @example
* ```html
* <!-- Forward +30s on each press. -->
* <media-seek-button seconds="+30"></media-seek-button>
* <!-- Backward -30s on each press. -->
* <media-seek-button seconds="-30"></media-seek-button>
* ```
*/
export declare class SeekButton extends Component<SeekButtonAPI> {
static el: import("maverick.js/element").CustomElementDefinition<SeekButtonAPI>;
protected _media: MediaContext;
constructor(instance: ComponentInstance<SeekButtonAPI>);
protected onAttach(el: HTMLElement): void;
protected onConnect(el: HTMLElement): void;
protected _isHidden(): boolean;
protected _getLabel(): string;
protected _onPress(event: Event): void;
render(): import("maverick.js").JSX.Element;
}
export interface SeekButtonAPI {
props: SeekButtonProps;
}
export interface SeekButtonProps {
/**
* Whether the button should be disabled (non-interactive).
*/
disabled: boolean;
/**
* Whether the default button appearance should stay visible when elements have been passed inside
* it.
*/
defaultAppearance: boolean;
/**
* The amount to seek the media playback forwards (positive number) or backwards (negative number)
* when the seek button is pressed.
*/
seconds: number;
}
export interface MediaSeekButtonElement extends HTMLCustomElement<SeekButton> {
}