import React from 'react';
import PropTypes from 'prop-types';
import useStylesVariables from '@fibery/vizydrop-styles-variables/useStylesVariables';

export const ReloadIcon = ({color}) => {
    const {iconColorDefault} = useStylesVariables();

    return (
        <svg width="16" height="16" viewBox="0 0 16 16" version="1.1" style={{display: `block`}}>
            <path fill={color || iconColorDefault} d="M9.5768,5.20674 C8.86638,5.2745 8.2256,5.34106 8.02131,5.37825 C7.49132,5.47472 7,5.62279 7,6.17507 C7,6.72736 7.46902,6.99999 8.02131,7 L12.019,6.99998 C12.5713,6.99998 13.019,6.55226 13.019,5.99998 L13.019,5.99196 L13.019,2.0011 C13.019,1.44881 12.7464,0.9798 12.1941,0.9798 C11.6418,0.9798 11.4938,1.47111 11.3973,2.0011 C11.3528,2.24555 11.2662,3.11499 11.1859,3.98088 C10.1459,2.19818 8.21363,1 6,1 C2.68629,1 0,3.68629 0,7 C0,10.3137 2.68629,13 6,13 C7.0912,13 8.11719,12.7078 9.0007,12.1967 C9.4388,11.9433 9.8415,11.6363 10.2,11.2848 C10.4981,10.9927 10.7658,10.6696 10.998,10.3206 C11.304,9.8608 11.1793,9.24 10.7195,8.93406 C10.2598,8.62808 9.639,8.75276 9.333,9.2125 C9.178,9.4454 8.9992,9.6613 8.79996,9.8566 C8.56021,10.0916 8.29125,10.2966 7.99927,10.4655 C7.41195,10.8052 6.73024,11 6,11 C3.79086,11 2,9.2091 2,7 C2,4.79086 3.79086,3 6,3 C7.56365,3 8.91922,3.89787 9.5768,5.20674 Z" transform="translate(1 1)" />
        </svg>
    );
};

ReloadIcon.displayName = `ReloadIcon`;
ReloadIcon.propTypes = {
    color: PropTypes.string,
};