react-text-to-speech - npm Package Compare versions

Comparing version 0.3.13 to 0.3.14

package.json

		{
		"name": "react-text-to-speech",
		"version": "0.3.13",
		"version": "0.3.14",
		"description": "An easy to use react component for the Web Speech API.",
		@@ -5,0 +5,0 @@ "main": "./build/index.js",

README.md

		# react-text-to-speech

		An easy to use react component for the [Web Speech API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API).

		It is as easy as to import a React component!

		## Features

		- Text-to-speech
		@@ -13,8 +10,4 @@ - Easy to use
		- Stops speech instance on page reload.


		## Installation

		To install react-text-to-speech

		```bash
		@@ -27,7 +20,4 @@ # with npm:
		```

		## Usage

		When you use the `<Speech>` component of `react-text-to-speech`, initially your user will see the `startBtn` and when the user clicks on it, the speech instance will start and the user will be able to see the `stopBtn` which will stop the speech instance if the user click on it.

		#### Basic Usage
		@@ -42,9 +32,6 @@ ```javascript
		```

		#### Advanced Usage

		This is the use case where `react-text-to-speech` outshines the other text-to-speech libraries.

		Let's assume that you fetch news from any News API and the API returns 3 news in response as shown below. Now if the user clicks on `startBtn` of #1 news (assuming # as id) and then after some time, clicks on `startBtn` on #2 news before the speech instance of #1 news ends, then `react-text-to-speech` will not just stop the #1 news speech instance and start the #2 news speech instance, but will also convert the `stopBtn` of #1 news to `startBtn`, thus avoiding any error.

		```javascript
		@@ -73,26 +60,19 @@ import React from 'react'
		```

		## Speech Component API Reference

		Here is the full API for the `<Speech>` component, these properties can be set on an instance of Speech:
		\| Parameter \| Type \| Required \| Default \| Description \|
		\| - \| - \| - \| - \| - \|
		\| `id` \| `string \\| number` \| No \| null \| Required when there are multiple speech instances. When a speech instance is started, the already running speech instance will stop and the speech button will automatically be changed to the `startBtn` based on the `id` of the instance. \|
		\| `text` \| `string` \| Yes \| - \| It contains the text to be spoken when `startBtn` is clicked. \|
		\| `style` \| `React.CSSProperties` \| No \| {} \| The style attribute of `JSX.Element`. \|
		\| `startBtn` \| `JSX.Element \\| string` \| No \| `<button>Start Speech</button>` \| Button to start the speech instance. \|
		\| `stopBtn` \| `JSX.Element \\| string` \| No \| `<button>Stop Speech</button>` \| Button to stop the speech instance. \|
		\| `pitch` \| `Number (0 to 10)` \| No \| 5 \| The pitch at which the utterance will be spoken at. \|
		\| `rate` \| `Number (0 to 10)` \| No \| 5 \| The speed at which the utterance will be spoken at. \|
		\| `volume` \| `Number (0 to 10)` \| No \| 10 \| The volume at which the utterance will be spoken at. \|

		\| Parameter \| Type \| Required \| Default \| Description \|
		\| - \| - \| - \| - \| - \|
		\| `id` \| `string \\| number` \| No \| null \| Required when there are multiple speech instances. When a speech instance is started, the already running speech instance will stop and the speech button will automatically be changed to the `startBtn` based on the `id` of the instance. \|
		\| `text` \| `string` \| Yes \| - \| It contains the text to be spoken when `startBtn` is clicked. \|
		\| `style` \| `React.CSSProperties` \| No \| {} \| The style attribute of `JSX.Element`. \|
		\| `startBtn` \| `JSX.Element \\| string` \| No \| `<button>Start Speech</button>` \| Button to start the speech instance. \|
		\| `stopBtn` \| `JSX.Element \\| string` \| No \| `<button>Stop Speech</button>` \| Button to stop the speech instance. \|
		\| `pitch` \| `Number (0 to 10)` \| No \| 5 \| The pitch at which the utterance will be spoken at. \|
		\| `rate` \| `Number (0 to 10)` \| No \| 5 \| The speed at which the utterance will be spoken at. \|
		\| `volume` \| `Number (0 to 10)` \| No \| 10 \| The volume at which the utterance will be spoken at. \|

		## Used By

		- [NewsDose](https://newsdoseweb.netlify.app/)
		- [CloudNotes](https://cloudnotesweb.netlify.app/)
		- [NewsDose](https://newsdoseweb.netlify.app/)


		## Author

		[Sahil Aggarwal](https://www.github.com/SahilAggarwal2004)

react-text-to-speech - npm Package Compare versions

Worsened metrics