@convai/web-sdk 0.1.1-beta.3 → 0.1.1-beta.5
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 +41 -2
- package/dist/core/AudioManager.d.ts +9 -1
- package/dist/core/AudioManager.d.ts.map +1 -1
- package/dist/core/AudioManager.js +44 -6
- package/dist/core/AudioManager.js.map +1 -1
- package/dist/core/ConvaiClient.d.ts +18 -9
- package/dist/core/ConvaiClient.d.ts.map +1 -1
- package/dist/core/ConvaiClient.js +75 -49
- package/dist/core/ConvaiClient.js.map +1 -1
- package/dist/core/MessageHandler.d.ts.map +1 -1
- package/dist/core/MessageHandler.js +26 -24
- package/dist/core/MessageHandler.js.map +1 -1
- package/dist/react/components/ConvaiWidget.d.ts.map +1 -1
- package/dist/react/components/ConvaiWidget.js +5 -10
- package/dist/react/components/ConvaiWidget.js.map +1 -1
- package/dist/react/hooks/useConvaiClient.d.ts.map +1 -1
- package/dist/react/hooks/useConvaiClient.js +12 -9
- package/dist/react/hooks/useConvaiClient.js.map +1 -1
- package/dist/types/index.d.ts +1 -3
- package/dist/types/index.d.ts.map +1 -1
- package/dist/vanilla/AudioRenderer.d.ts +45 -0
- package/dist/vanilla/AudioRenderer.d.ts.map +1 -0
- package/dist/vanilla/AudioRenderer.js +126 -0
- package/dist/vanilla/AudioRenderer.js.map +1 -0
- package/dist/vanilla/ConvaiWidget.d.ts +39 -0
- package/dist/vanilla/ConvaiWidget.d.ts.map +1 -0
- package/dist/vanilla/ConvaiWidget.js +1577 -0
- package/dist/vanilla/ConvaiWidget.js.map +1 -0
- package/dist/vanilla/icons.d.ts +34 -0
- package/dist/vanilla/icons.d.ts.map +1 -0
- package/dist/vanilla/icons.js +215 -0
- package/dist/vanilla/icons.js.map +1 -0
- package/dist/vanilla/index.d.ts +37 -0
- package/dist/vanilla/index.d.ts.map +1 -0
- package/dist/vanilla/index.js +39 -0
- package/dist/vanilla/index.js.map +1 -0
- package/dist/{components/rtc-widget/styles/theme.d.ts → vanilla/styles.d.ts} +14 -50
- package/dist/vanilla/styles.d.ts.map +1 -0
- package/dist/vanilla/styles.js +287 -0
- package/dist/vanilla/styles.js.map +1 -0
- package/dist/vanilla/types.d.ts +38 -0
- package/dist/vanilla/types.d.ts.map +1 -0
- package/dist/vanilla/types.js +2 -0
- package/dist/vanilla/types.js.map +1 -0
- package/package.json +12 -5
- package/dist/components/ConvaiWidget.d.ts +0 -59
- package/dist/components/ConvaiWidget.d.ts.map +0 -1
- package/dist/components/ConvaiWidget.js +0 -421
- package/dist/components/ConvaiWidget.js.map +0 -1
- package/dist/components/index.d.ts +0 -3
- package/dist/components/index.d.ts.map +0 -1
- package/dist/components/index.js +0 -5
- package/dist/components/index.js.map +0 -1
- package/dist/components/rtc-widget/components/AudioSettingsPanel.d.ts +0 -10
- package/dist/components/rtc-widget/components/AudioSettingsPanel.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/AudioSettingsPanel.js +0 -316
- package/dist/components/rtc-widget/components/AudioSettingsPanel.js.map +0 -1
- package/dist/components/rtc-widget/components/ConviMessage.d.ts +0 -10
- package/dist/components/rtc-widget/components/ConviMessage.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/ConviMessage.js +0 -14
- package/dist/components/rtc-widget/components/ConviMessage.js.map +0 -1
- package/dist/components/rtc-widget/components/FloatingVideo.d.ts +0 -9
- package/dist/components/rtc-widget/components/FloatingVideo.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/FloatingVideo.js +0 -122
- package/dist/components/rtc-widget/components/FloatingVideo.js.map +0 -1
- package/dist/components/rtc-widget/components/MarkdownRenderer.d.ts +0 -7
- package/dist/components/rtc-widget/components/MarkdownRenderer.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/MarkdownRenderer.js +0 -68
- package/dist/components/rtc-widget/components/MarkdownRenderer.js.map +0 -1
- package/dist/components/rtc-widget/components/MessageBubble.d.ts +0 -10
- package/dist/components/rtc-widget/components/MessageBubble.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/MessageBubble.js +0 -23
- package/dist/components/rtc-widget/components/MessageBubble.js.map +0 -1
- package/dist/components/rtc-widget/components/MessageList.d.ts +0 -11
- package/dist/components/rtc-widget/components/MessageList.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/MessageList.js +0 -89
- package/dist/components/rtc-widget/components/MessageList.js.map +0 -1
- package/dist/components/rtc-widget/components/UserMessage.d.ts +0 -9
- package/dist/components/rtc-widget/components/UserMessage.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/UserMessage.js +0 -15
- package/dist/components/rtc-widget/components/UserMessage.js.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/ConviButton.d.ts +0 -6
- package/dist/components/rtc-widget/components/conviComponents/ConviButton.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/ConviButton.js +0 -15
- package/dist/components/rtc-widget/components/conviComponents/ConviButton.js.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/ConviFooter.d.ts +0 -25
- package/dist/components/rtc-widget/components/conviComponents/ConviFooter.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/ConviFooter.js +0 -172
- package/dist/components/rtc-widget/components/conviComponents/ConviFooter.js.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/ConviHeader.d.ts +0 -17
- package/dist/components/rtc-widget/components/conviComponents/ConviHeader.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/ConviHeader.js +0 -66
- package/dist/components/rtc-widget/components/conviComponents/ConviHeader.js.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/SettingsTray.d.ts +0 -12
- package/dist/components/rtc-widget/components/conviComponents/SettingsTray.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/SettingsTray.js +0 -68
- package/dist/components/rtc-widget/components/conviComponents/SettingsTray.js.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/VoiceModeOverlay.d.ts +0 -8
- package/dist/components/rtc-widget/components/conviComponents/VoiceModeOverlay.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/VoiceModeOverlay.js +0 -199
- package/dist/components/rtc-widget/components/conviComponents/VoiceModeOverlay.js.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/index.d.ts +0 -6
- package/dist/components/rtc-widget/components/conviComponents/index.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/conviComponents/index.js +0 -6
- package/dist/components/rtc-widget/components/conviComponents/index.js.map +0 -1
- package/dist/components/rtc-widget/components/index.d.ts +0 -8
- package/dist/components/rtc-widget/components/index.d.ts.map +0 -1
- package/dist/components/rtc-widget/components/index.js +0 -13
- package/dist/components/rtc-widget/components/index.js.map +0 -1
- package/dist/components/rtc-widget/index.d.ts +0 -6
- package/dist/components/rtc-widget/index.d.ts.map +0 -1
- package/dist/components/rtc-widget/index.js +0 -9
- package/dist/components/rtc-widget/index.js.map +0 -1
- package/dist/components/rtc-widget/styles/framerConfig.d.ts +0 -116
- package/dist/components/rtc-widget/styles/framerConfig.d.ts.map +0 -1
- package/dist/components/rtc-widget/styles/framerConfig.js +0 -73
- package/dist/components/rtc-widget/styles/framerConfig.js.map +0 -1
- package/dist/components/rtc-widget/styles/icons.d.ts +0 -28
- package/dist/components/rtc-widget/styles/icons.d.ts.map +0 -1
- package/dist/components/rtc-widget/styles/icons.js +0 -257
- package/dist/components/rtc-widget/styles/icons.js.map +0 -1
- package/dist/components/rtc-widget/styles/index.d.ts +0 -6
- package/dist/components/rtc-widget/styles/index.d.ts.map +0 -1
- package/dist/components/rtc-widget/styles/index.js +0 -9
- package/dist/components/rtc-widget/styles/index.js.map +0 -1
- package/dist/components/rtc-widget/styles/styledComponents.d.ts +0 -90
- package/dist/components/rtc-widget/styles/styledComponents.d.ts.map +0 -1
- package/dist/components/rtc-widget/styles/styledComponents.js +0 -661
- package/dist/components/rtc-widget/styles/styledComponents.js.map +0 -1
- package/dist/components/rtc-widget/styles/theme.d.ts.map +0 -1
- package/dist/components/rtc-widget/styles/theme.js +0 -290
- package/dist/components/rtc-widget/styles/theme.js.map +0 -1
- package/dist/components/rtc-widget/types/index.d.ts +0 -60
- package/dist/components/rtc-widget/types/index.d.ts.map +0 -1
- package/dist/components/rtc-widget/types/index.js +0 -2
- package/dist/components/rtc-widget/types/index.js.map +0 -1
- package/dist/hooks/index.d.ts +0 -13
- package/dist/hooks/index.d.ts.map +0 -1
- package/dist/hooks/index.js +0 -14
- package/dist/hooks/index.js.map +0 -1
- package/dist/hooks/useAudioControls.d.ts +0 -41
- package/dist/hooks/useAudioControls.d.ts.map +0 -1
- package/dist/hooks/useAudioControls.js +0 -208
- package/dist/hooks/useAudioControls.js.map +0 -1
- package/dist/hooks/useCharacterInfo.d.ts +0 -17
- package/dist/hooks/useCharacterInfo.d.ts.map +0 -1
- package/dist/hooks/useCharacterInfo.js +0 -60
- package/dist/hooks/useCharacterInfo.js.map +0 -1
- package/dist/hooks/useConvaiClient.d.ts +0 -30
- package/dist/hooks/useConvaiClient.d.ts.map +0 -1
- package/dist/hooks/useConvaiClient.js +0 -349
- package/dist/hooks/useConvaiClient.js.map +0 -1
- package/dist/hooks/useDynamicInfoUpdater.d.ts +0 -33
- package/dist/hooks/useDynamicInfoUpdater.d.ts.map +0 -1
- package/dist/hooks/useDynamicInfoUpdater.js +0 -49
- package/dist/hooks/useDynamicInfoUpdater.js.map +0 -1
- package/dist/hooks/useLocalCameraTrack.d.ts +0 -22
- package/dist/hooks/useLocalCameraTrack.d.ts.map +0 -1
- package/dist/hooks/useLocalCameraTrack.js +0 -34
- package/dist/hooks/useLocalCameraTrack.js.map +0 -1
- package/dist/hooks/useMessageHandler.d.ts +0 -28
- package/dist/hooks/useMessageHandler.d.ts.map +0 -1
- package/dist/hooks/useMessageHandler.js +0 -267
- package/dist/hooks/useMessageHandler.js.map +0 -1
- package/dist/hooks/useScreenShare.d.ts +0 -45
- package/dist/hooks/useScreenShare.d.ts.map +0 -1
- package/dist/hooks/useScreenShare.js +0 -186
- package/dist/hooks/useScreenShare.js.map +0 -1
- package/dist/hooks/useTemplateKeysUpdater.d.ts +0 -35
- package/dist/hooks/useTemplateKeysUpdater.d.ts.map +0 -1
- package/dist/hooks/useTemplateKeysUpdater.js +0 -51
- package/dist/hooks/useTemplateKeysUpdater.js.map +0 -1
- package/dist/hooks/useTriggerMessageSender.d.ts +0 -28
- package/dist/hooks/useTriggerMessageSender.d.ts.map +0 -1
- package/dist/hooks/useTriggerMessageSender.js +0 -46
- package/dist/hooks/useTriggerMessageSender.js.map +0 -1
- package/dist/hooks/useTtsToggle.d.ts +0 -37
- package/dist/hooks/useTtsToggle.d.ts.map +0 -1
- package/dist/hooks/useTtsToggle.js +0 -63
- package/dist/hooks/useTtsToggle.js.map +0 -1
- package/dist/hooks/useUserTextMessageSender.d.ts +0 -28
- package/dist/hooks/useUserTextMessageSender.d.ts.map +0 -1
- package/dist/hooks/useUserTextMessageSender.js +0 -58
- package/dist/hooks/useUserTextMessageSender.js.map +0 -1
- package/dist/hooks/useVideoControls.d.ts +0 -39
- package/dist/hooks/useVideoControls.d.ts.map +0 -1
- package/dist/hooks/useVideoControls.js +0 -193
- package/dist/hooks/useVideoControls.js.map +0 -1
|
@@ -0,0 +1,287 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Vanilla Styles - Port of React theme system for vanilla implementations
|
|
3
|
+
*/
|
|
4
|
+
// Theme configuration (matching React version)
|
|
5
|
+
export const aeroTheme = {
|
|
6
|
+
colors: {
|
|
7
|
+
primary: {
|
|
8
|
+
50: "#f0f9ff",
|
|
9
|
+
100: "#e0f2fe",
|
|
10
|
+
200: "#bae6fd",
|
|
11
|
+
300: "#7dd3fc",
|
|
12
|
+
400: "#38bdf8",
|
|
13
|
+
500: "#0ea5e9",
|
|
14
|
+
600: "#0284c7",
|
|
15
|
+
700: "#0369a1",
|
|
16
|
+
800: "#075985",
|
|
17
|
+
900: "#0c4a6e",
|
|
18
|
+
},
|
|
19
|
+
convai: {
|
|
20
|
+
light: "#1EB453",
|
|
21
|
+
medium: "#0b6049",
|
|
22
|
+
dark: "#084c3a",
|
|
23
|
+
},
|
|
24
|
+
neutral: {
|
|
25
|
+
50: "#fafafa",
|
|
26
|
+
100: "#f5f5f5",
|
|
27
|
+
200: "#e5e5e5",
|
|
28
|
+
300: "#d4d4d4",
|
|
29
|
+
400: "#a3a3a3",
|
|
30
|
+
500: "#737373",
|
|
31
|
+
600: "#525252",
|
|
32
|
+
700: "#404040",
|
|
33
|
+
800: "#262626",
|
|
34
|
+
900: "#171717",
|
|
35
|
+
},
|
|
36
|
+
glass: {
|
|
37
|
+
light: "rgba(255, 255, 255, 0.1)",
|
|
38
|
+
medium: "rgba(255, 255, 255, 0.15)",
|
|
39
|
+
dark: "rgba(0, 0, 0, 0.1)",
|
|
40
|
+
backdrop: "rgba(255, 255, 255, 0.8)",
|
|
41
|
+
card: "rgba(255, 255, 255, 0.9)",
|
|
42
|
+
backdropLight: "blur(20px)",
|
|
43
|
+
borderLight: "1px solid rgba(255, 255, 255, 0.2)",
|
|
44
|
+
},
|
|
45
|
+
accent: {
|
|
46
|
+
purple: "#8b5cf6",
|
|
47
|
+
green: "#10b981",
|
|
48
|
+
blue: "#3b82f6",
|
|
49
|
+
orange: "#f59e0b",
|
|
50
|
+
red: "#ef4444",
|
|
51
|
+
},
|
|
52
|
+
error: {
|
|
53
|
+
50: "#fef2f2",
|
|
54
|
+
100: "#fee2e2",
|
|
55
|
+
200: "#fecaca",
|
|
56
|
+
300: "#fca5a5",
|
|
57
|
+
400: "#f87171",
|
|
58
|
+
500: "#ef4444",
|
|
59
|
+
600: "#dc2626",
|
|
60
|
+
700: "#b91c1c",
|
|
61
|
+
800: "#991b1b",
|
|
62
|
+
900: "#7f1d1d",
|
|
63
|
+
},
|
|
64
|
+
text: {
|
|
65
|
+
primary: "#1f2937",
|
|
66
|
+
secondary: "#6b7280",
|
|
67
|
+
tertiary: "#9ca3af",
|
|
68
|
+
inverse: "#ffffff",
|
|
69
|
+
},
|
|
70
|
+
},
|
|
71
|
+
typography: {
|
|
72
|
+
fontFamily: {
|
|
73
|
+
primary: '"Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
|
|
74
|
+
body: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
|
|
75
|
+
mono: 'SF Mono, Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace',
|
|
76
|
+
},
|
|
77
|
+
fontSize: {
|
|
78
|
+
xs: "0.75rem",
|
|
79
|
+
sm: "0.875rem",
|
|
80
|
+
base: "1rem",
|
|
81
|
+
lg: "1.125rem",
|
|
82
|
+
xl: "1.25rem",
|
|
83
|
+
"2xl": "1.5rem",
|
|
84
|
+
"3xl": "1.875rem",
|
|
85
|
+
"4xl": "2.25rem",
|
|
86
|
+
},
|
|
87
|
+
fontWeight: {
|
|
88
|
+
normal: 400,
|
|
89
|
+
medium: 500,
|
|
90
|
+
semibold: 600,
|
|
91
|
+
bold: 700,
|
|
92
|
+
},
|
|
93
|
+
},
|
|
94
|
+
spacing: {
|
|
95
|
+
xs: "0.25rem",
|
|
96
|
+
sm: "0.5rem",
|
|
97
|
+
md: "1rem",
|
|
98
|
+
lg: "1.5rem",
|
|
99
|
+
xl: "2rem",
|
|
100
|
+
"2xl": "3rem",
|
|
101
|
+
"3xl": "4rem",
|
|
102
|
+
},
|
|
103
|
+
borderRadius: {
|
|
104
|
+
none: "0",
|
|
105
|
+
sm: "0.25rem",
|
|
106
|
+
md: "0.5rem",
|
|
107
|
+
lg: "0.75rem",
|
|
108
|
+
xl: "1rem",
|
|
109
|
+
"2xl": "1.5rem",
|
|
110
|
+
full: "9999px",
|
|
111
|
+
},
|
|
112
|
+
shadows: {
|
|
113
|
+
sm: "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
|
|
114
|
+
md: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
|
|
115
|
+
lg: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
|
|
116
|
+
xl: "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
|
|
117
|
+
glass: "0 8px 32px rgba(0, 0, 0, 0.1)",
|
|
118
|
+
},
|
|
119
|
+
glass: {
|
|
120
|
+
backdrop: "blur(20px)",
|
|
121
|
+
backdropLight: "blur(10px)",
|
|
122
|
+
backdropHeavy: "blur(40px)",
|
|
123
|
+
border: "1px solid rgba(255, 255, 255, 0.2)",
|
|
124
|
+
borderLight: "1px solid rgba(255, 255, 255, 0.1)",
|
|
125
|
+
},
|
|
126
|
+
transitions: {
|
|
127
|
+
fast: "0.15s ease-in-out",
|
|
128
|
+
normal: "0.2s ease-in-out",
|
|
129
|
+
slow: "0.3s ease-in-out",
|
|
130
|
+
spring: "0.4s cubic-bezier(0.4, 0, 0.2, 1)",
|
|
131
|
+
snappy: "all 0.1s ease-out",
|
|
132
|
+
},
|
|
133
|
+
zIndex: {
|
|
134
|
+
base: 1,
|
|
135
|
+
dropdown: 1000,
|
|
136
|
+
sticky: 1020,
|
|
137
|
+
fixed: 1030,
|
|
138
|
+
modal: 1040,
|
|
139
|
+
popover: 1050,
|
|
140
|
+
tooltip: 1060,
|
|
141
|
+
},
|
|
142
|
+
};
|
|
143
|
+
/**
|
|
144
|
+
* Global CSS styles for the Convai widget
|
|
145
|
+
* This should be injected once into the document head
|
|
146
|
+
*/
|
|
147
|
+
export const getGlobalStyles = () => `
|
|
148
|
+
@keyframes convai-pulse {
|
|
149
|
+
0%, 100% {
|
|
150
|
+
opacity: 1;
|
|
151
|
+
}
|
|
152
|
+
50% {
|
|
153
|
+
opacity: 0.5;
|
|
154
|
+
}
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
@keyframes convai-spin {
|
|
158
|
+
from {
|
|
159
|
+
transform: rotate(0deg);
|
|
160
|
+
}
|
|
161
|
+
to {
|
|
162
|
+
transform: rotate(360deg);
|
|
163
|
+
}
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
@keyframes convai-bounce {
|
|
167
|
+
0%, 100% {
|
|
168
|
+
transform: translateY(0);
|
|
169
|
+
}
|
|
170
|
+
50% {
|
|
171
|
+
transform: translateY(-10px);
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
@keyframes convai-slide-up {
|
|
176
|
+
from {
|
|
177
|
+
transform: translateY(20px);
|
|
178
|
+
opacity: 0;
|
|
179
|
+
}
|
|
180
|
+
to {
|
|
181
|
+
transform: translateY(0);
|
|
182
|
+
opacity: 1;
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
@keyframes convai-slide-down {
|
|
187
|
+
from {
|
|
188
|
+
transform: translateY(-20px);
|
|
189
|
+
opacity: 0;
|
|
190
|
+
}
|
|
191
|
+
to {
|
|
192
|
+
transform: translateY(0);
|
|
193
|
+
opacity: 1;
|
|
194
|
+
}
|
|
195
|
+
}
|
|
196
|
+
|
|
197
|
+
@keyframes convai-fade-in {
|
|
198
|
+
from {
|
|
199
|
+
opacity: 0;
|
|
200
|
+
}
|
|
201
|
+
to {
|
|
202
|
+
opacity: 1;
|
|
203
|
+
}
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
@keyframes convai-scale-in {
|
|
207
|
+
from {
|
|
208
|
+
transform: scale(0.8);
|
|
209
|
+
opacity: 0;
|
|
210
|
+
}
|
|
211
|
+
to {
|
|
212
|
+
transform: scale(1);
|
|
213
|
+
opacity: 1;
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
.convai-widget * {
|
|
218
|
+
box-sizing: border-box;
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
.convai-widget {
|
|
222
|
+
font-family: ${aeroTheme.typography.fontFamily.primary};
|
|
223
|
+
color: ${aeroTheme.colors.text.primary};
|
|
224
|
+
-webkit-font-smoothing: antialiased;
|
|
225
|
+
-moz-osx-font-smoothing: grayscale;
|
|
226
|
+
}
|
|
227
|
+
|
|
228
|
+
.convai-widget button {
|
|
229
|
+
font-family: inherit;
|
|
230
|
+
cursor: pointer;
|
|
231
|
+
border: none;
|
|
232
|
+
outline: none;
|
|
233
|
+
background: none;
|
|
234
|
+
padding: 0;
|
|
235
|
+
margin: 0;
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
.convai-widget input {
|
|
239
|
+
font-family: inherit;
|
|
240
|
+
border: none;
|
|
241
|
+
outline: none;
|
|
242
|
+
background: none;
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
.convai-widget::-webkit-scrollbar {
|
|
246
|
+
width: 6px;
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
.convai-widget::-webkit-scrollbar-track {
|
|
250
|
+
background: rgba(0, 0, 0, 0.05);
|
|
251
|
+
border-radius: 3px;
|
|
252
|
+
}
|
|
253
|
+
|
|
254
|
+
.convai-widget::-webkit-scrollbar-thumb {
|
|
255
|
+
background: rgba(0, 0, 0, 0.2);
|
|
256
|
+
border-radius: 3px;
|
|
257
|
+
}
|
|
258
|
+
|
|
259
|
+
.convai-widget::-webkit-scrollbar-thumb:hover {
|
|
260
|
+
background: rgba(0, 0, 0, 0.3);
|
|
261
|
+
}
|
|
262
|
+
`;
|
|
263
|
+
/**
|
|
264
|
+
* Inject global styles into the document head
|
|
265
|
+
*/
|
|
266
|
+
let stylesInjected = false;
|
|
267
|
+
export const injectGlobalStyles = () => {
|
|
268
|
+
if (stylesInjected)
|
|
269
|
+
return;
|
|
270
|
+
const styleElement = document.createElement('style');
|
|
271
|
+
styleElement.id = 'convai-widget-styles';
|
|
272
|
+
styleElement.textContent = getGlobalStyles();
|
|
273
|
+
document.head.appendChild(styleElement);
|
|
274
|
+
stylesInjected = true;
|
|
275
|
+
};
|
|
276
|
+
/**
|
|
277
|
+
* Helper to create inline styles object from theme
|
|
278
|
+
*/
|
|
279
|
+
export const createStyles = (styles) => {
|
|
280
|
+
return Object.entries(styles)
|
|
281
|
+
.map(([key, value]) => {
|
|
282
|
+
const cssKey = key.replace(/([A-Z])/g, '-$1').toLowerCase();
|
|
283
|
+
return `${cssKey}: ${value}`;
|
|
284
|
+
})
|
|
285
|
+
.join('; ');
|
|
286
|
+
};
|
|
287
|
+
//# sourceMappingURL=styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/vanilla/styles.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,+CAA+C;AAC/C,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,MAAM,EAAE;QACN,OAAO,EAAE;YACP,EAAE,EAAE,SAAS;YACb,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;SACf;QACD,MAAM,EAAE;YACN,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,SAAS;YACjB,IAAI,EAAE,SAAS;SAChB;QACD,OAAO,EAAE;YACP,EAAE,EAAE,SAAS;YACb,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;SACf;QACD,KAAK,EAAE;YACL,KAAK,EAAE,0BAA0B;YACjC,MAAM,EAAE,2BAA2B;YACnC,IAAI,EAAE,oBAAoB;YAC1B,QAAQ,EAAE,0BAA0B;YACpC,IAAI,EAAE,0BAA0B;YAChC,aAAa,EAAE,YAAY;YAC3B,WAAW,EAAE,oCAAoC;SAClD;QACD,MAAM,EAAE;YACN,MAAM,EAAE,SAAS;YACjB,KAAK,EAAE,SAAS;YAChB,IAAI,EAAE,SAAS;YACf,MAAM,EAAE,SAAS;YACjB,GAAG,EAAE,SAAS;SACf;QACD,KAAK,EAAE;YACL,EAAE,EAAE,SAAS;YACb,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;YACd,GAAG,EAAE,SAAS;SACf;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,SAAS;YAClB,SAAS,EAAE,SAAS;YACpB,QAAQ,EAAE,SAAS;YACnB,OAAO,EAAE,SAAS;SACnB;KACF;IACD,UAAU,EAAE;QACV,UAAU,EAAE;YACV,OAAO,EAAE,gFAAgF;YACzF,IAAI,EAAE,mEAAmE;YACzE,IAAI,EAAE,qFAAqF;SAC5F;QACD,QAAQ,EAAE;YACR,EAAE,EAAE,SAAS;YACb,EAAE,EAAE,UAAU;YACd,IAAI,EAAE,MAAM;YACZ,EAAE,EAAE,UAAU;YACd,EAAE,EAAE,SAAS;YACb,KAAK,EAAE,QAAQ;YACf,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,SAAS;SACjB;QACD,UAAU,EAAE;YACV,MAAM,EAAE,GAAG;YACX,MAAM,EAAE,GAAG;YACX,QAAQ,EAAE,GAAG;YACb,IAAI,EAAE,GAAG;SACV;KACF;IACD,OAAO,EAAE;QACP,EAAE,EAAE,SAAS;QACb,EAAE,EAAE,QAAQ;QACZ,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,QAAQ;QACZ,EAAE,EAAE,MAAM;QACV,KAAK,EAAE,MAAM;QACb,KAAK,EAAE,MAAM;KACd;IACD,YAAY,EAAE;QACZ,IAAI,EAAE,GAAG;QACT,EAAE,EAAE,SAAS;QACb,EAAE,EAAE,QAAQ;QACZ,EAAE,EAAE,SAAS;QACb,EAAE,EAAE,MAAM;QACV,KAAK,EAAE,QAAQ;QACf,IAAI,EAAE,QAAQ;KACf;IACD,OAAO,EAAE;QACP,EAAE,EAAE,iCAAiC;QACrC,EAAE,EAAE,uEAAuE;QAC3E,EAAE,EAAE,yEAAyE;QAC7E,EAAE,EAAE,2EAA2E;QAC/E,KAAK,EAAE,+BAA+B;KACvC;IACD,KAAK,EAAE;QACL,QAAQ,EAAE,YAAY;QACtB,aAAa,EAAE,YAAY;QAC3B,aAAa,EAAE,YAAY;QAC3B,MAAM,EAAE,oCAAoC;QAC5C,WAAW,EAAE,oCAAoC;KAClD;IACD,WAAW,EAAE;QACX,IAAI,EAAE,mBAAmB;QACzB,MAAM,EAAE,kBAAkB;QAC1B,IAAI,EAAE,kBAAkB;QACxB,MAAM,EAAE,mCAAmC;QAC3C,MAAM,EAAE,mBAAmB;KAC5B;IACD,MAAM,EAAE;QACN,IAAI,EAAE,CAAC;QACP,QAAQ,EAAE,IAAI;QACd,MAAM,EAAE,IAAI;QACZ,KAAK,EAAE,IAAI;QACX,KAAK,EAAE,IAAI;QACX,OAAO,EAAE,IAAI;QACb,OAAO,EAAE,IAAI;KACd;CACF,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,GAAW,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBA2E1B,SAAS,CAAC,UAAU,CAAC,UAAU,CAAC,OAAO;aAC7C,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuCzC,CAAC;AAEF;;GAEG;AACH,IAAI,cAAc,GAAG,KAAK,CAAC;AAC3B,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAS,EAAE;IAC3C,IAAI,cAAc;QAAE,OAAO;IAE3B,MAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IACrD,YAAY,CAAC,EAAE,GAAG,sBAAsB,CAAC;IACzC,YAAY,CAAC,WAAW,GAAG,eAAe,EAAE,CAAC;IAC7C,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC;IAExC,cAAc,GAAG,IAAI,CAAC;AACxB,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,MAA2B,EAAU,EAAE;IAClE,OAAO,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC;SAC1B,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;QACpB,MAAM,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC;QAC5D,OAAO,GAAG,MAAM,KAAK,KAAK,EAAE,CAAC;IAC/B,CAAC,CAAC;SACD,IAAI,CAAC,IAAI,CAAC,CAAC;AAChB,CAAC,CAAC"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import type { IConvaiClient, ChatMessage } from '../core/types';
|
|
2
|
+
/**
|
|
3
|
+
* Options for creating a vanilla ConvaiWidget
|
|
4
|
+
*/
|
|
5
|
+
export interface VanillaWidgetOptions {
|
|
6
|
+
/**
|
|
7
|
+
* Convai client instance (required).
|
|
8
|
+
* Should be initialized with config: new ConvaiClient({ apiKey, characterId, ... })
|
|
9
|
+
* The widget will auto-connect on first click.
|
|
10
|
+
*/
|
|
11
|
+
convaiClient: IConvaiClient & {
|
|
12
|
+
activity?: string;
|
|
13
|
+
chatMessages: ChatMessage[];
|
|
14
|
+
};
|
|
15
|
+
/**
|
|
16
|
+
* Show video toggle button in settings (default: true).
|
|
17
|
+
* Only works if connection type is "video". If false, hides the video button.
|
|
18
|
+
*/
|
|
19
|
+
showVideo?: boolean;
|
|
20
|
+
/**
|
|
21
|
+
* Show screen share toggle button in settings (default: true).
|
|
22
|
+
* Only works if connection type is "video". If false, hides the screen share button.
|
|
23
|
+
*/
|
|
24
|
+
showScreenShare?: boolean;
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Vanilla ConvaiWidget instance with cleanup method
|
|
28
|
+
*/
|
|
29
|
+
export interface VanillaWidget {
|
|
30
|
+
/** Root DOM element of the widget */
|
|
31
|
+
element: HTMLElement;
|
|
32
|
+
/** Cleanup and destroy the widget */
|
|
33
|
+
destroy: () => void;
|
|
34
|
+
/** Update widget state (for future extensions) */
|
|
35
|
+
update?: (options: Partial<VanillaWidgetOptions>) => void;
|
|
36
|
+
}
|
|
37
|
+
export type { IConvaiClient, ConvaiConfig, ConvaiClientState, ChatMessage } from '../core/types';
|
|
38
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/vanilla/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAmC,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjG;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC;;;;OAIG;IACH,YAAY,EAAE,aAAa,GAAG;QAAE,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,YAAY,EAAE,WAAW,EAAE,CAAA;KAAE,CAAC;IACjF;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,qCAAqC;IACrC,OAAO,EAAE,WAAW,CAAC;IACrB,qCAAqC;IACrC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,kDAAkD;IAClD,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,oBAAoB,CAAC,KAAK,IAAI,CAAC;CAC3D;AAGD,YAAY,EACV,aAAa,EACb,YAAY,EACZ,iBAAiB,EACjB,WAAW,EACZ,MAAM,eAAe,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/vanilla/types.ts"],"names":[],"mappings":""}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@convai/web-sdk",
|
|
3
|
-
"version": "0.1.1-beta.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "0.1.1-beta.5",
|
|
4
|
+
"description": "Convai Web SDK for AI voice assistants. Supports both React and vanilla JavaScript/TypeScript. Build voice-powered AI interactions with real-time audio/video streaming.",
|
|
5
5
|
"private": false,
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "dist/index.js",
|
|
@@ -16,6 +16,10 @@
|
|
|
16
16
|
"import": "./dist/core/index.js",
|
|
17
17
|
"types": "./dist/core/index.d.ts"
|
|
18
18
|
},
|
|
19
|
+
"./vanilla": {
|
|
20
|
+
"import": "./dist/vanilla/index.js",
|
|
21
|
+
"types": "./dist/vanilla/index.d.ts"
|
|
22
|
+
},
|
|
19
23
|
"./react": {
|
|
20
24
|
"import": "./dist/react/index.js",
|
|
21
25
|
"types": "./dist/react/index.d.ts"
|
|
@@ -41,15 +45,18 @@
|
|
|
41
45
|
"publish:beta": "npm run build:prod && changeset publish --tag beta",
|
|
42
46
|
"example:react": "cd examples/react && pnpm dev",
|
|
43
47
|
"example:react:build": "cd examples/react && pnpm build",
|
|
48
|
+
"example:vanilla": "cd examples/vanilla && pnpm dev",
|
|
49
|
+
"example:vanilla:build": "cd examples/vanilla && pnpm build",
|
|
44
50
|
"examples:dev": "pnpm example:react",
|
|
45
|
-
"examples:build": "pnpm example:react:build",
|
|
46
|
-
"examples:install": "pnpm install && cd examples/react && pnpm install",
|
|
47
|
-
"examples:clean": "pnpm clean && cd examples/react && pnpm clean"
|
|
51
|
+
"examples:build": "pnpm example:react:build && pnpm example:vanilla:build",
|
|
52
|
+
"examples:install": "pnpm install && cd examples/react && pnpm install && cd ../vanilla && pnpm install",
|
|
53
|
+
"examples:clean": "pnpm clean && cd examples/react && pnpm clean && cd ../vanilla && pnpm clean"
|
|
48
54
|
},
|
|
49
55
|
"keywords": [
|
|
50
56
|
"convai",
|
|
51
57
|
"livekit",
|
|
52
58
|
"react",
|
|
59
|
+
"vanilla",
|
|
53
60
|
"typescript",
|
|
54
61
|
"javascript",
|
|
55
62
|
"ai",
|
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
import { ConvaiClient } from "../types";
|
|
2
|
-
interface ConvaiWidgetProps {
|
|
3
|
-
/** Convai client instance (required) */
|
|
4
|
-
convaiClient: ConvaiClient & {
|
|
5
|
-
activity?: string;
|
|
6
|
-
};
|
|
7
|
-
/**
|
|
8
|
-
* Show video toggle button in settings (default: true).
|
|
9
|
-
* Only works if connection type is "video". If false, hides the video button.
|
|
10
|
-
*/
|
|
11
|
-
showVideo?: boolean;
|
|
12
|
-
/**
|
|
13
|
-
* Show screen share toggle button in settings (default: true).
|
|
14
|
-
* Only works if connection type is "video". If false, hides the screen share button.
|
|
15
|
-
*/
|
|
16
|
-
showScreenShare?: boolean;
|
|
17
|
-
}
|
|
18
|
-
/**
|
|
19
|
-
* ConvaiWidget - A consolidated chat widget component for real-time conversations
|
|
20
|
-
*
|
|
21
|
-
* This component provides a complete UI for interacting with Convai characters.
|
|
22
|
-
* Connection configuration should be handled via useConvaiClient.connect().
|
|
23
|
-
*
|
|
24
|
-
* Features:
|
|
25
|
-
* - Collapsed circular button with status indicator
|
|
26
|
-
* - Expandable/collapsible chat interface
|
|
27
|
-
* - Voice mode support
|
|
28
|
-
* - Real-time message streaming
|
|
29
|
-
* - Audio controls (mute/unmute)
|
|
30
|
-
* - Settings tray with session reset
|
|
31
|
-
* - Optional video and screen share (when connection type supports it)
|
|
32
|
-
*
|
|
33
|
-
* @param {ConvaiWidgetProps} props - Component props
|
|
34
|
-
* @param {ConvaiClient} props.convaiClient - Convai client instance (required)
|
|
35
|
-
* @param {boolean} props.showVideo - Show video toggle in settings (default: true)
|
|
36
|
-
* @param {boolean} props.showScreenShare - Show screen share toggle in settings (default: true)
|
|
37
|
-
*
|
|
38
|
-
* @example
|
|
39
|
-
* ```tsx
|
|
40
|
-
* function App() {
|
|
41
|
-
* const convaiClient = useConvaiClient({
|
|
42
|
-
* apiKey: 'your-api-key',
|
|
43
|
-
* characterId: 'your-character-id',
|
|
44
|
-
* enableVideo: true,
|
|
45
|
-
* });
|
|
46
|
-
*
|
|
47
|
-
* return (
|
|
48
|
-
* <ConvaiWidget
|
|
49
|
-
* convaiClient={convaiClient}
|
|
50
|
-
* showVideo={true}
|
|
51
|
-
* showScreenShare={true}
|
|
52
|
-
* />
|
|
53
|
-
* );
|
|
54
|
-
* }
|
|
55
|
-
* ```
|
|
56
|
-
*/
|
|
57
|
-
export declare const ConvaiWidget: React.FC<ConvaiWidgetProps>;
|
|
58
|
-
export {};
|
|
59
|
-
//# sourceMappingURL=ConvaiWidget.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ConvaiWidget.d.ts","sourceRoot":"","sources":["../../src/components/ConvaiWidget.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAyCxC,UAAU,iBAAiB;IACzB,wCAAwC;IACxC,YAAY,EAAE,YAAY,GAAG;QAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACnD;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAqpBpD,CAAC"}
|