/// <reference types="react" />
import { IStyle } from '@fluentui/react';
import { GridLayoutStyles } from '.';
import { BaseCustomStyles, OnRenderAvatarCallback, VideoGalleryLocalParticipant, VideoGalleryRemoteParticipant, VideoStreamOptions, CreateVideoStreamViewResult } from '../types';
import { HorizontalGalleryStyles } from './HorizontalGallery';
import { LocalVideoCameraCycleButtonProps } from './LocalVideoCameraButton';
import { VerticalGalleryStyles } from './VerticalGallery';
import { ReactionResources } from '../types/ReactionTypes';
/**
 * @private
 * Currently the Calling JS SDK supports up to 4 remote video streams
 */
export declare const DEFAULT_MAX_REMOTE_VIDEO_STREAMS = 4;
/**
 * @private
 * Styles to disable the selectivity of a text in video gallery
 */
export declare const unselectable: {
    '-webkit-user-select': string;
    '-webkit-touch-callout': string;
    '-moz-user-select': string;
    '-ms-user-select': string;
    'user-select': string;
};
/**
 * @private
 * Set aside only 6 dominant speakers for remaining audio participants
 */
export declare const MAX_AUDIO_DOMINANT_SPEAKERS = 6;
/**
 * @private
 * Default remote video tile menu options
 */
export declare const DEFAULT_REMOTE_VIDEO_TILE_MENU_OPTIONS: {
    kind: string;
};
/**
 * @private
 * Maximum number of remote video tiles that can be pinned
 */
export declare const MAX_PINNED_REMOTE_VIDEO_TILES = 4;
/**
 * All strings that may be shown on the UI in the {@link VideoGallery}.
 *
 * @public
 */
export interface VideoGalleryStrings {
    /** String to notify that local user is sharing their screen */
    screenIsBeingSharedMessage: string;
    /** String to show when remote screen share stream is loading */
    screenShareLoadingMessage: string;
    /** String to show when local screen share stream is loading */
    localScreenShareLoadingMessage: string;
    /** String for local video label. Default is "You" */
    localVideoLabel: string;
    /** String for local video camera switcher */
    localVideoCameraSwitcherLabel: string;
    /** String for announcing the local video tile can be moved by keyboard controls */
    localVideoMovementLabel: string;
    /** Aria-label for announcing the local video tile can be moved by keyboard controls */
    localVideoMovementAriaLabel: string;
    /** String for announcing the selected camera */
    localVideoSelectedDescription: string;
    /** placeholder text for participants who does not have a display name*/
    displayNamePlaceholder: string;
    /** Menu text shown in Video Tile contextual menu for setting a remote participants video to fit in frame */
    fitRemoteParticipantToFrame: string;
    /** Menu text shown in Video Tile contextual menu for setting a remote participants video to fill the frame */
    fillRemoteParticipantFrame: string;
    /** Menu text shown in Video Tile contextual menu for pinning a remote participant's video tile */
    pinParticipantForMe: string;
    /** Menu text shown in Video Tile contextual menu for unpinning a remote participant's video tile */
    unpinParticipantForMe: string;
    /** Aria label for pin participant menu item of remote participant's video tile */
    pinParticipantMenuItemAriaLabel: string;
    /** Aria label for unpin participant menu item of remote participant's video tile */
    unpinParticipantMenuItemAriaLabel: string;
    /** Aria label to announce when remote participant's video tile is pinned */
    pinnedParticipantAnnouncementAriaLabel: string;
    /** Aria label to announce when remote participant's video tile is unpinned */
    unpinnedParticipantAnnouncementAriaLabel: string;
    /** Menu text shown in Video Tile contextual menu to start spotlight on participant's video tile */
    startSpotlightVideoTileMenuLabel: string;
    /** Menu text shown in Video Tile contextual menu to add spotlight to participant's video tile */
    addSpotlightVideoTileMenuLabel: string;
    /** Menu title for start spotlight menu item when spotlight limit is reached */
    spotlightLimitReachedMenuTitle: string;
    /** Menu text shown in Video Tile contextual menu to stop spotlight on participant's video tile */
    stopSpotlightVideoTileMenuLabel: string;
    /** Menu text shown in Video Tile contextual menu to stop spotlight on local user's video tile */
    stopSpotlightOnSelfVideoTileMenuLabel: string;
    /** String for the attendee role */
    attendeeRole: string;
    /** Menu text shown in Video Tile contextual menu to mute a remote participant */
    muteParticipantMenuItemLabel: string;
    /** Text shown when waiting for others to join the call */
    waitingScreenText: string;
}
/**
 * @public
 */
