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

import '../base';
import styles from './Callout.styl';

export default function Callout({ left, label, actions, warning, error, info, success, border = true, children, style }) {

  const wrapperClasses = classNames({
    [styles.callout]: true,
    [styles.left]: left,
    [styles.warning]: warning,
    [styles.error]: error,
    [styles.info]: info,
    [styles.success]: success,
    [styles.border]: !warning && !error && !info && !success && border
  });

  const labelClasses = classNames({
    [styles.label]: true
  });

  const actionsClasses = classNames({
    [styles.actions]: true
  });

  return (
    <div className={wrapperClasses} style={style}>
      {
        label && <div className={labelClasses}>{label}</div>
      }
      {children}
      {
        actions && <div className={actionsClasses}>{actions}</div>
      }
    </div>
  );
}

Callout.propTypes = {
  // eslint-disable-next-line react/forbid-prop-types
  style: PropTypes.object,
  label: PropTypes.oneOfType([
    PropTypes.string,
    PropTypes.object
  ]),
  actions: PropTypes.oneOfType([
    PropTypes.string,
    PropTypes.object,
    PropTypes.node
  ]),
  left: PropTypes.bool,
  children: PropTypes.node,
  error: PropTypes.bool,
  warning: PropTypes.bool,
  info: PropTypes.bool,
  success: PropTypes.bool,
  border: PropTypes.bool
};

Callout.defaultProps = {
  style: undefined,
  label: undefined,
  actions: undefined,
  left: undefined,
  children: undefined,
  error: undefined,
  warning: undefined,
  info: undefined,
  success: undefined,
  border: undefined
};