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: 'Search icon',
  title: 'Search Icon',
  vectorClassName: 'search',
}

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

  render() {
    const { fill } = this.props
    return (
      <Vector {...this.props} {...wording}>
        <g fill="none" fillRule="evenodd">
          <path
            d="M12.5 11h-.79l-.28-.27A6.471 6.471 0 0 0 13 6.5 6.5 6.5 0 1 0 6.5 13c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L17.49 16l-4.99-5zm-6 0C4.01 11 2 8.99 2 6.5S4.01 2 6.5 2 11 4.01 11 6.5 8.99 11 6.5 11z"
            fill={fill}
          />
          <path d="M-3-3h24v24H-3z" />
        </g>
      </Vector>
    )
  }
}

export { SearchIcon }
export default SearchIcon