import React from 'react'
import { array, node, number, object, oneOfType, string } from 'prop-types'

const Views = ({ activeIndex, children, className, ...props }) => {
  return (
    <div {...props} className={className}>
      {React.Children.map(children, (child, index) => {
        if (activeIndex === index) {
          return child
        }
      })}
    </div>
  )
}

Views.propTypes = {
  /** Which tab is active (showing) */
  activeIndex: number,
  /** Contents */
  children: node,
  /** Additional classnames */
  className: oneOfType([string, object, array])
}

Views.defaultProps = {
  className: ''
}

export default Views