export type LocalScreenShareView = 'stream' | 'placeholderMessage';
/**
 * @public
 */
export type VideoGalleryLayout = 'default' | 'floatingLocalVideo' | 'speaker' | 'focusedContent';
/**
 * {@link VideoGallery} Component Styles.
 * @public
 */
export interface VideoGalleryStyles extends BaseCustomStyles {
    /** Styles for the grid layout */
    gridLayout?: GridLayoutStyles;
    /** Styles for the horizontal gallery  */
    horizontalGallery?: HorizontalGalleryStyles;
    /** Styles for the local video  */
    localVideo?: IStyle;
    /** Styles for the vertical gallery */
    verticalGallery?: VerticalGalleryStyles;
}
/**
 * Different modes and positions of the overflow gallery in the VideoGallery
 *
 * @public
 */
export type OverflowGalleryPosition = 'horizontalBottom' | 'verticalRight' | 'horizontalTop';
/**
 * different modes of the local video tile
 *
 * @public
 */
export type LocalVideoTileSize = '9:16' | '16:9' | 'hidden' | 'followDeviceOrientation';
/**
 * Props for {@link VideoGallery}.
 *
 * @public
 */
export interface VideoGalleryProps {
    /**
     * Allows users to pass an object containing custom CSS styles for the gallery container.
     *
     * @Example
     * ```
     * <VideoGallery styles={{ root: { border: 'solid 1px red' } }} />
     * ```
     */
    styles?: VideoGalleryStyles;
    /** Layout of the video tiles. */
    layout?: VideoGalleryLayout;
    /** Local video particpant */
    localParticipant: VideoGalleryLocalParticipant;
    /** List of remote video particpants */
    remoteParticipants?: VideoGalleryRemoteParticipant[];
    /** List of dominant speaker userIds in the order of their dominance. 0th index is the most dominant. */
    dominantSpeakers?: string[];
    /** Local video view options */
    localVideoViewOptions?: VideoStreamOptions;
    /** Remote videos view options */
    remoteVideoViewOptions?: VideoStreamOptions;
    /** Callback to create the local video stream view */
    onCreateLocalStreamView?: (options?: VideoStreamOptions) => Promise<void | CreateVideoStreamViewResult>;
    /** Callback to dispose of the local video stream view */
    onDisposeLocalStreamView?: () => void;
    /** Callback to render the local video tile*/
    onRenderLocalVideoTile?: (localParticipant: VideoGalleryLocalParticipant) => JSX.Element;
    /** Callback to create a remote video stream view */
    onCreateRemoteStreamView?: (userId: string, options?: VideoStreamOptions) => Promise<void | CreateVideoStreamViewResult>;
    /** Callback to render a remote video tile */
    onRenderRemoteVideoTile?: (remoteParticipant: VideoGalleryRemoteParticipant) => JSX.Element;
    /**
     * @deprecated use {@link onDisposeRemoteVideoStreamView} and {@link onDisposeRemoteScreenShareStreamView} instead
     *
     * Callback to dispose a remote video stream view
     */
    onDisposeRemoteStreamView?: (userId: string) => Promise<void>;
    /** Callback to dispose a remote video stream view */
    onDisposeRemoteVideoStreamView?: (userId: string) => Promise<void>;
    /** Callback to dispose a remote screen share stream view */
    onDisposeRemoteScreenShareStreamView?: (userId: string) => Promise<void>;
    /** Callback to dispose a local screen share stream view */
    onDisposeLocalScreenShareStreamView?: () => Promise<void>;
    /** Callback to render a participant avatar */
    onRenderAvatar?: OnRenderAvatarCallback;
    /**
     * Whether to display the local video camera switcher button
     */
    showCameraSwitcherInLocalPreview?: boolean;
    /**
     * Whether to display a mute icon beside the user's display name.
     * @defaultValue `true`
     */
    showMuteIndicator?: boolean;
    /** Optional strings to override in component  */
    strings?: Partial<VideoGalleryStrings>;
    /**
     * Maximum number of participant remote video streams that is rendered.
     * @defaultValue 4
     */
    maxRemoteVideoStreams?: number;
    /**
     * Camera control information for button to switch cameras.
     */
    localVideoCameraCycleButtonProps?: LocalVideoCameraCycleButtonProps;
    /**
     * List of pinned participant userIds.
     */
    pinnedParticipants?: string[];
    /**
     * This callback will be called when a participant video tile is pinned.
     */
    onPinParticipant?: (userId: string) => void;
    /**
     * This callback will be called when a participant video tile is un-pinned.
     */
    onUnpinParticipant?: (userId: string) => void;
    /**
     * List of spotlighted participant userIds.
     */
    spotlightedParticipants?: string[];
    /**
     * This callback is to start spotlight for local participant video tile.
     */
    onStartLocalSpotlight?: () => Promise<void>;
    /**
     * This callback is to stop spotlight for local participant video tile.
     */
    onStartRemoteSpotlight?: (userIds: string[]) => Promise<void>;
    /**
     * This callback is to start spotlight for remote participant video tiles.
     */
    onStopLocalSpotlight?: () => Promise<void>;
    /**
     * This callback is to stop spotlight for remote participant video tiles.
     */
    onStopRemoteSpotlight?: (userIds: string[]) => Promise<void>;
    /**
     * Maximum participants that can be spotlighted
     */
    maxParticipantsToSpotlight?: number;
    /**
     * Options for showing the remote video tile menu.
     *
     * @defaultValue \{ kind: 'contextual' \}
     */
    remoteVideoTileMenu?: false | VideoTileContextualMenuProps | VideoTileDrawerMenuProps;
    /**
     * Determines the layout of the overflowGallery inside the VideoGallery.
     * @defaultValue 'horizontalBottom'
     */
    overflowGalleryPosition?: OverflowGalleryPosition;
    /**
     * Determines the aspect ratio of local video tile in the video gallery.
     * @remarks 'followDeviceOrientation' will be responsive to the screen orientation and will change between 9:16 (portrait) and
     * 16:9 (landscape) aspect ratios.
     * @defaultValue 'followDeviceOrientation'
     */
    localVideoTileSize?: LocalVideoTileSize;
    /**
     * Reaction resources for like, heart, laugh, applause and surprised.
     */
    reactionResources?: ReactionResources;
    /**
     * Additional Options for Video Tiles
     */
    videoTilesOptions?: VideoTilesOptions;
    /**
     * This callback is to mute a remote participant
     */
    onMuteParticipant?: (userId: string) => Promise<void>;
    /**
     * This callback is to forbid audio for remote participant(s)
     */
    onForbidAudio?: (userIds: string[]) => Promise<void>;
    /**
     * This callback is to permit audio for remote participant(s)
     */
    onPermitAudio?: (userIds: string[]) => Promise<void>;
    /**
     * This callback is to forbid video for remote participant(s)
     */
    onForbidVideo?: (userIds: string[]) => Promise<void>;
    /**
     * This callback is to permit video for remote participant(s)
     */
    onPermitVideo?: (userIds: string[]) => Promise<void>;
    /**
     * Controls the view of the local screenshare stream in the gallery
     */
    localScreenShareView?: LocalScreenShareView;
}
/**
 * Options that apply to all Video Tiles in the {@link VideoGallery}
 *
 * @public
 */
export interface VideoTilesOptions {
    /**
     * Whether to always show the label background for the video tile
     */
    alwaysShowLabelBackground?: boolean;
}
/**
 * Properties for showing contextual menu for remote {@link VideoTile} components in {@link VideoGallery}.
 *
 * @public
 */
export interface VideoTileContextualMenuProps {
    /**
     * The menu property kind
     */
    kind: 'contextual';
}
/**
 * Properties for showing drawer menu on remote {@link VideoTile} long touch in {@link VideoGallery}.
 *
 * @public
 */
export interface VideoTileDrawerMenuProps {
    /**
     * The menu property kind
     */
    kind: 'drawer';
    /**
     * The optional id property provided on an element that the drawer menu should render within when a
     * remote participant video tile Drawer is shown. If an id is not provided, then a drawer menu will
     * render within the VideoGallery component.
     */
    hostId?: string;
}
/**
 * VideoGallery represents a layout of video tiles for a specific call.
 * It displays a {@link VideoTile} for the local user as well as for each remote participant who has joined the call.
 *
 * @public
 */
export declare const VideoGallery: (props: VideoGalleryProps) => JSX.Element;
//# sourceMappingURL=VideoGallery.d.ts.map