### Run React Speech Recognition Example App

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

Installs project dependencies and starts the development server for the example React application, allowing users to interact with speech recognition features locally. Changes to the app or library will live reload.

```shell
npm i
npm run dev
```

--------------------------------

### Starting Speech Recognition Listening

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Demonstrates the basic usage of `SpeechRecognition.startListening()` to activate the microphone. This function is asynchronous and can be awaited.

```js
SpeechRecognition.startListening()
```

--------------------------------

### Basic Azure Speech Recognition Integration with React

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/POLYFILLS.md

This example demonstrates how to integrate Microsoft Azure Cognitive Services for speech recognition into a React application using `web-speech-cognitive-services` and `react-speech-recognition`. It shows the basic setup for applying the polyfill and using the `useSpeechRecognition` hook to start, abort, and reset transcription. This setup is not recommended for production due to exposed subscription keys.

```jsx
import React from 'react';
import createSpeechServicesPonyfill from 'web-speech-cognitive-services';
import SpeechRecognition, { useSpeechRecognition } from 'react-speech-recognition';

const SUBSCRIPTION_KEY = '<INSERT_SUBSCRIPTION_KEY_HERE>';
const REGION = '<INSERT_REGION_HERE>';

const { SpeechRecognition: AzureSpeechRecognition } = createSpeechServicesPonyfill({
  credentials: {
    region: REGION,
    subscriptionKey: SUBSCRIPTION_KEY,
  }
});
SpeechRecognition.applyPolyfill(AzureSpeechRecognition);

const Dictaphone = () => {
  const {
    transcript,
    resetTranscript,
    browserSupportsSpeechRecognition
  } = useSpeechRecognition();

  const startListening = () => SpeechRecognition.startListening({
    continuous: true,
    language: 'en-US'
  });

  if (!browserSupportsSpeechRecognition) {
    return null;
  }

  return (
    <div>
      <button onClick={startListening}>Start</button>
      <button onClick={SpeechRecognition.abortListening}>Abort</button>
      <button onClick={resetTranscript}>Reset</button>
      <p>{transcript}</p>
    </div>
  );
};
export default Dictaphone;
```

--------------------------------

### Migrating React Speech Recognition: Dictaphone Example in v3

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

This example illustrates the updated Dictaphone component in `react-speech-recognition` v3, leveraging the `useSpeechRecognition` React hook. It replaces the HOC pattern, providing `transcript`, `resetTranscript`, and `browserSupportsSpeechRecognition` directly from the hook. The microphone is now explicitly started via a button click, aligning with modern browser privacy policies.

```jsx
import React, { useEffect } from 'react'
import SpeechRecognition, { useSpeechRecognition } from 'react-speech-recognition'

const Dictaphone = () => {
  const { transcript, resetTranscript, browserSupportsSpeechRecognition } = useSpeechRecognition()
  const startListening = () => SpeechRecognition.startListening({ continuous: true })

  if (!browserSupportsSpeechRecognition) {
    return null
  }

  return (
    <div>
      <button onClick={startListening}>Start</button>
      <button onClick={resetTranscript}>Reset</button>
      <p>{transcript}</p>
    </div>
  )
}
export default Dictaphone
```

--------------------------------

### Starting Speech Recognition with Custom Options

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Shows how to call `SpeechRecognition.startListening()` with an options object to configure behavior, such as enabling continuous listening or specifying a language.

```js
SpeechRecognition.startListening({
  continuous: true,
  language: 'zh-CN'
})
```

--------------------------------

### Install react-speech-recognition via npm

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This command installs the `react-speech-recognition` library as a dependency in your project, allowing you to use its React hooks and components for speech recognition.

```shell
npm install --save react-speech-recognition
```

--------------------------------

### Start Listening with React Speech Recognition

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This snippet demonstrates how to activate the microphone and begin listening for speech using `SpeechRecognition.startListening()`. This is an asynchronous function that affects the global microphone state across all components.

```js
SpeechRecognition.startListening()
```

--------------------------------

### Basic React component using useSpeechRecognition hook

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This example demonstrates a simple React component, `Dictaphone`, that utilizes the `useSpeechRecognition` hook to capture and display speech transcripts. It includes buttons to start, stop, and reset speech recognition, and checks for browser compatibility.

