Package Exports

@venkatesh966/speech-text
@venkatesh966/speech-text/dist/speech-text.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@venkatesh966/speech-text) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

React Audio-Assistant With OpenAI GPT Integration

A React component seamlessly integrating audio-assistant functionality via the Web Speech API and OpenAI GPT. Users can interact naturally with the application through spoken commands, receiving responses as audio.

Installation

Install the module using npm:

npm install @venkatesh966/speech-text

Example Usage

import React from 'react';
import { SpeechText } from '@venkatesh966/speech-text';

const YourComponent = () => {
  const YOUR_OPENAI_API_KEY = 'your_openai_api_key';

  return (
    <div>
      <h1>Your React Component</h1>
      <SpeechText
        apiKey={YOUR_OPENAI_API_KEY}
        containerStyling={{
          position: 'relative',
        }}
        buttonStyle={{
          background: 'green'
        }}
        heading={"MyAPP"}
        showReqText={true}
        showResponseText={true}
        showRecordStatus={true}
      />
    </div>
  );
};

export default YourComponent;

Features

Provides a simple React component (SpeechText) for integrating audio-assistant functionality.
Utilizes the Web Speech API for speech recognition.
Integrates with OpenAI GPT for text generation based on the user's speech input.
Allows flexible customization through props:
- apiKey: Your OpenAI API key.
- containerStyling: CSS styling for the component container.
- showResponseText: Boolean to control whether to display the generated text.
- showRecordStatus: Boolean to control whether to display recording status.
- heading: Text to display as the heading.
- buttonStyle: CSS styling for the recording button.
- showReqText: Boolean to control whether to display the text being spoken.

Configuration

API_KEY: Obtain your OpenAI API key by signing up on the OpenAI platform. Pass the API key as a prop to the SpeechText component.

❤️ Contributions

Open source is built by the community for the community. All contributions to this project are welcome! Additionally, if you have any suggestions for enhancements, ideas on how to take the package further, or have discovered a bug, do not hesitate to create a new issue ticket and I will look into it as soon as possible!