import PropTypes from 'prop-types';
import clsx from 'clsx';
import InfoIcon from '@goodhood/icons/lib/small/info_1';

import Marker from '../marker';
import styles from './index.module.scss';


const InfoMarker = ({
  children,
  className,
  small = false,
  ...rest
}) => (
  <Marker {...rest} className={clsx(className, { [styles.isSmall]: small })}>
    <div className={styles.container}>
      <InfoIcon className={styles.icon} />
    </div>
    {children}
  </Marker>
);

InfoMarker.propTypes = {
  children: PropTypes.node,
  className: PropTypes.string,
  small: PropTypes.bool.isRequired,
};

export default InfoMarker;