```jsx
import React from 'react';
import SpeechRecognition, { useSpeechRecognition } from 'react-speech-recognition';

const Dictaphone = () => {
  const {
    transcript,
    listening,
    resetTranscript,
    browserSupportsSpeechRecognition
  } = useSpeechRecognition();

  if (!browserSupportsSpeechRecognition) {
    return <span>Browser doesn't support speech recognition.</span>;
  }

  return (
    <div>
      <p>Microphone: {listening ? 'on' : 'off'}</p>
      <button onClick={SpeechRecognition.startListening}>Start</button>
      <button onClick={SpeechRecognition.stopListening}>Stop</button>
      <button onClick={resetTranscript}>Reset</button>
      <p>{transcript}</p>
    </div>
  );
};
export default Dictaphone;
```

--------------------------------

### Handling Unsupported Web Speech API in React

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Provides an example of how to check if the user's browser supports the Web Speech API and render fallback content if it does not, ensuring a graceful user experience.

```js
if (!browserSupportsSpeechRecognition) {
  // Render some fallback content
}
```

--------------------------------

### Configure Azure Speech Services Polyfill for React Speech Recognition

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This example demonstrates how to configure `react-speech-recognition` to use Azure Speech Services as a polyfill for broader browser compatibility. It involves installing necessary packages and applying the polyfill with Azure credentials to enable speech recognition functionality.

```jsx
import React from 'react';
import createSpeechServicesPonyfill from 'web-speech-cognitive-services';
import SpeechRecognition, { useSpeechRecognition } from 'react-speech-recognition';

const SUBSCRIPTION_KEY = '<INSERT_SUBSCRIPTION_KEY_HERE>';
const REGION = '<INSERT_REGION_HERE>';

const { SpeechRecognition: AzureSpeechRecognition } = createSpeechServicesPonyfill({
  credentials: {
    region: REGION,
    subscriptionKey: SUBSCRIPTION_KEY,
  }
});
SpeechRecognition.applyPolyfill(AzureSpeechRecognition);

const Dictaphone = () => {
  const {
    transcript,
    resetTranscript,
    browserSupportsSpeechRecognition
  } = useSpeechRecognition();

  const startListening = () => SpeechRecognition.startListening({
    continuous: true,
    language: 'en-US'
  });

  if (!browserSupportsSpeechRecognition) {
    return null;
  }

  return (
    <div>
      <button onClick={startListening}>Start</button>
      <button onClick={SpeechRecognition.abortListening}>Abort</button>
      <button onClick={resetTranscript}>Reset</button>
      <p>{transcript}</p>
    </div>
  );
};
export default Dictaphone;
```

--------------------------------

### Set Speech Recognition Language

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This example shows how to specify the language for speech recognition by passing a language tag to the `startListening` method. This allows the application to accurately recognize speech in a desired language, such as Chinese (`zh-CN`).

```js
SpeechRecognition.startListening({ language: 'zh-CN' })
```

--------------------------------

### Troubleshoot `regeneratorRuntime is not defined` Error

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This section provides solutions for the `regeneratorRuntime is not defined` error. It includes instructions for installing the `regenerator-runtime` package and importing it correctly into your application's entry file, depending on whether you are using NextJS or another framework.

```bash
npm i --save regenerator-runtime
```

```js
import 'regenerator-runtime/runtime'
```

--------------------------------

### Define Custom Voice Commands in React

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This example demonstrates how to define and use custom voice commands with `react-speech-recognition` within a React component. It showcases various command patterns, including wildcards, optional words, fuzzy matching, and a command to reset the transcript, allowing for flexible voice-controlled interactions.

