vidstack/dist/types/player/ui/buttons/pip-button.d.ts

Build awesome media experiences on the web.

import { type HTMLCustomElement } from 'maverick.js/element';
import { type MediaContext } from '../../core/api/context';
import type { MediaKeyShortcut } from '../../core/keyboard/types';
import { ToggleButton, type ToggleButtonAPI } from './toggle-button';
declare global {
    interface MaverickElements {
        'media-pip-button': MediaPIPButtonElement;
    }
}
/**
 * A button for toggling the picture-in-picture (PIP) mode of the player.
 *
 * @docs {@link https://www.vidstack.io/docs/player/components/buttons/pip-button}
 * @see {@link https://www.vidstack.io/docs/player/core-concepts/picture-in-picture}
 * @slot enter - Used to override the default enter PIP icon.
 * @slot exit - Used to override the default exit PIP icon.
 * @example
 * ```html
 * <media-pip-button></media-pip-button>
 * ```
 */
export declare class PIPButton extends ToggleButton {
    static el: import("maverick.js/element").CustomElementDefinition<PIPButtonAPI>;
    protected _media: MediaContext;
    protected _keyShortcut: MediaKeyShortcut;
    protected onAttach(el: HTMLElement): void;
    protected _onPress(event: Event): void;
    protected _isPressed(): boolean;
    protected _isHidden(): boolean;
    protected _getLabel(): "Exit Picture In Picture" | "Enter Picture In Picture";
    render(): import("maverick.js").JSX.Element;
}
export interface PIPButtonAPI extends ToggleButtonAPI {
}
export interface MediaPIPButtonElement extends HTMLCustomElement<PIPButton> {
}