@gravityforms/components/react/admin/elements/Svgs/BrokenImage/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 BrokenImage
 * @description The BrokenImage svg.
 *
 * @since 5.4.4
 *
 * @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 BrokenImage from '@gravityforms/components/react/admin/elements/Svgs/BrokenImage';
 *
 * return (
 *    <BrokenImage height={ 44 } width={ 44 } />
 * );
 *
 */
const BrokenImage = 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="#10B3FF" rx={ 46 } />
			<path
				fill="#fff"
				fillRule="evenodd"
				d="m49.31 54.395 3.9-3.9 4.264 4.262c.998.998 2.812.545 3.084-1.27 0-.362-.09-.725-.363-.907l-5.442-5.442c-1.724-1.542-3.084 0-3.084 0l-3.9 3.9-4.626-4.625h-.09l1.723 6.44 1.45 1.45c1.543 1.724 3.085.092 3.085.092Zm14.513-24.49H38.608c-.182 0-.272.181-.272.272l.816 3.175c0 .09.09.18.272.18h22.585c.09 0 .272.092.272.273v26.757c0 .091-.09.273-.272.273H46.5c-.09 0-.181.09-.09.18l.906 3.357c0 .09.09.09.09.09h16.509c1.179 0 2.086-.906 2.086-2.086V31.991c-.09-1.18-.998-2.086-2.177-2.086Zm-10.612 9.07a1.82 1.82 0 0 0-1.814-1.814 1.82 1.82 0 0 0-1.814 1.814 1.82 1.82 0 0 0 1.814 1.814 1.82 1.82 0 0 0 1.814-1.814ZM31.805 54.576c.635.907 1.905.998 2.63.181l3.356-3.356v-.09l-1.088-3.72s-.09-.09-.09 0l-4.627 4.627c-.544.635-.725 1.632-.181 2.358Zm8.254 4.535c0-.09-.09-.181-.272-.181h-8.345a1.82 1.82 0 0 1-1.814-1.814v-23.22c0-1.18.998-2.177 2.177-2.177.181 0 .363-.182.363-.454l-.816-2.993c0-.181-.182-.272-.363-.272h-1.36A3.639 3.639 0 0 0 26 31.628V58.84a3.639 3.639 0 0 0 3.628 3.628h11.066c.181 0 .272-.181.272-.363l-.907-2.993Z"
				clipRule="evenodd"
			/>
		</svg>
	);
} );

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

BrokenImage.displayName = 'Svgs/BrokenImage';

export default BrokenImage;