import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';

import '../base';
import styles from './Tabs.styl';
import Tab from './Tabs.Tab';

export default class Tabs extends React.Component {
  getChildContext() {
    return {
      selectedTab: this.props.value,
      changeSelectedTab: this.props.onChange
    };
  }

  render() {
    const { children, standalone = false } = this.props;

    const classes = classNames({
      [styles.tabs]: true,
      [styles.standalone]: standalone
    });

    return (
      <div className={classes}>
        {children}
      </div>
    );
  }
}

Tabs.childContextTypes = {
  selectedTab: PropTypes.string,
  changeSelectedTab: PropTypes.func
};

Tabs.Tab = Tab;

Tabs.propTypes = {
  value: PropTypes.string,
  onChange: PropTypes.func,
  children: PropTypes.node,
  standalone: PropTypes.bool
};

Tabs.defaultProps = {
  value: undefined,
  onChange: undefined,
  children: undefined,
  standalone: undefined
};
