import { Tabs as MyTabs, TabPaneProps } from 'antd';
import { TabsProps } from 'antd/lib/Tabs';
import './tabs.less';

export interface Tab extends Omit<TabPaneProps, 'tab'> {
  key: string;
  label: React.ReactNode;
}

export interface MyTabsProps extends TabsProps {
  items?: Tab[];
}

const Tabs: React.FC<MyTabsProps> = (props) => {
  const { defaultActiveKey, items = [], ...other } = props;
  const defaultKey = items.length > 0 ? defaultActiveKey || items[0].key : undefined;

  return (
    <div className={'tabs_warp'}>
      <MyTabs defaultActiveKey={defaultKey} {...other} />
    </div>
  );
};

export default Tabs;