import React from 'react'
import A from './A'
import './index.scss'

export default ({ className, tabs, activeKey, onChange, children }) => {
  return (
    <div className={`${className} default-tab-container`}>
      <div className="tabs-nav">
        {tabs.map((item, index) => {
          return <A key={index} value={item.value} text={item.title} className={activeKey == item.value ? 'active' : ''} onActive={onChange} />
        })}
      </div>
      <div className="tab-panel">
        {children}
      </div>
    </div>
  )
}