import React from 'react';
import PropTypes from 'prop-types';
import './style.scss';
import './icons.svg';

const Icon = ({color, name, size, classNames}) => (
    <svg className={`Icon_size-${size} Icon_color-${color} ${classNames}`}>
        <use xlinkHref={`#icons_${name}`} />
    </svg>
);

Icon.propTypes = {
    color: PropTypes.string,
    name: PropTypes.string.isRequired,
    size: PropTypes.string,
    classNames: PropTypes.string,
};

Icon.defaultProps = {
    color: 'black',
    size: 'medium',
    classNames: null,
};

export default Icon;