```jsx
import React, { useState } from 'react'
import SpeechRecognition, { useSpeechRecognition } from 'react-speech-recognition'

const Dictaphone = () => {
  const [message, setMessage] = useState('')
  const commands = [
    {
      command: 'I would like to order *',
      callback: (food) => setMessage(`Your order is for: ${food}`)
    },
    {
      command: 'The weather is :condition today',
      callback: (condition) => setMessage(`Today, the weather is ${condition}`)
    },
    {
      command: 'My top sports are * and *',
      callback: (sport1, sport2) => setMessage(`#1: ${sport1}, #2: ${sport2}`)
    },
    {
      command: 'Pass the salt (please)',
      callback: () => setMessage('My pleasure')
    },
    {
      command: ['Hello', 'Hi'],
      callback: ({ command }) => setMessage(`Hi there! You said: "${command}"`),
      matchInterim: true
    },
    {
      command: 'Beijing',
      callback: (command, spokenPhrase, similarityRatio) => setMessage(`${command} and ${spokenPhrase} are ${similarityRatio * 100}% similar`),
      // If the spokenPhrase is "Benji", the message would be "Beijing and Benji are 40% similar"
      isFuzzyMatch: true,
      fuzzyMatchingThreshold: 0.2
    },
    {
      command: ['eat', 'sleep', 'leave'],
      callback: (command) => setMessage(`Best matching command: ${command}`),
      isFuzzyMatch: true,
      fuzzyMatchingThreshold: 0.2,
      bestMatchOnly: true
    },
    {
      command: 'clear',
      callback: ({ resetTranscript }) => resetTranscript()
    }
  ]

  const { transcript, browserSupportsSpeechRecognition } = useSpeechRecognition({ commands })

  if (!browserSupportsSpeechRecognition) {
    return null
  }

  return (
    <div>
      <p>{message}</p>
      <p>{transcript}</p>
    </div>
  )
}
export default Dictaphone
```

--------------------------------

### Handle Microphone Access Denial in JavaScript

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This example illustrates how to detect when a user denies microphone access using the `isMicrophoneAvailable` state. When access is denied, it's advised to disable voice-driven features and inform the user that microphone permission is required.

```js
if (!isMicrophoneAvailable) {
  // Render some fallback content
}
```

--------------------------------

### Get Underlying Web Speech API Recognition Object

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

This method provides direct access to the native SpeechRecognition object used by the Web Speech API. This can be useful for advanced interactions or debugging purposes.

```APIDOC
SpeechRecognition.getRecognition()
  Description: Returns the underlying Web Speech API SpeechRecognition object.
  Returns: Web Speech API SpeechRecognition object
```

--------------------------------

### Migrating React Speech Recognition: Dictaphone Example in v2

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

This snippet demonstrates the implementation of a Dictaphone component using `react-speech-recognition` v2. It utilizes a higher-order component (HOC) to inject speech recognition props like `transcript`, `resetTranscript`, and `browserSupportsSpeechRecognition` directly into the component. The component relies on `PropTypes` for prop validation.

```jsx
import React, { Component } from "react";
import PropTypes from "prop-types";
import SpeechRecognition from "react-speech-recognition";

const propTypes = {
  // Props injected by SpeechRecognition
  transcript: PropTypes.string,
  resetTranscript: PropTypes.func,
  browserSupportsSpeechRecognition: PropTypes.bool
};

const Dictaphone = ({
  transcript,
  resetTranscript,
  browserSupportsSpeechRecognition
}) => {
  if (!browserSupportsSpeechRecognition) {
    return null;
  }

  return (
    <div>
      <button onClick={resetTranscript}>Reset</button>
      <span>{transcript}</span>
    </div>
  );
};

Dictaphone.propTypes = propTypes;

export default SpeechRecognition(Dictaphone);
```

--------------------------------

### React Speech Recognition: Controlling Transcript Clearing with clearTranscriptOnListen in v3

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

The `clearTranscriptOnListen` prop is a new addition in v3, passed into the `useSpeechRecognition` hook. By default, it clears the component's transcript at the start of each new discontinuous speech segment. To replicate the v2 behavior where the transcript was not reset when `continuous` was `false`, this prop can be explicitly set to `false`.

```js
const { transcript } = useSpeechRecognition({ clearTranscriptOnListen: false })
```

--------------------------------

### API: SpeechRecognition.startListening Function

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

Documents the updated asynchronous function for initiating speech recognition. This function is now directly accessible as a method on the global `SpeechRecognition` object.

```APIDOC
SpeechRecognition.startListening(): Promise<void>
```

--------------------------------

### API Reference: SpeechRecognition Object

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Detailed API documentation for the `SpeechRecognition` global object, providing functions to manage the microphone's global state. Includes the `startListening` function and its available options (`continuous`, `language`).

```APIDOC
SpeechRecognition (Object)
  Description: Object providing functions to manage the global state of the microphone.
  Import: import SpeechRecognition from 'react-speech-recognition'

  Functions:
    startListening (async)
      Description: Start listening to speech. This is an asynchronous function.
      Parameters (options argument):
        continuous: bool (default: false)
          Description: By default, the microphone will stop listening when the user stops speaking. If true, the microphone will continue to listen, even after the user has stopped speaking.
        language: string
          Description: Specifies the language for speech recognition (e.g., 'zh-CN').
