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

import Item from './Item/index';

import './breadcrumb.scss';

const BreadCrumb = ({ className, children, variant, ...rest }) => (
  <div
    className={className}
    styleName="base"
    {...rest}
  >
    {React.Children.map(children,
      (child, index) => {
        if (React.isValidElement(child)) {
          const { type: { componentName } } = child;
          if (componentName === 'BreadCrumbItem') {
            const resultChild = React.cloneElement(child, {
              isLastChild: index === children.length - 1,
              variant
            });
            return resultChild;
          }
        }
        return null;
      })}
  </div>
);

BreadCrumb.propTypes = {
  /** @ignore */
  className: PropTypes.string,
  /** @ignore */
  children: PropTypes.node,
  variant: PropTypes.oneOf(['white', 'night-blue'])
};

BreadCrumb.defaultProps = {
  className: undefined,
  variant: 'night-blue',
  children: null
};

BreadCrumb.Item = Item;

export default BreadCrumb;
