Copilot Chat Widget

Embeddable chat widget that can be added via NPM or a script tag.

Installation

npm install copilot-chat-widget
# or
yarn add copilot-chat-widget

Usage (NPM import)

import { loadCopilotChatWidget } from "copilot-chat-widget";

loadCopilotChatWidget({
  token: "YOUR_WIDGET_TOKEN",
  // optional: baseUrl if backend is on a different origin
  // baseUrl: "https://your-backend-domain"
});

loadCopilotChatWidget injects the standalone script (chat-widget.min.js) and bootstraps the widget using the provided token.

React/Next.js example

import { useEffect } from "react";
import { loadCopilotChatWidget } from "copilot-chat-widget";

export default function Page() {
  useEffect(() => {
    loadCopilotChatWidget({
      token: process.env.NEXT_PUBLIC_CHAT_WIDGET_TOKEN,
      baseUrl: process.env.NEXT_PUBLIC_WIDGET_BASE_URL // optional override if backend is another origin
    });
  }, []);

  return <main>Your page content</main>;
}

Usage (script tag)

<script
  src="https://cdn.example.com/chat-widget.min.js"
  data-token="YOUR_WIDGET_TOKEN"
  data-base-url="https://your-backend-domain"  <!-- optional if backend is another origin -->
></script>

• data-token: required.
• data-base-url: optional override; if omitted, the widget uses the build-time default WIDGET_BASE_URL, then falls back to the script/page origin.
• data-autoload="false": if you want to insert the script but call window.CopilotChat.init() manually.

Configuration

• token (string, required): widget token.
• baseUrl (string): backend host serving /api/chat-widget/config. Needed when the embedding page is on a different origin. If omitted, the widget uses WIDGET_BASE_URL (injected at build) then falls back to the script/page origin.
• autoload (boolean): set false to defer bootstrap and call window.CopilotChat.load() yourself.

Runtime controls (after script loads):

window.CopilotChat.open();   // open widget
window.CopilotChat.close();  // close widget
window.CopilotChat.load();   // initialize if autoload=false