```

--------------------------------

### React Speech Recognition: Auto-starting Microphone with useEffect in v3

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

In v3, automatic microphone activation without user input is discouraged due to privacy concerns. However, for testing purposes, especially in browsers like Chrome that still permit it, you can use a `useEffect` hook to initiate listening when the component mounts. This approach affects global state and is recommended for use near the application's root.

```js
useEffect(() => {
  SpeechRecognition.startListening({ continuous: true })
}, []);
```

--------------------------------

### Secure Azure Speech Recognition Polyfill Configuration

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/POLYFILLS.md

This snippet illustrates the recommended secure approach for configuring the Azure Speech Services polyfill in a production environment. Instead of directly using a subscription key, an authorization token (obtained from a backend service) is passed to `createSpeechServicesPonyfill` to enhance security and prevent key exposure.

```js
const { SpeechRecognition: AzureSpeechRecognition } = createSpeechServicesPonyfill({
  credentials: {
    region: REGION,
    authorizationToken: AUTHORIZATION_TOKEN,
  }
});
```

--------------------------------

### Configure Speech Recognition Language

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

This snippet demonstrates how to specify a language for speech recognition by passing a language tag (e.g., 'zh-CN' for Chinese) to the startListening method. This allows the recognition engine to accurately process speech in the desired language.

```js
SpeechRecognition.startListening({ language: 'zh-CN' })
```

--------------------------------

### Importing SpeechRecognition Global Object

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Illustrates how to import the `SpeechRecognition` object, which provides global functions for managing the microphone's state, from the `react-speech-recognition` library.

```js
import SpeechRecognition from 'react-speech-recognition'
```

--------------------------------

### Importing useSpeechRecognition React Hook

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Demonstrates how to import the `useSpeechRecognition` hook from the `react-speech-recognition` library for use in React components.

```js
import { useSpeechRecognition } from 'react-speech-recognition'
```

--------------------------------

### useSpeechRecognition Hook Command Object API

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

Describes the properties of a command object used with the useSpeechRecognition hook, including command for matching phrases, callback for execution, and options for matchInterim, isFuzzyMatch, fuzzyMatchingThreshold, and bestMatchOnly. It also details the arguments passed to the callback function.

```APIDOC
Command Object Properties for useSpeechRecognition Hook:
  command: string | RegExp | Array<string | RegExp>
    description: The phrase(s) or regular expression(s) to listen for. An array allows a single callback for multiple commands.
  callback: function
    description: The function executed when the command is spoken.
    arguments:
      ...args: any[] (for splats/named variables)
      options: object
        command: string
          description: The specific command phrase that was matched.
        resetTranscript: function
          description: A function to set the transcript to an empty string.
    fuzzyMatchCallbackArguments (if isFuzzyMatch is true):
      arg1: string
        description: The value of 'command' (with any special characters removed).
      arg2: string
        description: The speech that matched 'command'.
      arg3: number
        description: The similarity score between 'command' and the speech.
      arg4: object
        description: The standard options object (command, resetTranscript).
  matchInterim: boolean
    description: Determines whether "interim" speech recognition results should be matched against the command. Default: false.
  isFuzzyMatch: boolean
    description: If true, the comparison between speech and 'command' is based on similarity rather than an exact match. Default: false.
  fuzzyMatchingThreshold: number (range: 0 to 1)
    description: The minimum similarity score required to trigger the callback when 'isFuzzyMatch' is true. Default: 0.8.
  bestMatchOnly: boolean
    description: When 'isFuzzyMatch' is true, if set to true, the callback is triggered only by the command phrase that best matches the speech. Default: false.
