I’m excited to announce that Dictate Button now has a React integration lib!

For React developers, integrating voice input into your applications just got a whole lot easier. The new @dictate-button/react package brings plug-and-play text field components (<DictateInput /> and <DictateTextarea />) with voice input button already built-in.

No DOM scanning. No direct DOM mutations. No inject scripts.

Just install it like any other UI component library:

pnpm add @dictate-button/react

and use:

import { DictateInput, DictateTextarea, DictateButton } from '@dictate-button/react';

function MyForm() {
  return (
    <div>
      <DictateInput
        type="text"
        placeholder="Start typing or click the mic..."
        className="your-input-class"
      />

      <DictateTextarea
        rows={5}
        placeholder="Or speak here..."
        className="your-textarea-class"
      />

      <DictateButton
        onDictateEnd={(text) => console.log('Transcribed:', text)}
      />
    </div>
  );
}

If you need more examples, here they are.

As always, any feedback is appreciated at support@dictate-button.io.

Happy integrating!
Kos