Add aria-label to Preview component (#1705)

Co-authored-by: Schmith Daniel <[email protected]>

src/Preview.js

@@ -57,7 +57,7 @@ export default class Preview extends Component {
   }
 
   render () {
-    const { light, onClick, playIcon, previewTabIndex } = this.props
+    const { light, onClick, playIcon, previewTabIndex, previewAriaLabel } = this.props
     const { image } = this.state
     const isElement = React.isValidElement(light)
     const flexCenter = {
@@ -102,6 +102,7 @@ export default class Preview extends Component {
         onClick={onClick}
         tabIndex={previewTabIndex}
         onKeyPress={this.handleKeyPress}
+        {...(previewAriaLabel ? { 'aria-label': previewAriaLabel } : {})}
       >
         {isElement ? light : null}
         {playIcon || defaultPlayIcon}

src/ReactPlayer.js

@@ -135,13 +135,14 @@ export const createReactPlayer = (players, fallback) => {
 
     renderPreview (url) {
       if (!url) return null
-      const { light, playIcon, previewTabIndex, oEmbedUrl } = this.props
+      const { light, playIcon, previewTabIndex, oEmbedUrl, previewAriaLabel } = this.props
       return (
         <Preview
           url={url}
           light={light}
           playIcon={playIcon}
           previewTabIndex={previewTabIndex}
+          previewAriaLabel={previewAriaLabel}
           oEmbedUrl={oEmbedUrl}
           onClick={this.handleClickPreview}
         />

src/props.js

@@ -20,6 +20,7 @@ export const propTypes = {
   light: oneOfType([bool, string, object]),
   playIcon: node,
   previewTabIndex: number,
+  previewAriaLabel: string,
   fallback: node,
   oEmbedUrl: string,
   wrapper: oneOfType([
@@ -118,6 +119,7 @@ export const defaultProps = {
   fallback: null,
   wrapper: 'div',
   previewTabIndex: 0,
+  previewAriaLabel: '',
   oEmbedUrl: 'https://noembed.com/embed?url={url}',
   config: {
     soundcloud: {