hanc-webrtc-widgets 1.4.2 → 2.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 +86 -0
- package/dist/hanc-webrtc-widgets.es.js +7222 -5167
- package/dist/hanc-webrtc-widgets.umd.js +244 -321
- package/dist/src/components/floating-call/floating-call.d.ts +22 -0
- package/dist/src/components/floating-call/styles.d.ts +5 -0
- package/dist/src/components/inline-call/inline-call.d.ts +15 -0
- package/dist/src/renderers/base-renderer.d.ts +79 -0
- package/dist/src/renderers/index.d.ts +12 -0
- package/dist/src/renderers/liquid-glass-renderer.d.ts +19 -0
- package/dist/src/renderers/morphing-blob-renderer.d.ts +23 -0
- package/dist/src/renderers/neural-liquid-renderer.d.ts +20 -0
- package/dist/src/renderers/neural-network-renderer.d.ts +15 -0
- package/dist/src/renderers/organic-sphere-renderer.d.ts +16 -0
- package/dist/src/themes/index.d.ts +1 -0
- package/dist/src/themes/presets.d.ts +50 -0
- package/dist/src/themes/theme-vars.d.ts +2 -0
- package/dist/src/types/config.d.ts +182 -0
- package/dist/src/types/index.d.ts +1 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -199,6 +199,92 @@ An “inline” widget that you embed directly in page content (often as a hero
|
|
|
199
199
|
</style>
|
|
200
200
|
```
|
|
201
201
|
|
|
202
|
+
## Additional customization options (append-only)
|
|
203
|
+
|
|
204
|
+
Below are the new properties and examples you can add to the widgets.
|
|
205
|
+
|
|
206
|
+
### Theme and visual style
|
|
207
|
+
|
|
208
|
+
Themes: `liquid-purple` (default), `liquid-cyan`, `liquid-pink`, `neural-green`,
|
|
209
|
+
`neural-blue`, `orbit-blue`, `synaptic-purple`, `minimal-dark`, `minimal-light`, `custom`.
|
|
210
|
+
|
|
211
|
+
Visual styles: `liquid-glass` (default), `liquid-glass-premium`, `neural-liquid`,
|
|
212
|
+
`neural-orbit`, `neural-network`, `synaptic-core`, `organic-sphere`, `morphing-blob`.
|
|
213
|
+
|
|
214
|
+
```html
|
|
215
|
+
<hanc-ai-inline-call
|
|
216
|
+
agent-id="YOUR_AGENT_ID"
|
|
217
|
+
theme="liquid-cyan"
|
|
218
|
+
visual-style="neural-liquid"
|
|
219
|
+
orb-size="200"
|
|
220
|
+
></hanc-ai-inline-call>
|
|
221
|
+
```
|
|
222
|
+
|
|
223
|
+
### Inline widget new attributes
|
|
224
|
+
|
|
225
|
+
- `voice-service-url`
|
|
226
|
+
- `theme`
|
|
227
|
+
- `visual-style`
|
|
228
|
+
- `orb-size`
|
|
229
|
+
- `button-end-text`
|
|
230
|
+
|
|
231
|
+
```html
|
|
232
|
+
<hanc-ai-inline-call
|
|
233
|
+
agent-id="YOUR_AGENT_ID"
|
|
234
|
+
voice-service-url="https://voice.example.com"
|
|
235
|
+
theme="minimal-light"
|
|
236
|
+
visual-style="morphing-blob"
|
|
237
|
+
orb-size="220"
|
|
238
|
+
button-end-text="Stop"
|
|
239
|
+
></hanc-ai-inline-call>
|
|
240
|
+
```
|
|
241
|
+
|
|
242
|
+
### Floating widget new attributes
|
|
243
|
+
|
|
244
|
+
- `voice-service-url`
|
|
245
|
+
- `theme`
|
|
246
|
+
- `visual-style`
|
|
247
|
+
- `position`
|
|
248
|
+
- `offset-x`
|
|
249
|
+
- `offset-y`
|
|
250
|
+
- `orb-size`
|
|
251
|
+
- `minimized`
|
|
252
|
+
|
|
253
|
+
```html
|
|
254
|
+
<hanc-ai-floating-call
|
|
255
|
+
agent-id="YOUR_AGENT_ID"
|
|
256
|
+
voice-service-url="https://voice.example.com"
|
|
257
|
+
theme="neural-green"
|
|
258
|
+
visual-style="neural-network"
|
|
259
|
+
position="top-left"
|
|
260
|
+
offset-x="32"
|
|
261
|
+
offset-y="32"
|
|
262
|
+
orb-size="140"
|
|
263
|
+
minimized
|
|
264
|
+
></hanc-ai-floating-call>
|
|
265
|
+
```
|
|
266
|
+
|
|
267
|
+
### CSS variables (when using theme="custom")
|
|
268
|
+
|
|
269
|
+
```css
|
|
270
|
+
hanc-ai-inline-call {
|
|
271
|
+
--hanc-button: linear-gradient(135deg, #0ea5e9 0%, #22d3ee 100%);
|
|
272
|
+
--hanc-button-hover: linear-gradient(135deg, #0284c7 0%, #0ea5e9 100%);
|
|
273
|
+
--hanc-button-active: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
|
|
274
|
+
--hanc-button-text: #ffffff;
|
|
275
|
+
--hanc-button-radius: 16px;
|
|
276
|
+
--hanc-button-shadow: rgba(14, 165, 233, 0.35);
|
|
277
|
+
--hanc-button-shadow-hover: rgba(14, 165, 233, 0.45);
|
|
278
|
+
--hanc-button-shadow-active: rgba(239, 68, 68, 0.45);
|
|
279
|
+
}
|
|
280
|
+
|
|
281
|
+
hanc-ai-floating-call {
|
|
282
|
+
--hanc-background: rgba(10, 10, 20, 0.9);
|
|
283
|
+
--hanc-glow-shadow: rgba(14, 165, 233, 0.2);
|
|
284
|
+
--hanc-orb-size: 140px;
|
|
285
|
+
}
|
|
286
|
+
```
|
|
287
|
+
|
|
202
288
|
---
|
|
203
289
|
|
|
204
290
|
### `<hanc-ai-floating-call>`
|