import { React, PropTypes } from '@gravityforms/libraries';

const { forwardRef } = React;

/**
 * @module CustomSMTP
 * @description The CustomSMTP logo.
 *
 * @since 2.3.1
 *
 * @param {object}      props        Component props.
 * @param {number}      props.height The height of the logo.
 * @param {string}      props.title  The title of the logo.
 * @param {number}      props.width  The width of the logo.
 * @param {object|null} ref          Ref to the component.
 *
 * @return {JSX.Element} The svg component.
 * @example
 * import CustomSMTP from '@gravityforms/components/react/admin/elements/Svgs/CustomSMTP';
 *
 * return (
 *    <CustomSMTP height={ 44 } width={ 44 } />
 * );
 *
 */
const CustomSMTP = forwardRef( ( {
	height = 44,
	title = '',
	width = 44,
}, ref ) => {
	return (
		<svg xmlns="http://www.w3.org/2000/svg" width={ width } height={ height } fill="none" viewBox="0 0 92 92" ref={ ref }>
			{ title !== '' && <title>{ title }</title> }
			<rect width="92" height="92" fill="#FF4F00" rx="46" />
			<path fill="#fff" d="M51.012 65.526c-.312.748-.857 1.216-1.636 1.405-.779.186-1.449-.002-2.01-.563l-6.637-6.642c-.343-.343-.544-.78-.606-1.31-.063-.53.06-1.012.372-1.449l8.507-14.03-13.975 8.652c-.436.249-.911.35-1.425.303a2.098 2.098 0 0 1-1.333-.63l-6.637-6.642c-.56-.561-.748-1.232-.563-2.011.189-.78.657-1.325 1.404-1.637l36.411-14.826c.935-.312 1.745-.125 2.43.561.686.686.857 1.481.515 2.386L51.012 65.526Z" />
		</svg>
	);
} );

CustomSMTP.propTypes = {
	height: PropTypes.number,
	title: PropTypes.string,
	width: PropTypes.number,
};

CustomSMTP.displayName = 'Svgs/CustomSMTP';

export default CustomSMTP;
