sarvam-convai-embed 1.0.0
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.
- package/README.md +131 -0
- package/index.js +74589 -0
- package/package.json +64 -0
package/README.md
ADDED
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
# Sarvam Conversational AI Embed Widget
|
|
2
|
+
|
|
3
|
+
A web component for embedding Sarvam AI chat and voice call agents into any website.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
### Via npm
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
npm install sarvam-convai-embed
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
### Via unpkg CDN
|
|
14
|
+
|
|
15
|
+
```html
|
|
16
|
+
<script src="https://unpkg.com/sarvam-convai-embed" defer></script>
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
Or specify a version:
|
|
20
|
+
|
|
21
|
+
```html
|
|
22
|
+
<script src="https://unpkg.com/sarvam-convai-embed@1.0.0" defer></script>
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
## Usage
|
|
26
|
+
|
|
27
|
+
### Web Component (Recommended)
|
|
28
|
+
|
|
29
|
+
After including the script, use the `<sarvam-widget>` custom element:
|
|
30
|
+
|
|
31
|
+
```html
|
|
32
|
+
<!DOCTYPE html>
|
|
33
|
+
<html>
|
|
34
|
+
<head>
|
|
35
|
+
<script src="https://unpkg.com/sarvam-convai-embed@latest/index.js" defer></script>
|
|
36
|
+
</head>
|
|
37
|
+
<body>
|
|
38
|
+
<sarvam-widget
|
|
39
|
+
api-key="your-api-key"
|
|
40
|
+
app-id="your-app-id"
|
|
41
|
+
org-id="your-org-id"
|
|
42
|
+
workspace-id="your-workspace-id"
|
|
43
|
+
user-id="optional-user-id"
|
|
44
|
+
interaction-type="chat"
|
|
45
|
+
button-text="Chat with us"
|
|
46
|
+
position="bottom-right"
|
|
47
|
+
></sarvam-widget>
|
|
48
|
+
</body>
|
|
49
|
+
</html>
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
### Attributes
|
|
53
|
+
|
|
54
|
+
#### Required Attributes
|
|
55
|
+
- `api-key` - Your Sarvam API key
|
|
56
|
+
- `app-id` - Your application ID
|
|
57
|
+
- `org-id` - Your organization ID
|
|
58
|
+
- `workspace-id` - Your workspace ID
|
|
59
|
+
|
|
60
|
+
#### Optional Attributes
|
|
61
|
+
- `user-id` - User identifier for the session
|
|
62
|
+
- `interaction-type` - Type of interaction: `"chat"` or `"call"` (default: `"chat"`)
|
|
63
|
+
- `version` - Specific version of the agent to use
|
|
64
|
+
- `button-text` - Text displayed on the widget button (default: "Chat with us")
|
|
65
|
+
- `title` - Title displayed in the widget
|
|
66
|
+
- `background-color` - Background color (hex code)
|
|
67
|
+
- `foreground-color` - Foreground/text color (hex code)
|
|
68
|
+
- `accent-color` - Accent color for highlights (hex code)
|
|
69
|
+
- `logo-url` - URL to your logo image
|
|
70
|
+
- `position` - Widget position: `"bottom-right"`, `"bottom-left"`, `"top-right"`, `"top-left"` (default: `"bottom-right"`)
|
|
71
|
+
|
|
72
|
+
### Programmatic Usage
|
|
73
|
+
|
|
74
|
+
You can also set attributes programmatically:
|
|
75
|
+
|
|
76
|
+
```javascript
|
|
77
|
+
const widget = document.querySelector('sarvam-widget');
|
|
78
|
+
widget.apiKey = 'your-api-key';
|
|
79
|
+
widget.appId = 'your-app-id';
|
|
80
|
+
widget.orgId = 'your-org-id';
|
|
81
|
+
widget.workspaceId = 'your-workspace-id';
|
|
82
|
+
widget.interactionType = 'chat';
|
|
83
|
+
widget.position = 'bottom-right';
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
## Development
|
|
87
|
+
|
|
88
|
+
This package includes a Next.js development app for testing the widget locally.
|
|
89
|
+
|
|
90
|
+
### Getting Started
|
|
91
|
+
|
|
92
|
+
First, install the dependencies:
|
|
93
|
+
|
|
94
|
+
```bash
|
|
95
|
+
npm install
|
|
96
|
+
```
|
|
97
|
+
|
|
98
|
+
Then, run the development server:
|
|
99
|
+
|
|
100
|
+
```bash
|
|
101
|
+
npm run dev
|
|
102
|
+
```
|
|
103
|
+
|
|
104
|
+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
|
105
|
+
|
|
106
|
+
### Building the Widget
|
|
107
|
+
|
|
108
|
+
To build the widget for production:
|
|
109
|
+
|
|
110
|
+
```bash
|
|
111
|
+
npm run build:widget
|
|
112
|
+
```
|
|
113
|
+
|
|
114
|
+
This will create `index.js` in the root directory, which is the file published to npm.
|
|
115
|
+
|
|
116
|
+
### Publishing to npm
|
|
117
|
+
|
|
118
|
+
1. Update the version in `package.json`
|
|
119
|
+
2. Build the widget: `npm run build:widget`
|
|
120
|
+
3. Publish: `npm publish`
|
|
121
|
+
|
|
122
|
+
## Project Structure
|
|
123
|
+
|
|
124
|
+
- `/components/embed` - Widget source code
|
|
125
|
+
- `/app` - Next.js development app
|
|
126
|
+
- `index.js` - Built widget file (generated)
|
|
127
|
+
- `rollup.config.js` - Build configuration
|
|
128
|
+
|
|
129
|
+
## License
|
|
130
|
+
|
|
131
|
+
MIT
|