@rocketsofawesome/mirage/src/core/icons/BoxUpright.js

[Live Demo of the Pattern Library](https://rocketsofawesome.github.io/mirage/)

import React from 'react'
import PropTypes from 'prop-types'
import styled from 'styled-components'

import { Wiggle } from 'SRC'

const BoxUpright = styled(({className}) => {
  return (
    <svg className={className} version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'>
      <path d='M513.11,280.49c-6.52-5.45-54.73-31.93-54.73-31.93l-96.11,0.33c0,0-5.04-34.97-54.41-34.21
        c-53.97,1.3-57.96,45.68-57.96,45.68c-71.67,11.59-157.63,8.19-163.09,12.15c-4.68,3.4-5.94,238.79-2.12,242.88
        c3.82,4.09,52.89,22.37,52.89,22.37c189.82,15.09,360.07-6.25,360.07-6.25C501.07,452.89,516.15,310.47,513.11,280.49z
         M308.42,223.48c44.72-0.54,49.94,35.73,48.63,43.22c-1.53,2-5.65,2.31-6.62-0.22c-0.98-2.52-4.73-36.91-42.9-34.63
        s-37.62,26.92-42.23,36.54c-1.27,2.66-4.44,3.72-5.77,1.12C257.36,265.29,260.53,224.06,308.42,223.48z M333.71,252.91
        c-20.53,0.33-20.78,4.64-53.77,3.07c-3.61-0.17,8.05-16.86,28.57-17.43C330.91,237.93,337.28,252.85,333.71,252.91z M458.16,475.97
        c0,0-24.09,5.55-29.84,5.77c-5.76,0.22-39.98,1.5-39.98,1.5l-31.89,3.45c-2.64-19.52-2.2-26.04-0.14-28.97
        c2.06-2.93,5.32-6.84,13.25-7.38c9.67-0.43,18.14,9.77,18.14,9.77s4.34-30.3,22.81-30.3s17.59,12.81,17.59,12.81l1,18.7
        c0,0,4.98-4.47,14.42-4.36c9.45,0.11,12.38,0.87,14.66,5C460.44,466.09,458.16,475.97,458.16,475.97z M498.12,292.44
        c-3.42,1.57-103.95,1.04-121.36,1.9c-17.41,0.86-201.49,10.79-228.33,13.95c0.11,68.85-6.73,109.68-4.47,218.72
        c-1.95,2.5-5.02,3.19-6.98,0.69c-1.95-2.5,3.3-207.69,2.65-222.56c-2.93-4.17-39.86-19.22-41.48-21.94
        c-1.63-2.71-0.33-6.84,4.02-6.41s43.16,23.18,44.96,23.2c27.01,0.2,182.65-10.81,192.76-10.93c10.11-0.11,156-5.54,157.68-3.8
        C501.71,285.82,501.82,291.49,498.12,292.44z'/>
      <path d='M69.37,272.23c2.28,0,4.58-1.4,4.47-3.69s-31.17-30.95-30.84-33.99c0.33-3.04,39.45-3.15,40.72-4.56
        s-10.1-44.2-8.04-46.59c2.06-2.39,45.72,5,49.09,3.48c3.37-1.52,7.6-59.73,10.53-61.03c2.93-1.3,40.72,28.67,43.66,28.45
        c2.93-0.22,4.24-1.52,4.24-4.34c0-3.5-49.52-35.4-53-33.88c-3.48,1.52-7.82,61.9-10.53,63.53s-50.39-3.04-51.8-0.76
        c-1.41,2.28,9.45,44.96,7.06,46.81c-2.39,1.85-37.03,0.65-39.31,2.28c-2.28,1.63-1.74,5-0.33,7.28
        C36.69,237.49,67.09,272.23,69.37,272.23z'/>
      <path d='M228.59,159.08c-1.95,0.98-4.67,1.52-6.84,0s-8.36-43.87-6.41-47.89c1.95-4.02,46.62,23,50.46,20.95
        s14.81-43.64,19.15-44.51s29,33.83,32.36,33.86c3.37,0.03,42.68-41.02,46.26-40.05s12.41,42.76,11.04,44.02
        c-1.37,1.26-8.4,2.08-9.94,0.04c-1.53-2.04-2.59-31.19-5.7-31.76c-3.11-0.57-39.6,38.42-43.72,38.52s-25-33.39-29.17-32.5
        c-4.17,0.9-12.96,41.95-17.09,43.03c-4.13,1.09-43.4-24.21-46.3-22.31S230.54,158.11,228.59,159.08z'/>
      <path d='M410.32,149.85c-3.32-0.2-6.46-2.5-4.72-5.32c1.74-2.82,45.14-36.4,52.25-31.84c6.24,4,2.86,35.21,5.9,37.16
        c3.04,1.95,68.58-12.67,75.26-4.24c6.19,7.82-22.91,39.48-21.83,42.52c1.09,3.04,48.71,6.57,53.05,13.74s-29.59,48.98-34.15,48.98
        c-4.56,0-6.08-0.71-5.86-5.05c0.22-4.34,32.42-34.15,30.68-39.58c-1.74-5.43-55.17-9.18-56.25-13.52
        c-1.09-4.34,27.37-38.55,24.76-42.03c-2.61-3.48-66.59,8.6-70.94,6.42c-4.34-2.17-0.29-34.97-4.2-36.93
        C450.35,118.21,413.04,150.02,410.32,149.85z'/>
    </svg>
  )
})`
  &:hover {
    ${props => props.animated && Wiggle}
  }
  path {
    fill: ${props => props.theme.colors.rocketBlue};
  }
`

BoxUpright.propTypes = {
  animated: PropTypes.bool,
  theme: PropTypes.shape({
    colors: PropTypes.shape({
      rocketBlue: PropTypes.string
    })
  })
}

/** @component */
export default BoxUpright