```

--------------------------------

### Applying a Custom Speech Recognition Polyfill

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/POLYFILLS.md

The `applyPolyfill` method of the `SpeechRecognition` class allows integrating a custom implementation of the W3C SpeechRecognition specification. This enables `react-speech-recognition` to function in browsers that lack native Web Speech API support. It's important to call this method early to ensure the polyfill is active before any listening operations begin.

```js
SpeechRecognition.applyPolyfill(SpeechRecognitionPolyfill)
```

--------------------------------

### Supported Language Codes for Speech Recognition

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

A comprehensive list of language tags supported by the SpeechRecognition API, including specific regional variations. These tags can be used with the `startListening` method to specify the desired language for speech input.

```APIDOC
Supported Language Tags:
- Afrikaans `af`
- Basque `eu`
- Bulgarian `bg`
- Catalan `ca`
- Arabic (Egypt) `ar-EG`
- Arabic (Jordan) `ar-JO`
- Arabic (Kuwait) `ar-KW`
- Arabic (Lebanon) `ar-LB`
- Arabic (Qatar) `ar-QA`
- Arabic (UAE) `ar-AE`
- Arabic (Morocco) `ar-MA`
- Arabic (Iraq) `ar-IQ`
- Arabic (Algeria) `ar-DZ`
- Arabic (Bahrain) `ar-BH`
- Arabic (Lybia) `ar-LY`
- Arabic (Oman) `ar-OM`
- Arabic (Saudi Arabia) `ar-SA`
- Arabic (Tunisia) `ar-TN`
- Arabic (Yemen) `ar-YE`
- Czech `cs`
- Dutch `nl-NL`
- English (Australia) `en-AU`
- English (Canada) `en-CA`
- English (India) `en-IN`
- English (New Zealand) `en-NZ`
- English (South Africa) `en-ZA`
- English(UK) `en-GB`
- English(US) `en-US`
- Finnish `fi`
- French `fr-FR`
- Galician `gl`
- German `de-DE`
- Greek `el-GR`
- Hebrew `he`
- Hungarian `hu`
- Icelandic `is`
- Italian `it-IT`
- Indonesian `id`
- Japanese `ja`
- Korean `ko`
- Latin `la`
- Mandarin Chinese `zh-CN`
- Taiwanese `zh-TW`
- Cantonese `zh-HK`
- Malaysian `ms-MY`
- Norwegian `no-NO`
- Polish `pl`
- Pig Latin `xx-piglatin`
- Portuguese `pt-PT`
- Portuguese (Brasil) `pt-br`
- Romanian `ro-RO`
- Russian `ru`
- Serbian `sr-SP`
- Slovak `sk`
- Spanish (Argentina) `es-AR`
- Spanish (Bolivia) `es-BO`
- Spanish (Chile) `es-CL`
- Spanish (Colombia) `es-CO`
- Spanish (Costa Rica) `es-CR`
- Spanish (Dominican Republic) `es-DO`
- Spanish (Ecuador) `es-EC`
- Spanish (El Salvador) `es-SV`
- Spanish (Guatemala) `es-GT`
- Spanish (Honduras) `es-HN`
- Spanish (Mexico) `es-MX`
- Spanish (Nicaragua) `es-NI`
- Spanish (Panama) `es-PA`
- Spanish (Paraguay) `es-PY`
- Spanish (Peru) `es-PE`
- Spanish (Puerto Rico) `es-PR`
- Spanish (Spain) `es-ES`
- Spanish (US) `es-US`
- Spanish (Uruguay) `es-UY`
- Spanish (Venezuela) `es-VE`
- Swedish `sv-SE`
- Turkish `tr`
- Zulu `zu`
```

--------------------------------

### API: useSpeechRecognition Hook State: interimTranscript

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

Documents the `interimTranscript` state variable, provided by the `useSpeechRecognition` hook. This string contains partial, evolving speech recognition results that are local to the component using the hook.

```APIDOC
const { interimTranscript } = useSpeechRecognition();
// interimTranscript: string
```

--------------------------------

### Special Symbols for Defining Speech Commands

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

Explains the special symbols supported within command strings to create more flexible and dynamic speech recognition patterns. This includes splats for multi-word matching, named variables for single-word capture, and parentheses for optional words.

```APIDOC
Supported Command Symbols:
  Splats (*):
    description: Matches multi-word text. The words matching the splat will be passed into the callback as separate arguments.
    example: 'I would like to order *'
  Named variables (:<name>):
    description: Matches a single word. The matched word will be passed into the callback as an argument.
    example: 'I am :height metres tall'
  Optional words ((phrase)):
    description: A phrase wrapped in parentheses is not required to match the command.
    example: 'Pass the salt (please)'
      Matches: 'Pass the salt'
      Matches: 'Pass the salt please'
