Adding Context

Use addSources() to inject structured business context at runtime.

import { addSources } from "https://cdn.docuworm.ai/docuworm.js";

const widget = document.querySelector("docuworm-chat");

addSources(
  [
    {
      title: "Case Summary",
      text: "Customer reported duplicate transaction from merchant ACME.",
      category: "case",
    },
    {
      title: "Recent Transactions",
      text: "2026-02-02: $48.99 ACME\n2026-02-05: $48.99 ACME",
      category: "transactions",
    },
  ],
  widget,
);

Source shape

type Source = {
  title: string;
  text: string;
  category?: string;
};

Runtime behavior

• If a thread exists, sources are added immediately.
• If a thread is not ready yet, sources are queued and applied once ready.
• Calling addSources() can trigger thread initialization when needed.

Context quality guidelines

• Keep titles stable and descriptive.
• Use categories that map to your domain (case, policy, billing, profile).
• Keep text concise and high-signal.
• Update context whenever the active app entity changes.

React

function applyCaseContext(widget: HTMLElement, summary: string) {
  addSources([{ title: "Case Summary", text: summary, category: "case" }], widget);
}

Vue

function applyCaseContext(widget: HTMLElement, summary: string) {
  addSources([{ title: "Case Summary", text: summary, category: "case" }], widget);
}

Svelte

<script lang="ts">
  function applyCaseContext(widget: HTMLElement, summary: string) {
    addSources([{ title: "Case Summary", text: summary, category: "case" }], widget);
  }
</script>

Common production pattern

1. Load entity data from your backend.
2. Upload related documents programmatically.
3. Add structured context with addSources().
4. Let users continue with manual uploads from the widget UI.

See also

• Uploading Files
• Thread Routing
• Embed API Reference