@humeai/voice-embed 0.0.0-beta.22 → 0.0.0-beta.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +82 -0
  2. package/package.json +4 -4
package/README.md ADDED
@@ -0,0 +1,82 @@
1
+ <div align="center">
2
+ <img src="https://storage.googleapis.com/hume-public-logos/hume/hume-banner.png">
3
+ <h1>Hume AI Voice Embed SDK</h1>
4
+ <p>
5
+ <strong>Integrate Hume's Empathic Voice Interface directly into your web application</strong>
6
+ </p>
7
+ </div>
8
+
9
+ ## Overview
10
+
11
+ This package enables you to integrate a widget that runs Hume's Empathic Voice Interface any Javascript application. It abstracts away the complexities of managing websocket connections, capturing user audio via the client's microphone, and handling the playback of the interface's audio responses. The widget is embedded into your web page through an iframe.
12
+
13
+ There are two packages needed to embed your own widget. Install this package to embed the widget to your application. Code for the widget itself can be found at [https://github.com/HumeAI/empathic-voice-embed-renderer](https://github.com/HumeAI/empathic-voice-embed-renderer).
14
+
15
+ ## Prerequisites
16
+
17
+ Before installing this package, please ensure your development environment meets the following requirement:
18
+
19
+ - Node.js (`v18.0.0` or higher).
20
+
21
+ To verify your Node.js version, run this command in your terminal:
22
+
23
+ ```sh
24
+ node --version
25
+ ```
26
+
27
+ If your Node.js version is below `18.0.0`, update it to meet the requirement. For updating Node.js, visit [Node.js' official site](https://nodejs.org/) or use a version management tool like nvm for a more seamless upgrade process.
28
+
29
+ ## Installation
30
+
31
+ Add `@humeai/voice-embed` to your project by running this command in your project directory:
32
+
33
+ ```bash
34
+ npm install @humeai/voice-embed
35
+ ```
36
+
37
+ This will download and include the package in your project, making it ready for import and use within your React components.
38
+
39
+ ```tsx
40
+ import { EmbeddedVoice } from '@humeai/voice-embed';
41
+ ```
42
+
43
+ __NOTE:__ If you are building a React application, you can use our React voice embed SDK instead of this one. [Documentation can be found here](https://github.com/HumeAI/empathic-voice-api-js/blob/main/packages/embed-react).
44
+
45
+ ## Usage
46
+
47
+ ### Quickstart
48
+
49
+ Here's a simple example to get you started with the `EmbeddedVoice` component:
50
+
51
+ ```tsx
52
+ import {
53
+ type CloseHandler,
54
+ EmbeddedVoice as EA,
55
+ type EmbeddedVoiceConfig,
56
+ type TranscriptMessageHandler,
57
+ } from '@humeai/voice-embed';
58
+
59
+ const embeddedVoice = EA.create({
60
+ // Configuration options
61
+ });
62
+ ```
63
+
64
+ **Note:** For integration within server components, instantiate `EmbeddedVoice` within a client component. For more information checkout the [Next.js documentation on client components](https://nextjs.org/docs/app/building-your-application/rendering/client-components).
65
+
66
+ ### Configuration options
67
+
68
+ Configuration options for the embedded voice include all props that are accepted by the VoiceProvider in the [@humeai/voice-react package](https://github.com/HumeAI/empathic-voice-api-js/blob/main/packages/react).
69
+
70
+ In addition, it accepts a few other configurations specific to creating a widget:
71
+
72
+ | Option | Required | Description |
73
+ | ----------------- | -------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
74
+ | `isEmbedOpen` | yes | Determines the initial visibility of the widget. Assign `true` to render the widget as open on initial load, and `false` to start with the widget closed. While the widget's UI provides a trigger to toggle its visibility, this prop also enables external control over the widget's visibility state through a parent component. |
75
+ | rendererUrl | no | URL where the widget itself is hosted. If blank, this defaults the Hume AI widget, https://voice-widget.hume.ai. An example of this widget can be found at [http://hume.ai](http://hume.ai). |
76
+ | `onMessage` | no | Callback function to invoke upon receiving a message through the web socket. |
77
+ | `onClose` | no | Callback function to invoke upon the web socket connection being closed. |
78
+ | `openOnMount` | no | Boolean which indicates whether the widget should be initialized in an open or closed state. Set as `true` if you want it to be open. The default value is `false`. |
79
+
80
+ ## Support
81
+
82
+ If you have questions or require assistance pertaining to this package, [reach out to us on Discord](https://hume.ai/discord)!
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@humeai/voice-embed",
3
- "version": "0.0.0-beta.22",
3
+ "version": "0.0.0-beta.23",
4
4
  "description": "",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",
@@ -23,12 +23,12 @@
23
23
  "tsup": "^8.0.2",
24
24
  "typescript": "^5.4.3",
25
25
  "vitest": "^1.4.0",
26
- "@humeai/typescript-config": "0.0.0",
27
- "@humeai/eslint-config": "0.0.1"
26
+ "@humeai/eslint-config": "0.0.1",
27
+ "@humeai/typescript-config": "0.0.0"
28
28
  },
29
29
  "dependencies": {
30
30
  "zod": "^3.22.4",
31
- "@humeai/voice": "0.0.0-beta.22"
31
+ "@humeai/voice": "0.0.0-beta.23"
32
32
  },
33
33
  "browserslist": [
34
34
  "last 2 Chrome versions, last 2 iOS major versions, Firefox ESR, not dead"