@gravityforms/components
Version:
UI components for use in Gravity Forms development. Both React and vanilla js flavors.
71 lines (65 loc) • 6.45 kB
JavaScript
import { React, PropTypes } from '@gravityforms/libraries';
const { forwardRef } = React;
/**
* @module MailFailed
* @description The Mail Failed.
*
* @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 MailFailed from '@gravityforms/components/react/admin/elements/Svgs/MailFailed';
*
* return (
* <MailFailed height={ 130 } width={ 314 } />
* );
*
*/
const MailFailed = forwardRef( ( {
height = 130,
title = '',
width = 314,
}, ref ) => {
return (
<svg xmlns="http://www.w3.org/2000/svg" width={ width } height={ height } fill="none" ref={ ref }>
{ title !== '' && <title>{ title }</title> }
<path fill="#BBBBCE" fillRule="evenodd" d="M103 128a1 1 0 0 0 0 2h114a1 1 0 0 0 0-2H103Z" clipRule="evenodd" />
<rect width="12" height="2" x="222" y="128" fill="#BBBBCE" rx="1" />
<g filter="url(#a)">
<rect width="90" height="76" x="115" y="52" fill="#fff" rx="4" />
<rect width="92" height="78" x="114" y="51" stroke="#BBBBCE" strokeWidth="2" rx="5" />
</g>
<mask id="b" width="94" height="80" x="113" y="50" maskUnits="userSpaceOnUse" style={ { maskType: 'luminance' } }>
<rect width="92" height="78" x="114" y="51" fill="#fff" stroke="#fff" strokeWidth="2" rx="5" />
</mask>
<g fillRule="evenodd" clipRule="evenodd" mask="url(#b)">
<path fill="#BBBBCE" stroke="#BBBBCE" d="M204.537 53.844 162.288 80.64a4 4 0 0 1-4.285 0L116 54l.537-.844 41.461 26.385a4 4 0 0 0 4.295 0L204 53l.537.844Z" />
<path fill="#0F3D6C" d="M141 95a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm38 0a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm-27.22 10.87a5.259 5.259 0 0 0-.395.707 1.501 1.501 0 0 1-2.77-1.154c.39-.934 1.222-2.237 2.618-3.525 2.301-2.124 5.379-3.398 9.267-3.398s6.966 1.274 9.267 3.398c1.396 1.288 2.228 2.591 2.618 3.525a1.501 1.501 0 0 1-2.77 1.154 5.259 5.259 0 0 0-.395-.707 9.082 9.082 0 0 0-1.487-1.768c-1.762-1.626-4.121-2.602-7.233-2.602-3.112 0-5.471.976-7.233 2.602a9.082 9.082 0 0 0-1.487 1.768Z" />
</g>
<path fill="#0F3D6C" d="M297.156 28.007a1.19 1.19 0 0 0-1.027-.712l-5.796-.308-4.45-3.724c-.69-.577-1.902-.05-1.95.848l-.307 5.796-3.724 4.45a1.19 1.19 0 0 0 .234 1.74c.181.126.394.199.615.21l5.795.308 4.451 3.725a1.19 1.19 0 0 0 1.949-.849l.307-5.795 3.724-4.452a1.191 1.191 0 0 0 .179-1.237ZM280.473 71.032l1.126.838a.172.172 0 0 1 .056.174.172.172 0 0 1-.131.128l-1.388.21-.837 1.127a.172.172 0 0 1-.174.056.174.174 0 0 1-.128-.131l-.211-1.388-1.127-.837a.178.178 0 0 1-.052-.08.171.171 0 0 1-.003-.094.173.173 0 0 1 .131-.128l1.387-.211.838-1.127a.172.172 0 0 1 .174-.055.174.174 0 0 1 .128.13l.211 1.388ZM301.179 96.596l-3.429-3.353a.589.589 0 0 1-.109-.616.6.6 0 0 1 .503-.372l4.795-.076 3.353-3.43a.597.597 0 0 1 .989.394l.076 4.796 3.429 3.353a.589.589 0 0 1 .109.616.593.593 0 0 1-.502.372l-4.796.076-3.353 3.43a.597.597 0 0 1-.874-.09.59.59 0 0 1-.114-.304l-.077-4.796ZM243.02 5.225l3.776-.173a.468.468 0 0 1 .358.758l-2.535 2.805.174 3.776a.473.473 0 0 1-.268.414.47.47 0 0 1-.49-.056l-2.805-2.534-3.777.174a.469.469 0 0 1-.358-.759l2.535-2.805-.174-3.776a.465.465 0 0 1 .269-.414.467.467 0 0 1 .49.056l2.805 2.534ZM257.419 109.709l2.875 1.396a.397.397 0 0 1 .128.571.4.4 0 0 1-.168.137l-3.016 1.059-1.396 2.875a.399.399 0 0 1-.708-.04l-1.059-3.016-2.875-1.396a.397.397 0 0 1 .04-.708l3.016-1.059 1.396-2.875a.39.39 0 0 1 .366-.199.395.395 0 0 1 .342.239l1.059 3.016ZM25.018 28.006a1.187 1.187 0 0 1 1.027-.712l5.796-.308 4.45-3.724c.69-.577 1.902-.05 1.95.848l.307 5.796 3.724 4.45a1.188 1.188 0 0 1-.849 1.95l-5.795.308-4.451 3.725a1.188 1.188 0 0 1-1.95-.849l-.307-5.795-3.724-4.452a1.19 1.19 0 0 1-.178-1.237ZM12.996 96.596l3.43-3.353a.594.594 0 0 0-.394-.988l-4.796-.076-3.353-3.43a.593.593 0 0 0-.988.394l-.076 4.796-3.43 3.353a.594.594 0 0 0 .394.988l4.796.076 3.353 3.43a.598.598 0 0 0 .616.109.595.595 0 0 0 .372-.503l.076-4.796ZM81.155 5.224l-3.776-.173a.469.469 0 0 0-.358.758l2.534 2.805-.173 3.776a.468.468 0 0 0 .758.358l2.805-2.534 3.776.174a.469.469 0 0 0 .358-.759l-2.534-2.805.174-3.776a.467.467 0 0 0-.759-.358l-2.805 2.534ZM56.756 109.709l-2.875 1.396a.39.39 0 0 0-.2.366.394.394 0 0 0 .24.342l3.016 1.059 1.396 2.875a.4.4 0 0 0 .708-.04l1.06-3.016 2.874-1.396a.398.398 0 0 0 .128-.571.4.4 0 0 0-.169-.137l-3.015-1.059-1.396-2.875a.397.397 0 0 0-.708.04l-1.06 3.016ZM62.42 64.709l2.874 1.396a.396.396 0 0 1-.04.708l-3.016 1.06-1.396 2.874a.396.396 0 0 1-.708-.04l-1.06-3.016-2.874-1.396a.396.396 0 0 1 .04-.708l3.016-1.06 1.396-2.874a.397.397 0 0 1 .708.04l1.06 3.016ZM223 43.5h-1.5V42a.998.998 0 0 0-1-1 1 1 0 0 0-1 1v1.5H218a1 1 0 1 0 0 2h1.5V47a.998.998 0 0 0 1 1 1 1 0 0 0 1-1v-1.5h1.5a1 1 0 1 0 0-2Zm-26.51-33h-3v-3a.998.998 0 0 0-1-1 1 1 0 0 0-1 1v3h-3a1 1 0 1 0 0 2h3v3a.998.998 0 0 0 1 1 1 1 0 0 0 1-1v-3h3a1 1 0 1 0 0-2ZM95.5 30.5h-3v-3a1 1 0 0 0-2 0v3h-3a1 1 0 0 0 0 2h3v3a1 1 0 0 0 2 0v-3h3a1 1 0 0 0 0-2ZM224.5 79.9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3ZM77.5 87a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3ZM147.5 23a2.501 2.501 0 1 1 0-5.002 2.501 2.501 0 0 1 0 5.002Zm0-4a1.497 1.497 0 0 0-1.386.926 1.503 1.503 0 0 0 1.093 2.045A1.5 1.5 0 1 0 147.5 19Zm102.99 31.5a3.003 3.003 0 0 1-2.772-1.852 2.998 2.998 0 0 1 .651-3.27 2.998 2.998 0 0 1 4.615.455 2.998 2.998 0 0 1-.373 3.788 2.998 2.998 0 0 1-2.121.879Zm0-5a1.998 1.998 0 0 0-1.414 3.414 1.997 1.997 0 0 0 3.077-.303 1.998 1.998 0 0 0-.249-2.525 2 2 0 0 0-1.414-.586Z" />
<defs>
<filter id="a" width="98" height="80" x="113" y="50" colorInterpolationFilters="sRGB" filterUnits="userSpaceOnUse">
<feFlood floodOpacity="0" result="BackgroundImageFix" />
<feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" />
<feOffset dx="4" />
<feColorMatrix values="0 0 0 0 0.733333 0 0 0 0 0.733333 0 0 0 0 0.807843 0 0 0 0.22 0" />
<feBlend in2="BackgroundImageFix" result="effect1_dropShadow_2734_52692" />
<feBlend in="SourceGraphic" in2="effect1_dropShadow_2734_52692" result="shape" />
</filter>
</defs>
</svg>
);
} );
MailFailed.propTypes = {
height: PropTypes.number,
title: PropTypes.string,
width: PropTypes.number,
};
MailFailed.displayName = 'MailFailed';
export default MailFailed;