# react-voice-input

> react voice input

Latest version **0.0.4** (published 2017-04-11) · MIT license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install react-voice-input
pnpm add react-voice-input
yarn add react-voice-input
bun add react-voice-input
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 0.0.4 |
| Published | 2017-04-11 |
| First published | 2017-04-11 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | npm@envato.com |
| Maintainers | envato |

## Links

- npm: https://www.npmjs.com/package/react-voice-input
- Repository: https://github.com/envato/react-voice-input
- Homepage: https://github.com/envato/react-voice-input#readme
- Issues: https://github.com/envato/react-voice-input/issues
- npm.io page: https://npm.io/package/react-voice-input

## Recent versions

- 0.0.4 (latest) — 2017-04-11
- 0.0.3 — 2017-04-11
- 0.0.2 — 2017-04-11
- 0.0.1 — 2017-04-11

## README

# react-voice-input
Voice input component for React.JS

### Installation

```sh
$ npm install react-voice-input
```

### Usage

```js
import ReactVoiceInput from 'react-voice-input'
import React from 'react'

class MyApp extends React.Component {
  constructor (props) {
    super(props)
    this.state = {
      inputText: ''
    }

    this.onResult = this.onResult.bind(this)
    this.onInputChange = this.onInputChange.bind(this)
  }

  onInputChange (event) {
    this.setState({
      inputText: event.target.value
    })
  }

  onResult (result) {
    this.setState({
      inputText: result
    })
  }

  render () {
    const onEnd = () => {
      console.log('on end')
    }
    return (
      <main>
        <ReactVoiceInput
          onResult={this.onResult}
          onEnd={onEnd}
        >
          <input type='text' value={inputText} onChange={this.onInputChange} />
        </ReactVoiceInput>
      </main>
    )
  }
}
```

### API
* `onSpeechStart()` - optional callback function to detect speech start
* `onResult(value)` - callback function when get value from speech
* `onEnd()` - optional callback function when the speech end
* `onError(event)` - optional callback function when there's an error
* `containerClassName` - optional, the class name apply to the container, default to `rvi-contianer`
* `microphoneClassName` - optional, the class name apply to microphone, default to `rvi-microphone`
* `microphoneStyle` - optional inline style for the button

For how to use it, check the `example` folder.

### Run example

```sh
$ cd example
$ yarn
$ yarn run dev
```

Then go to http://localhost:3000/ in browser.

### License

MIT

---
_Source: https://npm.io/package/react-voice-input · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._