box-ui-elements-mlh
Version:
129 lines (124 loc) • 6.78 kB
Flow
// @flow
import * as React from 'react';
import AccessibleSVG from '../accessible-svg';
import { bdlBoxBlue } from '../../styles/variables';
import type { Icon } from '../flowTypes';
const TrashEmptyState = ({ className = '', color = bdlBoxBlue, height = 150, title, width = 150 }: Icon) => (
<AccessibleSVG
className={`trash-empty-state ${className}`}
height={height}
title={title}
viewBox="0 0 150 150"
width={width}
>
<g fill="none" fillRule="evenodd">
<path
className="stroke-color"
d="M45.28073 75.53223c4.3214 2.49496 8.70165 2.9984 9.78357 1.12446 1.08192-1.87394-1.5442-5.41563-5.8656-7.9106-4.3214-2.49495-9.6058-1.43236-9.78356-1.12445-.17777.3079 1.5442 5.41562 5.8656 7.91058z"
fill="#FFF"
stroke={color}
strokeWidth="2"
/>
<path
className="stroke-color"
d="M46.03505 80.87926c4.98992 0 9.03504-1.75413 9.03504-3.91797 0-2.16385-4.04513-3.91798-9.03505-3.91798S37 76.60575 37 76.9613c0 .35553 4.04513 3.91796 9.03505 3.91796z"
fill="#FFF"
stroke={color}
strokeWidth="2"
/>
<g transform="translate(48.444 38.083)">
<path
className="stroke-color"
d="M2.62736 1.0046h49.76397c.91774 0 1.64308.67694 1.6203 1.50504l-1.57614 57.26644c-.0229.8312-.7355 1.50503-1.5993 1.50503H4.18248c-.86038 0-1.5765-.67693-1.59928-1.50502L1.00707 2.50964c-.02288-.8312.6989-1.50503 1.6203-1.50503z"
fill="#FFF"
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
/>
<path
className="fill-color"
d="M49.29246 27.29964c-.067-1.9685-1.22874-4.40816-1.25222-6.41713-.04247-3.6339 1.2549-7.51326.77795-9.84354-.41774-2.04093-3.4656 0-4.98155-1.0513-1.45277-1.00752-7.1334-2.5932-7.1334-2.5932-.31096-.08908-.3017-.16128.0459-.16128h13.8405c.3363 0 .6033.26007.59588.6024l-.67487 31.1049c-.00722.33268-.11652.34723-.23043.05087 0 0-.72907-1.67204-.98777-3.72384-.2587-2.0518.2204-1.4933 0-7.96786z"
fill={color}
fillOpacity=".1"
/>
<rect
className="stroke-color"
fill="#FFF"
height="4.82212"
rx="1.8"
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
width="55.41496"
/>
<g className="stroke-color" stroke={color} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2">
<path d="M7.5907 27.79515V16.9531M7.5907 32.61384v3.61402" />
</g>
</g>
<path
className="stroke-color"
d="M103.257 80.87926S89.7577 86.6432 76.18738 86.6432c-13.57032 0-27.14064-5.76394-27.14064-5.76394s18.37126 36.24202 27.10514 36.24202S103.257 80.87926 103.257 80.87926z"
fill="#FFF"
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
/>
<path
className="fill-color"
d="M91.81262 96.55115s-5.78774 4.1301-10.59444 4.1301-5.21354-3.045-9.54552-3.045c-4.332 0-10.5792-1.0851-10.5792-1.0851s11.2938 17.58733 15.35958 17.58733c4.06577 0 15.35958-17.58733 15.35958-17.58733z"
fill={color}
fillOpacity=".1"
/>
<g
className="stroke-color"
fill="#FFF"
stroke={color}
strokeWidth="2"
transform="translate(46.035 105.593)"
>
<ellipse cx="30.11682" cy="8.43871" rx="30.11682" ry="8.43871" />
<path
d="M12.04673 7.80834c0 1.67973 8.09026 3.04143 18.0701 3.04143 9.97983 0 18.0701-1.3617 18.0701-3.04143 0-1.67974-8.09027-3.04144-18.0701-3.04144"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M30.11682 4.7669c-9.97983 0-18.0701 1.3617-18.0701 3.04144"
strokeDasharray="3.6"
strokeLinecap="round"
strokeLinejoin="round"
/>
</g>
<path
className="stroke-color"
d="M90.2082 113.6662c2.16024 3.70537-.33194 6.74578-4.07143 8.97576-4.1531 2.47663-8.69685 3.08167-10.3444 1.1182-1.64756-1.96348-.2627-6.33313 2.8975-9.9931 2.84545-3.29543 6.27243-5.2218 9.54637-2.45094l18.74886-16.16738c.46653-.4023 1.16216-.3465 1.5559.12275l.99397 1.18454c.3966.47264.3269 1.1648-.1493 1.5536L90.2082 113.6662z"
fill="#FFF"
stroke={color}
strokeWidth="2"
/>
<path
className="fill-color"
d="M81.39815 112.88565c2.08083-1.9514 4.61106-2.5349 6.99256.30324 2.38932 2.84746 1.40867 5.25742-.88993 6.96958-.2194-.26147 2.06638-2.42637-.6568-5.67173-2.72317-3.24536-5.22564-1.29503-5.44582-1.6011z"
fill={color}
fillOpacity=".1"
/>
<path
className="stroke-color"
d="M58.70768 90.23563c-3.00312 3.32247-15.10927 9.17933-17.7233 9.17933-2.614 0 9.46567-16.12464 9.46567-16.12464M98.1593 105.64985c3.33694 3.32247 12.3125-4.0652 14.98092-7.44042 2.6684-3.3752-10.51787-16.12464-10.51787-16.12464"
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
/>
<path
className="fill-color"
d="M74.95112 21.0017c0-.55323.44676-1.0017 1.00653-1.0017.5559 0 1.00654.45064 1.00654 1.0017v5.20064c0 .55322-.44678 1.0017-1.00655 1.0017-.5559 0-1.00653-.45066-1.00653-1.0017V21.0017zm11.81316 2.96304c.3556-.4238.98612-.48016 1.41493-.12035.42585.3573.4814.9922.1272 1.41432l-3.34293 3.98392c-.3556.4238-.9861.48017-1.41492.12035-.42584-.35733-.48138-.9922-.12718-1.41433l3.3429-3.98393zm-21.61326 0c-.3556-.4238-.98612-.48016-1.41492-.12035-.42584.3573-.4814.9922-.12718 1.41432l3.3429 3.98392c.3556.4238.98613.48017 1.41494.12035.42584-.35733.48138-.9922.12717-1.41433l-3.3429-3.98393z"
fill={color}
/>
</g>
</AccessibleSVG>
);
export default TrashEmptyState;