import React from 'react';
import './index.less';
import { Dropdown, Menu } from 'antd';
import Icon from '../Icon';

function More(props) {
  const { menu = [], size = '', children, onClick } = props;
  return (
    <Dropdown
      overlay={
        <Menu onClick={key => onClick && onClick(key)}>
          {menu.map(item => {
            if (!item || !item.key) return null;
            return <Menu.Item key={item.key}>{item.label}</Menu.Item>;
          })}
        </Menu>
      }
      trigger={['click']}
    >
      <div className="more">{children || <Icon name={size ? `more-${size}` : 'more'} />}</div>
    </Dropdown>
  );
}
export default More;