import React, { PropTypes } from 'react'
import { NavBar, Icon, TabBar, TableView } from '../../../index'

const propTypes = {
  className: PropTypes.string,
}

const CustomTabBar = ({ className }) =>
  <div className={className}>
    <NavBar title="TabBar">
      <NavBar.Item to="/home">
        <Icon type="chevron-left" />MeetUI
      </NavBar.Item>
    </NavBar>

    <TableView>
      <TableView.Cell presetStyle="basic" title="0" hr />
      <TableView.Cell presetStyle="basic" title="1" hr />
      <TableView.Cell presetStyle="basic" title="2" hr />
      <TableView.Cell presetStyle="basic" title="3" hr />
      <TableView.Cell presetStyle="basic" title="4" hr />
      <TableView.Cell presetStyle="basic" title="5" hr />
      <TableView.Cell presetStyle="basic" title="6" hr />
      <TableView.Cell presetStyle="basic" title="7" hr />
      <TableView.Cell presetStyle="basic" title="8" hr />
      <TableView.Cell presetStyle="basic" title="9" hr />
      <TableView.Cell presetStyle="basic" title="10" hr />
      <TableView.Cell presetStyle="basic" title="11" hr />
      <TableView.Cell presetStyle="basic" title="12" hr />
      <TableView.Cell presetStyle="basic" title="13" hr />
      <TableView.Cell presetStyle="basic" title="14" hr />
    </TableView>

    <TabBar>
      <TabBar.Item title="0" />
      <TabBar.Item title="1" />
      <TabBar.Item title="2" />
      <TabBar.Item title="3" />
      <TabBar.Item title="4" />
    </TabBar>
  </div>

CustomTabBar.propTypes = propTypes

export default CustomTabBar