```

--------------------------------

### API Reference: useSpeechRecognition Hook

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Detailed API documentation for the `useSpeechRecognition` React hook, including its input properties (`transcribing`, `clearTranscriptOnListen`, `commands`) and output state variables (`transcript`, `interimTranscript`, `finalTranscript`, `resetTranscript`, `listening`, `browserSupportsSpeechRecognition`, `isMicrophoneAvailable`, `browserSupportsContinuousListening`).

```APIDOC
useSpeechRecognition (React Hook)
  Description: React hook for consuming speech recorded by the microphone.
  Import: import { useSpeechRecognition } from 'react-speech-recognition'

  Input props (passed as object argument):
    transcribing: bool (default: true)
      Description: Is this component collecting a transcript or not? This is independent of the global listening state of the microphone.
    clearTranscriptOnListen: bool (default: true)
      Description: Does this component clear its transcript when the microphone is turned on? Has no effect when continuous listening is enabled.
    commands: list
      Description: See Commands documentation.

  Output state (returned from useSpeechRecognition):
    transcript: string
      Description: Transcription of all speech that has been spoken into the microphone. Is equivalent to the final transcript followed by the interim transcript, separated by a space.
    interimTranscript: string
      Description: Transcription of speech that the Web Speech API is still processing (i.e. it's still deciding what has just been spoken). For the current words being spoken, the interim transcript reflects each successive guess made by the transcription algorithm. When the browser’s confidence in its guess is maximized, it is added to the final transcript.
    finalTranscript: string
      Description: Transcription of speech that the Web Speech API has finished processing.
    resetTranscript: function
      Description: Sets transcript to an empty string.
    listening: bool
      Description: If true, the Web Speech API is listening to speech from the microphone.
    browserSupportsSpeechRecognition: bool
      Description: The Web Speech API is not supported on all browsers.
    browserSupportsContinuousListening: bool
      Description: Continuous listening is not supported on all browsers.
    isMicrophoneAvailable: bool
      Description: The user has to give permission for their microphone to be used before transcription can begin.
```

--------------------------------

### API: SpeechRecognition.abortListening Function

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

Documents the updated function for immediately aborting the speech recognition process without waiting for a final result. This method is now part of the `SpeechRecognition` object.

```APIDOC
SpeechRecognition.abortListening(): void
```

--------------------------------

### API: SpeechRecognition.browserSupportsSpeechRecognition Function

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

Documents the updated utility function to check if the user's browser supports the Web Speech API required for speech recognition. This function is now exposed directly on the `SpeechRecognition` object.

```APIDOC
SpeechRecognition.browserSupportsSpeechRecognition(): boolean
```

--------------------------------

### Passing Input Props to useSpeechRecognition Hook

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Illustrates the object argument structure for passing configuration properties like `transcribing`, `clearTranscriptOnListen`, and `commands` to the `useSpeechRecognition` hook.

```js
useSpeechRecognition({ transcribing, clearTranscriptOnListen, commands })
```

--------------------------------

### Handling Unavailable Microphone Access in React

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Shows how to detect if microphone access has been denied by the user and advises on disabling voice-driven features or prompting the user for permission.

```js
if (!isMicrophoneAvailable) {
  // Render some fallback content
}
```

--------------------------------

### Control Continuous Speech Listening

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

These snippets demonstrate how to manage continuous listening behavior. The first shows enabling continuous listening, while the second illustrates how to conditionally activate it based on browser support, ensuring a better user experience across different environments.

```js
SpeechRecognition.startListening({ continuous: true })
```

```js
if (browserSupportsContinuousListening) {
  SpeechRecognition.startListening({ continuous: true })
} else {
  // Fallback behaviour
}
```

--------------------------------

### API: useSpeechRecognition Hook State: listening

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

Documents the `listening` state variable, which is now returned by the `useSpeechRecognition` hook. This boolean state indicates whether the speech recognition service is currently active and listening for input.

```APIDOC
const { listening } = useSpeechRecognition();
// listening: boolean
```

--------------------------------

### Required Speech Recognition API Polyfill Interface

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/POLYFILLS.md

Specifies the minimum set of properties and methods that a custom Speech Recognition API implementation must expose to be compatible with `react-speech-recognition`. This interface is based on the W3C SpeechRecognition specification.

```APIDOC
SpeechRecognition (Polyfill Interface):
  Properties:
    continuous: boolean
    lang: string
    interimResults: boolean
    onresult: function(event: SpeechRecognitionEvent)
      event.resultIndex: number
      event.results[i].isFinal: boolean
      event.results[i][0].transcript: string
      event.results[i][0].confidence: number
    onend: function()
    onerror: function(event: SpeechRecognitionErrorEvent)
  Methods:
    start(): void
    stop(): void
    abort(): void
```

--------------------------------

### Handling Unsupported Continuous Listening in React

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Demonstrates how to check for `browserSupportsContinuousListening` and apply alternative behavior if continuous listening is not available, allowing for adaptive microphone control.

```js
if (browserSupportsContinuousListening) {
  SpeechRecognition.startListening({ continuous: true })
} else {
  // Fallback behaviour
}
```

--------------------------------

### Apply Speech Recognition Polyfill

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

This function replaces the native Speech Recognition engine with a custom polyfill implementation that adheres to the W3C SpeechRecognition specification. If a native implementation is currently active and listening, it will be turned off before the polyfill is applied.

```js
SpeechRecognition.applyPolyfill(SpeechRecognitionPolyfill)
```

--------------------------------

### Enabling Continuous Speech Recognition Listening

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Explains how to set the `continuous` option to `true` when calling `startListening` to keep the microphone active even after the user stops speaking, differing from the default 'press to talk' behavior.

```js
SpeechRecognition.startListening({ continuous: true })
```

--------------------------------

### API: SpeechRecognition.getRecognition Function

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

Documents the updated function to retrieve the underlying native Web Speech API `SpeechRecognition` object. This function is now available as a method on the global `SpeechRecognition` object.

```APIDOC
SpeechRecognition.getRecognition(): SpeechRecognition
```

--------------------------------

### API: SpeechRecognition.stopListening Function

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

Documents the updated function for gracefully stopping the ongoing speech recognition process. It is now available as a method on the `SpeechRecognition` object.

```APIDOC
SpeechRecognition.stopListening(): void
```

--------------------------------

### React Speech Recognition: Setting Continuous Listening in v3

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

The `continuous` option, which previously defaulted to permanent listening in v2, is now an explicit parameter passed to `SpeechRecognition.startListening` in v3. Its default value is `false`, aligning with common 'press to talk' usage patterns. Developers can override this default to enable continuous listening as needed.

```js
SpeechRecognition.startListening({ continuous: true })
```

--------------------------------

### Detect Browser Support for Web Speech API in JavaScript

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This snippet shows how to check if the user's browser supports the Web Speech API using `browserSupportsSpeechRecognition`. It is recommended to render fallback content if support is not detected, ensuring a graceful degradation of functionality.

```js
if (!browserSupportsSpeechRecognition) {
  // Render some fallback content
}
```

--------------------------------

### Import SpeechRecognition and useSpeechRecognition hook

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This JavaScript import statement brings the `SpeechRecognition` object and the `useSpeechRecognition` hook into your React component, making them available for use in your application.

```js
import SpeechRecognition, { useSpeechRecognition } from 'react-speech-recognition'
```

--------------------------------

### API: useSpeechRecognition Hook State: finalTranscript

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

Documents the `finalTranscript` state variable, returned by the `useSpeechRecognition` hook. This string holds the complete and finalized speech recognition result, local to the component using the hook.

```APIDOC
const { finalTranscript } = useSpeechRecognition();
// finalTranscript: string
```

--------------------------------

### Destructuring Output State from useSpeechRecognition Hook

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

Shows how to destructure the various state variables and functions returned by the `useSpeechRecognition` hook, including `transcript`, `resetTranscript`, and `listening`.

```js
  const {
    transcript,
    interimTranscript,
    finalTranscript,
    resetTranscript,
    listening,
    browserSupportsSpeechRecognition,
    isMicrophoneAvailable,
  } = useSpeechRecognition()
```

--------------------------------

### React Speech Recognition: Accessing Transcript in v3

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

In v3, the `transcript` is no longer an injected prop but is returned as local state by the `useSpeechRecognition` hook. This change ensures that each component consuming the hook maintains its own independent transcript, providing better isolation and control.

```APIDOC
transcript:
  Type: string
  Description: Local state returned by `useSpeechRecognition` hook. This transcript is local to the component using the hook.
```

--------------------------------

### Remove Speech Recognition Polyfill

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

If a custom polyfill was previously applied using `applyPolyfill`, this function resets the Speech Recognition engine back to its native implementation. This is particularly useful when switching to languages that are better supported by the native engine than the polyfill.

```js
SpeechRecognition.removePolyfill()
```

--------------------------------

### Abort Listening and Cancel Speech Processing with React Speech Recognition

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This snippet demonstrates how to immediately turn off the microphone and cancel any ongoing speech processing. Use `SpeechRecognition.abortListening()` to stop listening and discard current speech input.

```js
SpeechRecognition.abortListening()
```

--------------------------------

### Stop Listening and Process Speech with React Speech Recognition

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This snippet shows how to turn off the microphone while allowing any in-progress speech to be fully processed. Use `SpeechRecognition.stopListening()` to gracefully end the listening session.

```js
SpeechRecognition.stopListening()
```

--------------------------------

### Access Microphone Transcript in React Component

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This snippet illustrates how to retrieve the current microphone transcript within a React component. By destructuring `transcript` from `useSpeechRecognition()`, the spoken text becomes available for display or further processing.

```js
const { transcript } = useSpeechRecognition()
```

--------------------------------

### Abort Speech Recognition Listening

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

This asynchronous function immediately turns off the microphone and cancels the processing of any speech that is currently in progress. It should be awaited if subsequent actions depend on the microphone being off and processing being cancelled.

```js
SpeechRecognition.abortListening()
```

--------------------------------

### React Speech Recognition: Resetting Transcript in v3

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/V3-MIGRATION.md

Similar to `transcript`, `resetTranscript` is now a function returned by the `useSpeechRecognition` hook in v3. This function is designed to reset only the component's local transcript, ensuring that it does not affect any global speech recognition state.

```APIDOC
resetTranscript:
  Type: function
  Description: Function returned by `useSpeechRecognition` hook. This only resets the component's transcript, not any global state.
```

--------------------------------

### Stop Speech Recognition Listening

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/API.md

This asynchronous function turns off the microphone but allows any speech currently in progress to finish processing. It should be awaited if subsequent actions depend on the microphone being off.

```js
SpeechRecognition.stopListening()
```

--------------------------------

### Removing an Active Speech Recognition Polyfill

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/docs/POLYFILLS.md

The `removePolyfill` method can be used to disable an active speech recognition polyfill. This is particularly useful when switching to a language or scenario where the native browser's speech recognition engine is preferred or supported, but the polyfill engine is not.

```js
SpeechRecognition.removePolyfill()
```

--------------------------------

### Reset Microphone Transcript in React Component

Source: https://github.com/jamesbrill/react-speech-recognition/blob/master/README.md

This snippet shows how to clear the microphone transcript, setting it back to an empty string. The `resetTranscript` function, provided by `useSpeechRecognition`, only affects the transcript local to the current component.

```js
const { resetTranscript } = useSpeechRecognition()
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.