Add support to pass additional props to the Avatar's img element

[mlaursen]

Description

The Avatar component should support passing all available image props to the <img> tag to help support the referrerPolicy. See this stackoverflow thread for an error with google profile pics.

Proposal

The Avatar will be updated to have two new props: referrerPolicy and imgProps.

Examples with new props:

<Avatar src="https://some.domain/path/to/img.png" referrerPolicy="no-referrer"  />
<Avatar imgProps={{ src: 'https://some.domain/path/to/img.png', referrerPolicy: 'no-referrer' }} />

So any other props (or ref) can be passed as well:

const imgRef = useRef();

return (
  <Avatar
    src="https://some.domain/path/to/img.png"
    imgProps={{
      ref: imgRef,
      style: {}
      className: 'custom',
      referrerPolicy: 'origin-when-cross-origin',
      // other props
    }}
  />
);

Note: any imgProps will be merged with the default implementation and imgProps will take precedence over the "root level" img, src, and referrerPolicy.

Workaround

The current workaround is to just manually provide the <img> as a child instead:

<Avatar>
  <img
    src=="https://some.domain/path/to/img.png"
    style={{ width: 'auto', height: '100%' }}
    referrerPolicy="no-referrer"
  />
</Avatar>