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

import './dropdown-separation.scss';

const Separation = ({ className, component: Component, closePanel, onClick, ...props }) => (
  <Component
    className={className}
    styleName={classNames('base')}
    onClick={() => { if (closePanel) closePanel(); if (onClick) onClick(); }}
    {...props}
  />
);

Separation.propTypes = {
  /** @ignore */
  className: PropTypes.string,
  /** @ignore */
  onClick: PropTypes.func,
  component: PropTypes.oneOfType([
    PropTypes.string,
    PropTypes.object,
    PropTypes.func
  ]),
  closePanel: PropTypes.func
};

Separation.defaultProps = {
  className: undefined,
  component: 'span',
  closePanel: null,
  onClick: null
};

Separation.componentName = 'Separation';

export default Separation;
