import PropTypes from 'prop-types';

/**
 * Computes the correct tooltip content based on the various content-related
 * props that can be provided. If `content` is provided, it's used directly as
 * the tooltip content as-is; if `Component` is provided, it rendered with
 * the contents of the `props` prop passed as its props.
 */
const TooltipContent = function TooltipContent(props) {
  const {
    active,
    content,
    props: childProps
  } = props;
  if (!active) return null;

  // If `content` is a function we assume it's a component type
  if (typeof content === 'function') {
    const Component = content;
    return <Component {...childProps} />;
  }

  // otherwise we assume `content` is the plain children to render
  return content;
};
TooltipContent.defaultProps = {
  content: null,
  props: {},
  active: false
};
TooltipContent.propTypes = {
  /**
   * The tooltip content. If it's a function we assume that it's a React
   * element type and we render it with the `props` prop passed to it as its
   * props. Otherwise we use it as the tooltip content as-is.
   */
  content: PropTypes.oneOfType([PropTypes.elementType, PropTypes.node]),
  /**
   * The props to pass to the component specified as `content`. Only used if
   * `content` is a function, in which case we assume it's a React element
   * type.
   */
  props: PropTypes.shape({}),
  /**
   * Whether the tooltip is active
   */
  active: PropTypes.bool
};
export default TooltipContent;