import ClassName from 'classnames';
import React from 'react';

import './Icon.scss';

const DEFAULT_SIZE = '1em';

export const Icon = (props) => {
  const className = ClassName('Icon', props.className);

  const size = props.size || DEFAULT_SIZE;
  const style = {
    height: size,
    width: size,
  };

  if (props.middle) {
    style.verticalAlign = 'middle';
  }

  return (
    <span className={className} style={style} title={props.title}>
      {React.createElement(props.icon)}
    </span>
  );
};
