fix i18n aria-label

Author: lhz516

README.md

@@ -120,7 +120,7 @@ The `controls` attribute defaults to `false` and should never be changed to `tru
 | customControlsSection    | [Array<string \|<br>ReactElement>](https://github.com/lhz516/react-h5-audio-player/blob/fa1a61eb7f77146e1ce4547a14181279be68ecfd/src/index.tsx#L92) | [ADDITIONAL_CONTROLS,<br>MAIN_CONTROLS,<br>VOLUME_CONTROLS] | [Custom layout](https://static.hanzluo.com/react-h5-audio-player-storybook/index.html?path=/docs/layouts-advanced) of controls section |
 | customAdditionalControls | [Array<string \|<br>ReactElement>](https://github.com/lhz516/react-h5-audio-player/blob/fa1a61eb7f77146e1ce4547a14181279be68ecfd/src/index.tsx#L93) | [LOOP] | [Custom layout](https://static.hanzluo.com/react-h5-audio-player-storybook/index.html?path=/docs/layouts-advanced) of additional controls |
 | customVolumeControls     | [Array<string \|<br>ReactElement>](https://github.com/lhz516/react-h5-audio-player/blob/fa1a61eb7f77146e1ce4547a14181279be68ecfd/src/index.tsx#L94) | [VOLUME] | [Custom layout](https://static.hanzluo.com/react-h5-audio-player-storybook/index.html?path=/docs/layouts-advanced) of volume controls |
-| i18nAriaLabels           | Object           | I18nAriaLabels | A configuration object to overwrite the default `aria-label` on the action buttons |
+| i18nAriaLabels           | [I18nAriaLabels](https://github.com/lhz516/react-h5-audio-player/blob/e67fe0cdd39d00490b7396ebdc46357815ecb227/src/index.tsx#L138)| [I18nAriaLabels](https://github.com/lhz516/react-h5-audio-player/blob/e67fe0cdd39d00490b7396ebdc46357815ecb227/src/index.tsx#L183) | A configuration object to overwrite the default `aria-label` on the action buttons |
 | mse                      | Object           | null     | A configuration object so the player can play audio chunks, MSE streams and encrypted audio (See [section about Media Source Extensions](#media-source-extensions-and-encrypted-media-extensions) in this Readme) |
 | mse.srcDuration          | number           | -        | The complete duration of the MSE audio chunks together (this is a key of the _mse_ prop) |
 | mse.onSeek               | Function (Event) | -        | The callback to be used when seek happens (this is a key of the _mse_ prop) |

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-h5-audio-player",
-  "version": "3.8.0",
+  "version": "3.8.1",
   "description": "A customizable React audio player. Written in TypeScript. Mobile compatible. Keyboard friendly",
   "main": "./lib/index.js",
   "module": "./es/index.js",

src/index.tsx

@@ -485,7 +485,7 @@ class H5AudioPlayer extends Component<PlayerProps> {
             </button>
             {showJumpControls && (
               <button
-                aria-label="Forward"
+                aria-label={i18nAriaLabels.forward}
                 className="rhap_button-clear rhap_main-controls-button rhap_forward-button"
                 type="button"
                 onClick={this.handleClickForward}
@@ -495,7 +495,7 @@ class H5AudioPlayer extends Component<PlayerProps> {
             )}
             {showSkipControls && (
               <button
-                aria-label="Skip"
+                aria-label={i18nAriaLabels.next}
                 className="rhap_button-clear rhap_main-controls-button rhap_skip-button"
                 type="button"
                 onClick={onClickNext}
@@ -545,7 +545,7 @@ class H5AudioPlayer extends Component<PlayerProps> {
         return (
           <div key={key} className="rhap_volume-container">
             <button
-              aria-label={volume ? 'Mute' : 'Unmute'}
+              aria-label={volume ? i18nAriaLabels.volume : i18nAriaLabels.volumeMute}
               onClick={this.handleClickVolumeButton}
               type="button"
               className="rhap_button-clear rhap_volume-button"