@gravityforms/components
Version:
UI components for use in Gravity Forms development. Both React and vanilla js flavors.
51 lines (45 loc) • 2.7 kB
JavaScript
import { React, PropTypes } from '@gravityforms/libraries';
const { forwardRef } = React;
/**
* @module MailtrapLogo
* @description The Mailtrap logo.
*
* @since 6.5.0
*
* @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 MailtrapLogo from '@gravityforms/components/react/admin/elements/Svgs/MailtrapLogo';
*
* return (
* <MailtrapLogo height={ 44 } width={ 44 } />
* );
*
*/
const MailtrapLogo = forwardRef( ( {
height = 44,
title = '',
width = 44,
}, ref ) => {
return (
<svg xmlns="http://www.w3.org/2000/svg" width={ width } height={ height } viewBox="0 0 44 44" fill="none" ref={ ref }>
{ title !== '' && <title>{ title }</title> }
<path d="M22,0h0c12.15,0,22,9.85,22,22h0c0,12.15-9.85,22-22,22h0C9.85,44,0,34.15,0,22h0C0,9.85,9.85,0,22,0Z" fill="#F1F1F1" />
<path d="M28.69,28.21l-6,3.46c-.21.12-.45.18-.69.18s-.48-.06-.69-.18l-6-3.46c-.16-.09-.33-.14-.52-.14s-.36.05-.52.14l-2.16,1.25c-.08.05-.14.11-.19.19-.05.08-.07.17-.07.26s.02.18.07.26c.05.08.11.14.19.19l9.19,5.29c.21.12.45.18.69.18s.48-.06.69-.18l9.19-5.3c.08-.05.14-.11.19-.19.05-.08.07-.17.07-.26s-.02-.18-.07-.26c-.05-.08-.11-.14-.19-.19l-2.15-1.24c-.16-.09-.33-.14-.52-.14s-.36.05-.52.14Z" fill="#1A2E44" />
<path d="M17.03,14.33l4.28-2.47c.21-.12.45-.18.69-.18s.48.06.69.18l4.29,2.47c.16.09.33.14.52.14s.36-.05.52-.14l2.16-1.25c.08-.05.14-.11.19-.19.05-.08.07-.17.07-.26s-.02-.18-.07-.26-.11-.14-.19-.19l-7.48-4.32c-.21-.12-.45-.18-.69-.18s-.48.06-.69.18l-7.46,4.31c-.08.05-.14.11-.19.19-.05.08-.07.17-.07.26s.02.18.07.26c.05.08.11.14.19.19l2.15,1.25c.16.09.33.14.51.14.18,0,.36-.04.52-.13Z" fill="#1A2E44" />
<path d="M31.78,14.12l-9.79,5.65-9.8-5.65c-.26-.15-.56-.23-.86-.23s-.6.08-.86.23c-.26.15-.48.37-.63.63-.15.26-.23.56-.23.86v12.4c0,.09.02.18.07.26.05.08.11.14.19.19.08.05.17.07.26.07.09,0,.18-.02.26-.07l2.16-1.24c.16-.09.29-.22.38-.38.09-.16.14-.33.14-.52v-7.72l8.25,4.76c.21.12.45.18.69.18s.48-.06.69-.18l8.25-4.76v7.72c0,.18.05.36.14.52.09.16.22.29.38.38l2.16,1.24c.08.05.17.07.26.07.09,0,.18-.02.26-.07.08-.05.14-.11.19-.19.05-.08.07-.17.07-.26v-12.4c0-.3-.08-.6-.23-.86-.15-.26-.37-.48-.63-.63-.26-.16-.56-.24-.87-.24-.31,0-.61.08-.87.23Z" fill="#22D172" />
</svg>
);
} );
MailtrapLogo.propTypes = {
height: PropTypes.number,
title: PropTypes.string,
width: PropTypes.number,
};
MailtrapLogo.displayName = 'Svgs/MailtrapLogo';
export default MailtrapLogo;