@gravityforms/components/react/admin/elements/Svgs/GravityFormsLogo/index.js

UI components for use in Gravity Forms development. Both React and vanilla js flavors.

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

const { forwardRef } = React;

/**
 * @module GravityFormsLogo
 * @description The GravityForms logo.
 *
 * @since 3.6.6
 *
 * @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 GravityFormsLogo from '@gravityforms/components/react/admin/elements/Svgs/GravityFormsLogo';
 *
 * return (
 *    <GravityFormsLogo height={ 70 } width={ 91 } />
 * );
 *
 */
const GravityFormsLogo = forwardRef( ( {
	height = 44,
	title = '',
	width = 44,
}, ref ) => {
	return (
		<svg
			xmlns="http://www.w3.org/2000/svg"
			fill="none"
			width={ width }
			height={ height }
			viewBox="0 0 44 44"
			ref={ ref }
		>
			{ title !== '' && <title>{ title }</title> }
			<rect width={ 44 } height={ 44 } fill="#FF4F00" rx={ 22 } />
			<path
				fill="#fff"
				d="M18.72 18.817H34.6v-4.47H18.782c-2.277 0-4.124.796-5.601 2.327-3.447 3.673-3.57 12.978-3.57 12.978h24.866v-8.448h-4.493v3.918H14.412c.123-1.47.8-4.102 2.031-5.448.554-.551 1.293-.857 2.277-.857Z"
			/>
		</svg>
	);
} );

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

GravityFormsLogo.displayName = 'Svgs/GravityFormsLogo';

export default GravityFormsLogo;