import PropTypes from 'prop-types';

import './style.scss';

function BlazeLogo( {
	className = 'blaze-logo',
	size = 40,
	colorStart = '#E94338',
	colorEnd = '#FFB800',
} ) {
	return (
		<svg className={ className } height={ size } width={ size } viewBox="0 0 48 48" fill="none">
			<path
				d="M42 26.6948C42 28.9029 41.5306 31.0797 40.6133 33.1203C39.6959 35.161 38.3625 37.0134 36.6664 38.5727C34.981 40.132 32.9756 41.3669 30.7675 42.2145C29.7221 42.6122 28.6447 42.9157 27.546 43.125L28.0367 42.8634C28.0367 42.8634 32.2822 40.4355 33.1249 34.9936C33.5196 30.1378 29.4874 28.0134 29.4874 28.0134C29.4874 28.0134 27.4393 30.6069 24.5272 30.6069C19.951 30.6069 20.7812 22.9934 20.7812 22.9934C20.7812 22.9934 13.8387 26.5692 13.8387 34.3552C13.8387 39.2215 18.7456 42.811 18.7456 42.811V42.8215C18.1056 42.6541 17.4762 42.4448 16.8575 42.2041C14.6494 41.3564 12.644 40.1215 10.9586 38.5622C9.27317 37.0029 7.92911 35.1506 7.01173 33.1099C6.09435 31.0692 5.625 28.8924 5.625 26.6843C5.625 19.2122 14.3507 11.9703 14.3507 11.9703C14.3507 11.9703 15.1828 17.6529 19.439 17.6529C27.4393 17.6529 24.5272 4.875 24.5272 4.875C24.5272 4.875 31.8022 9.1343 33.989 20.489C37.9583 19.9737 37.6265 14.8064 37.6265 14.8064C37.6265 14.8064 42 20.489 42 26.7471"
				fill="url(#paint0_linear_4967_37660)"
			/>
			<defs>
				<linearGradient
					id="paint0_linear_4967_37660"
					x1="23.8125"
					y1="4.875"
					x2="23.8125"
					y2="43.125"
					gradientUnits="userSpaceOnUse"
				>
					<stop stopColor={ colorStart } />
					<stop offset="1" stopColor={ colorEnd } />
				</linearGradient>
			</defs>
		</svg>
	);
}

BlazeLogo.propTypes = {
	className: PropTypes.string,
	size: PropTypes.number,
};

export default BlazeLogo;
