<commit_before>import React, { Component, PropTypes, createElement, cloneElement } from 'react';
import Radium from 'radium';
import pure from 'recompose/pure';
import styles from './styles';
import combineStyles from '../internal/combine-styles';

function getTabContentStyle(selected) {
  let style = styles.tabContent;

  if (selected) {
    style = combineStyles(style, { display: 'block' });
  }

  return style;
}

class Tabs extends Component {
  static displayName = 'Tabs'

  static propTypes = {
    /** The Tabs's content (Tab) */
    children: PropTypes.node.isRequired,
    /** Override the styles of the root element */
    style: PropTypes.instanceOf(Object)
  }

  static defaultProps = {
    style: {},
  }

  static contextTypes = {
    color: PropTypes.string
  }

  constructor() {
    super();

    this.state = {
      value: 0
    };

    this.toggleTab = this.toggleTab.bind(this);
  }

  toggleTab(value) {
    this.setState({
      value
    });
  }

  render() {
    const { children, style } = this.props;
    const { value } = this.state;
    const tabContent = [];

    const tabs = children.map((tab, index) => {
      tabContent.push(
        createElement(
          'div', {
            key: index,
            style: getTabContentStyle(index === value)
          },
          tab.props.children
        )
      );

      return cloneElement(
        tab,
        {
          key: index,
          selected: index === value,
          onClick: () => this.toggleTab(index)
        }
      );
    });

    return (
      <section style={style}>
        <section>
          {tabs}
        </section>
        <section>
          {tabContent}
        </section>
      </section>
    );
  }
}

export default pure(Radium(Tabs));<commit_msg>:lipstick: Added style<commit_after>import React, { Component, PropTypes, createElement, cloneElement } from 'react';
import Radium from 'radium';
import pure from 'recompose/pure';
import styles from './styles';
import combineStyles from '../internal/combine-styles';

function getTabContentStyle(selected) {
  let style = styles.tabContent;

  if (selected) {
    style = combineStyles(style, { display: 'block' });
  }

  return style;
}

class Tabs extends Component {
  static displayName = 'Tabs'

  static propTypes = {
    /** The Tabs's content (Tab) */
    children: PropTypes.node.isRequired,
    /** Override the styles of the root element */
    style: PropTypes.instanceOf(Object)
  }

  static defaultProps = {
    style: {},
  }

  static contextTypes = {
    color: PropTypes.string
  }

  constructor() {
    super();

    this.state = {
      value: 0
    };

    this.toggleTab = this.toggleTab.bind(this);
  }

  toggleTab(value) {
    this.setState({
      value
    });
  }

  render() {
    const { children, style } = this.props;
    const { value } = this.state;
    const tabContent = [];

    const tabs = children.map((tab, index) => {
      tabContent.push(
        createElement(
          'div', {
            key: index,
            style: getTabContentStyle(index === value)
          },
          tab.props.children
        )
      );

      return cloneElement(
        tab,
        {
          key: index,
          selected: index === value,
          onClick: () => this.toggleTab(index)
        }
      );
    });

    return (
      <section style={style}>
        <section style={{ display: 'flex' }}>
          {tabs}
        </section>
        <section>
          {tabContent}
        </section>
      </section>
    );
  }
}

export default pure(Radium(Tabs));
{'fraction_non_alphanumeric': 0.1309823677581864, 'fraction_numerical': 0.000559753708368318, 'mean_word_length': 2.105125977410947, 'pattern_counts': {'":': 0, '<': 15, '<?xml version=': 0, '>': 19, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7615783', 'n_tokens_mistral': 1075, 'n_tokens_neox': 1053, 'n_words': 252}