import React from 'react';
import { AudioLevelDisplayType } from '../../types';
import { VideoTileClasses } from '../VideoTile/VideoTile';
import { HMSPeer, HMSPeerID } from '../../store/schema';
export interface VideoListClasses extends VideoTileClasses {
    /**
     * Styles applied to the root element
     */
    root?: string;
    /**
     * Styles applied to the slider root
     */
    sliderRoot?: string;
    /**
     * Styles applied to the slider inner container
     */
    sliderInner?: string;
    /**
     * Styles applied to the list container
     */
    listContainer?: string;
    /**
     * Styles applited to the container of all video tiles
     */
    videoTileContainer?: string;
    /**
     * Styles applied to individual video tiles
     */
    videoTile?: string;
    /**
     * Styles applied to the video
     */
    video?: string;
}
export interface VideoListProps {
    /**
      HMS Peers who need to be displayed
      */
    peers: HMSPeer[];
    /**
     * a function which tells whether to show the screenshare for a peer. A peer
     * id is passed and a boolean value is expected. You can use it to disable
     * showing main screenshare if you're already showing it in a bigger tile for eg.
     * @param peerID the peer ID for whom video tile is going to be rendered
     */
    showScreenFn?: (peerID: HMSPeerID) => boolean;
    /**
     * Max tiles in a  page. Overrides maxRowCount and maxColCount
     */
    maxTileCount?: number;
    /**
     * Max rows in a  page. Only applied if maxTileCount is not present
     */
    maxRowCount?: number;
    /**
     * Max columns in a  page. Only applied if maxTileCount and maxRowCount is not present
     */
    maxColCount?: number;
    /**
     * Should the next page scroll vertically, horizontally or be hidden
     */
    overflow?: 'scroll-x' | 'scroll-y' | 'hidden';
    /**
     * Arrange tiles in a row or col. Similar to flex-direction
     */
    tileArrangeDirection?: 'row' | 'col';
    /**
     Indicates if Audio Status will be shown or not.
     */
    showAudioMuteStatus?: boolean;
    /**
     * Contain the video or cover the video in a tile
     */
    objectFit?: 'contain' | 'cover';
    /**
     Aspect ratio in which the video tile should be shown, will only be applied if display shape is rectangle.
     If undefined, then the most common aspect ratio among all peer's feed will be chosen
     */
    aspectRatio?: {
        width: number;
        height: number;
    };
    /**
     Shape of the video tile, you can control the aspect ratio using aspectRatio props.
     */
    displayShape?: 'circle' | 'rectangle';
    /**
    Sets display type of Audio Level, inline-wave, inline-circle, border, avatar-circle are types available.
     */
    audioLevelDisplayType?: AudioLevelDisplayType;
    /**
      Show audio level for each tile?
     */
    showAudioLevel?: boolean;
    /**
     * Show control bars on all video tiles
     */
    videoTileControls?: React.ReactNode[];
    /**
     * Allow local peer to mute remote peers?
     */
    allowRemoteMute?: boolean;
    /**
     * extra classes added  by user
     */
    classes?: VideoListClasses;
    /**
     * videoTileClasses
     */
    videoTileClasses?: VideoTileClasses;
    avatarType?: 'initial' | 'pebble';
    compact?: boolean;
}
export declare const VideoList: ({ peers, showScreenFn, overflow, maxTileCount, tileArrangeDirection, objectFit, aspectRatio, displayShape, audioLevelDisplayType, showAudioLevel, maxRowCount, maxColCount, videoTileControls, showAudioMuteStatus, classes, videoTileClasses, allowRemoteMute, avatarType, compact, }: VideoListProps) => JSX.Element;