Widget Integration (JavaScript)
Load Spark from the CDN and initialize the Widget.
Spark is delivered as an ES module from the Chatbyte CDN. This guide is the full JavaScript walkthrough for initializing the Widget.
CDN embed
<script type="module">
import { createWidget } from 'https://cdn.chatbyte.ai/spark.min.js';
const widget = await createWidget('your-agent-id', {
apiOrigin: 'https://app.chatbyte.ai',
});
widget.open();
</script>Bundler usage
const { createWidget } = await import(
/* webpackIgnore: true */
'https://cdn.chatbyte.ai/spark.min.js'
);
const widget = await createWidget('your-agent-id', {
apiOrigin: 'https://app.chatbyte.ai',
});Options
interface CreateWidgetOptions {
theme?: 'light' | 'dark' | 'auto';
position?: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
primaryColor?: string;
assistantName?: string;
apiOrigin?: string;
initialToken?: string;
}Notes
apiOrigindefaults tohttps://app.chatbyte.ai.initialTokenis optional and triggers identification on load.theme: 'auto'follows the user’s system theme.