{"size": 666, "ext": "js", "max_stars_repo_path": "src/components/Tabs/Tabs.js", "max_stars_repo_name": "secretkto/homepage-next", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/Tabs/Tabs.js", "max_issues_repo_name": "secretkto/homepage-next", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/Tabs/Tabs.js", "max_forks_repo_name": "secretkto/homepage-next", "max_forks_repo_forks_event_min_datetime": "2019-06-06T06:50:53.000Z", "max_forks_repo_forks_event_max_datetime": "2019-06-25T20:08:47.000Z"}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": 2, "avg_line_length": 18.5, "max_line_length": 66, "alphanum_fraction": 0.6366366366}
import React, { Children, cloneElement } from 'react';
import classnames from 'classnames';

import './Tabs.css';

export function Tabs({
  children,
  vertical,
  changeOnHover,
  current,
  className,
  onChange,
  withSquares,
}) {
  const classes = classnames(
    'tabs',
    vertical ? 'tabs--vertical' : 'tabs--horizontal',
    withSquares ? 'tabs--with-squares' : null,
    className,
  );

  return (
    <div className={classes}>
      {Children.map(children, (child) =>
        cloneElement(child, { onChange, current, changeOnHover }),
      )}
    </div>
  );
}

Tabs.defaultProps = {
  vertical: false,
  changeOnHover: false,
  withSquares: false,
};
