import * as React from 'react';

import AccessibleSVG from '../accessible-svg';
import { bdlBoxBlue } from '../../styles/variables';

import { Icon } from '../iconTypes';

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;
