@speechly/react-ui
TypeScript icon, indicating that this package has built-in type declarations

2.7.5 • Public • Published

speechly-logo-duo-black

Website  ·  Docs  ·  Support  ·  Blog  ·  Login


Speechly React UI Components

build npm license

Ready-made UI components for building reactive voice interface using React and Speechly.

🚧 This project is no longer actively maintained and is looking for a maintainer. If you're interested, get in touch https://www.speechly.com/contact

image

Documentation

Getting started

You'll need a Speechly account and a Speechly application that's using a Conformer model. Follow our quick start guide to get started with Speechly.

Installing

Install Speechly React Client and Speechly React UI Components:

npm install @speechly/react-client
npm install @speechly/react-ui

Import SpeechProvider and wrap the app with it, passing the App ID of your Speechly application:

// index.js
import { SpeechProvider } from '@speechly/react-client';

<React.StrictMode>
  <SpeechProvider appId="YOUR_APP_ID">
    <App />
  </SpeechProvider>
</React.StrictMode>

Usage

Import the required UI components and take them into use:

// App.js
import {
  PushToTalkButton,
  BigTranscript,
  IntroPopup
} from "@speechly/react-ui";

function App() {
  return (
    <div className="App">
      <BigTranscript placement="top" />
      <PushToTalkButton placement="bottom" captureKey=" " />
      <IntroPopup />
    </div>
  );
}

Start the development server:

npm run start

Navigate to http://localhost:3000 to see your app running!

Contributing

See contribution guide in CONTRIBUTING.md.

Readme

Keywords

none

Package Sidebar

Install

npm i @speechly/react-ui

Weekly Downloads

130

Version

2.7.5

License

MIT

Unpacked Size

129 kB

Total Files

48

Last publish

Collaborators

  • aukkonen
  • thisismatu
  • speechlynpm
  • langma
  • hheikinh