<commit_before>import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { withBootStrap, generateClassName } from '../shared/BootStrapHOC';
import { Nav, NavItem } from '../interactive/Navigation';

// TODO
// ARIA
// hooks for panelWillChange, panelDidChange, panelWillRemove, panelDidRemove
class BTabs extends React.PureComponent {
  state = {activeIndex: 0};

  static childContextTypes = {
    activeIndex: PropTypes.number.isRequired,
    onSelectTab: PropTypes.func.isRequired
  };

  getChildContext () {
    return {
      activeIndex: this.state.activeIndex,
      onSelectTab: this.onSelectTab
    };
  }

  onSelectTab = i => {
    this.setState({activeIndex: i});
  };

  render () {
    const TabsEl = styled.div.attrs({
      className: generateClassName(this.props)
    })``;
    return <TabsEl>{this.props.children}</TabsEl>;
  }
}

class BTabList extends React.PureComponent {
  static contextTypes = {
    activeIndex: PropTypes.number.isRequired,
    onSelectTab: PropTypes.func.isRequired
  };

  render () {
    const {activeIndex, onSelectTab} = this.context;

    const children = React.Children.map(this.props.children, (child, idx) => {
      return React.cloneElement(child, {
        active  : activeIndex === idx,
        onSelect: (e) => {
          e.preventDefault();
          onSelectTab(idx);
        }
      });
    });

    return <Nav tabs>{children}</Nav>;
  }
}

class BTab extends React.PureComponent {
  render () {
    const {onSelect, active} = this.props;

    return <NavItem active={active}
                    onClick={onSelect}>{this.props.children}</NavItem>;
  }
}

class BTabPanels extends React.PureComponent {
  static contextTypes = {
    activeIndex: PropTypes.number.isRequired
  };

  render () {
    const {activeIndex} = this.context;
    const TabPanelsEl   = styled.div.attrs({
      className: generateClassName(this.props)
    })``;
    return <TabPanelsEl>{this.props.children[activeIndex]}</TabPanelsEl>;
  }
}

class BTabPanel extends React.PureComponent {
  render () {
    const TabPanelEl = styled.div.attrs({
      className: generateClassName(this.props)
    })``;
    return <TabPanelEl>{this.props.children}</TabPanelEl>;
  }
}

export const Tabs      = withBootStrap('')(BTabs);
export const TabList   = withBootStrap('nav')(BTabList);<commit_msg>Tab component isn't based on Card<commit_after>import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { withBootStrap, generateClassName } from '../shared/BootStrapHOC';
import { Nav, NavItem } from '../interactive/Navigation';

// TODO
// ARIA
// hooks for panelWillChange, panelDidChange, panelWillRemove, panelDidRemove
class BTabs extends React.PureComponent {
  state = {activeIndex: 0};

  static childContextTypes = {
    activeIndex: PropTypes.number.isRequired,
    onSelectTab: PropTypes.func.isRequired
  };

  getChildContext () {
    return {
      activeIndex: this.state.activeIndex,
      onSelectTab: this.onSelectTab
    };
  }

  onSelectTab = i => {
    this.setState({activeIndex: i});
  };

  render () {
    const TabsEl = styled.div.attrs({
      className: generateClassName(this.props)
    })``;
    return <TabsEl>{this.props.children}</TabsEl>;
  }
}

class BTabList extends React.PureComponent {
  static contextTypes = {
    activeIndex: PropTypes.number.isRequired,
    onSelectTab: PropTypes.func.isRequired
  };

  render () {
    const {activeIndex, onSelectTab} = this.context;

    const children = React.Children.map(this.props.children, (child, idx) => {
      return React.cloneElement(child, {
        active  : activeIndex === idx,
        onSelect: () => onSelectTab(idx)
      });
    });

    return <Nav tabs>{children}</Nav>;
  }
}

class BTab extends React.PureComponent {
  handleClick = e => {
    e.preventDefault();
    this.props.onSelect();
  };

  render () {
    const {active} = this.props;

    return <NavItem active={active}
                    onClick={this.handleClick}>{this.props.children}</NavItem>;
  }
}

class BTabPanels extends React.PureComponent {
  static contextTypes = {
    activeIndex: PropTypes.number.isRequired
  };

  render () {
    const {activeIndex} = this.context;
    const TabPanelsEl   = styled.div.attrs({
      className: generateClassName(this.props)
    })``;
    return <TabPanelsEl>{this.props.children[activeIndex]}</TabPanelsEl>;
  }
}

class BTabPanel extends React.PureComponent {
  render () {
    const TabPanelEl = styled.div.attrs({
      className: generateClassName(this.props)
    })``;
    return <TabPanelEl>{this.props.children}</TabPanelEl>;
  }
}

export const Tabs      = withBootStrap('')(BTabs);
export const TabList   = withBootStrap('nav')(BTabList);
{'fraction_non_alphanumeric': 0.13162286191072173, 'fraction_numerical': 0.00041718815185648727, 'mean_word_length': 3.351179673321234, 'pattern_counts': {'":': 0, '<': 23, '<?xml version=': 0, '>': 30, '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': '674103', 'n_tokens_mistral': 1476, 'n_tokens_neox': 1467, 'n_words': 295}