import React from 'react'
import { DefaultProps } from 'icons/typings'
import Vector from 'atoms/Vector'

// extending interface from Label component
interface Props extends DefaultProps {}

const wording = {
  description:
    'An computer denotes an user to record an event or an experience',
  title: 'Register Icon',
  vectorClassName: 'register',
}

class RegisterIcon extends React.PureComponent<Props> {
  static defaultProps = {
    width: '30px',
    height: '30px',
    viewBox: '0 0 30 30',
    stroke: '#000000',
    fill: 'F7F8F9',
  }

  render() {
    return (
      <Vector {...this.props} {...wording}>
        <g
          fill="none"
          fillRule="evenodd"
          strokeLinecap="round"
          strokeLinejoin="round"
        >
          <path d="M20.7 24.5H15m14 0h-5.5" />
          <path
            d="M23 24.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"
            strokeWidth=".8"
            stroke={this.props.stroke}
          />
          <path d="M15 27v-4.47c0-.3.24-.53.53-.53h12.94c.3 0 .53.24.53.53V27H15z" />
          <path
            d="M4 27c0-2.18 3.36-3 7.5-3 4.14 0 7.5.82 7.5 3H4z"
            fill={this.props.fill}
          />
          <path d="M11 20v4m2-4v4" />
          <g transform="translate(1 4)">
            <polygon points="2 14 19 14 19 2 2 2" />
            <path d="M19.9 16H1.1C.5 16 0 15.55 0 15V1c0-.55.5-1 1.1-1h18.8c.6 0 1.1.45 1.1 1v14c0 .55-.5 1-1.1 1z" />
          </g>
        </g>
      </Vector>
    )
  }
}

export { RegisterIcon }
export default RegisterIcon