/// <reference types="react" />

import * as React from 'react';

type data = {
  img?: string;
  id: string | number;
  text: string;
}

export interface AvatarProps extends React.HTMLAttributes<HTMLElement> {
  prefix?: string;
  style?: React.CSSProperties;
  className?: string,
  img: string;
  text: string;
  closable?: boolean;
  onClose?: (e: React.MouseEvent) => void;
  onClick?: (e: React.MouseEvent) => void;
}

export interface TextAvatarProps extends React.HTMLAttributes<HTMLElement> {
  prefix?: string;
  size?: 'xs' | 'small' | 'medium' | 'large' | 'xl';
  style?: React.CSSProperties;
  className?: string;
  text: string;
  colorSets?: Array<string>;
}

export interface ImageAvatarProps extends React.HTMLAttributes<HTMLElement> {
  prefix?: string;
  size?: 'xs' | 'small' | 'medium' | 'large' | 'xl';
  style?: React.CSSProperties;
  className?: string;
  img: string;
}

export interface ClusterAvatarProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {
  prefix?: string;
  size?: 'xs' | 'small' | 'medium' | 'large' | 'xl';
  style?: React.CSSProperties;
  className?: string;
  dataSource: data[];
  colorSets?: Array<string>;
  onSelect?: (d:data) => void;
  onClose?: (d:data) => void;
  onAdd?: (e:React.MouseEvent) => void;
}

export interface GroupAvatarProps extends React.HTMLAttributes<HTMLElement> {
  prefix?: string;
  size?: 'xs' | 'small' | 'medium' | 'large' | 'xl';
  style?: React.CSSProperties;
  className?: string;
  dataSource: data[];
  colorSets?: Array<string>;
  onClickMore?: (e:React.MouseEvent) => void;
}

export class TextAvatar extends React.Component<TextAvatarProps, any> {

}

export class ImageAvatar extends React.Component<ImageAvatarProps, any> {

}

export class ClusterAvatar extends React.Component<ClusterAvatarProps, any> {

}

export class GroupAvatar extends React.Component<GroupAvatarProps, any> {

}

export default class Avatar extends React.Component<AvatarProps, any> {
  static TextAvatar: typeof TextAvatar;
  static ImageAvatar: typeof ImageAvatar;
  static ClusterAvatar: typeof ClusterAvatar;
  static GroupAvatar: typeof GroupAvatar;
}