React + Vite

VITE_OPRAG_PROJECT_ID=proj_abc123
VITE_OPRAG_EMBED_KEY=embed_live_...
VITE_OPRAG_API_URL=https://api.dev.oprag.ai

# Not VITE_-prefixed, so it never reaches the bundle.
OPRAG_SECRET_KEY=sk_live_...

import { useEffect } from "react";
import { mountWidget, type WidgetHandle } from "@oprag/sdk/widget";

export function Chat() {
  useEffect(() => {
    let handle: WidgetHandle | undefined;
    let cancelled = false;

    void mountWidget({
      projectId: import.meta.env.VITE_OPRAG_PROJECT_ID,
      embedKey: import.meta.env.VITE_OPRAG_EMBED_KEY,
      apiUrl: import.meta.env.VITE_OPRAG_API_URL,
      theme: { primaryColor: "#0F766E", position: "bottom-right", mode: "auto" },
    }).then((widget) => {
      if (cancelled) return widget.destroy();
      handle = widget;
    });

    return () => {
      cancelled = true;
      handle?.destroy();
    };
  }, []);

  return null;
}