@dialgem/client 0.0.0-stage → 1.0.0

package/dist/react.cjs

@@ -0,0 +1,623 @@
+'use strict';
+
+var react = require('react');
+
+// src/react.ts
+
+// src/emitter.ts
+var Emitter = class {
+  handlers = /* @__PURE__ */ new Map();
+  on(event, handler) {
+    let set = this.handlers.get(event);
+    if (!set) this.handlers.set(event, set = /* @__PURE__ */ new Set());
+    set.add(handler);
+    return () => this.off(event, handler);
+  }
+  off(event, handler) {
+    this.handlers.get(event)?.delete(handler);
+  }
+  emit(event, payload) {
+    for (const handler of [...this.handlers.get(event) ?? []]) {
+      try {
+        ;
+        handler(payload);
+      } catch (error) {
+        if (typeof reportError === "function") reportError(error);
+        else console.error(error);
+      }
+    }
+  }
+};
+
+// src/protocol.ts
+var DEFAULT_BASE_URL = "wss://api.dialgem.com";
+var SAMPLE_RATE = 16e3;
+var CAPTURE_CHUNK_SAMPLES = 640;
+var UrlError = class extends Error {
+};
+function buildCallUrl(baseURL, accessToken) {
+  let url;
+  try {
+    url = new URL(baseURL);
+  } catch {
+    throw new UrlError(`baseURL is not a URL: ${baseURL}`);
+  }
+  if (url.protocol === "https:") url.protocol = "wss:";
+  if (url.protocol === "http:") url.protocol = "ws:";
+  if (url.protocol !== "wss:" && url.protocol !== "ws:") throw new UrlError("baseURL must be a wss:// or ws:// address");
+  const local = url.hostname === "localhost" || url.hostname === "127.0.0.1" || url.hostname === "[::1]";
+  if (url.protocol === "ws:" && !local) throw new UrlError("baseURL must use wss:// except for localhost");
+  if (!accessToken) throw new UrlError("accessToken is empty");
+  if (/^zk_/i.test(accessToken.trim())) {
+    throw new UrlError(
+      "That is an organization API key, not a call token. Never put an API key in a web page: create the call on your server with webCalls.create() and give the page its access_token."
+    );
+  }
+  const base = url.toString().replace(/\/+$/, "");
+  const query = new URLSearchParams({ web_token: accessToken, live_transcript: "1" });
+  return `${base}/v1/agent/call?${query.toString()}`;
+}
+var INIT_FRAME = JSON.stringify({ agent_config: {} });
+function parseServerFrame(text) {
+  let msg;
+  try {
+    msg = JSON.parse(text);
+  } catch {
+    return { type: "ignored" };
+  }
+  if (typeof msg !== "object" || msg === null) return { type: "ignored" };
+  const m = msg;
+  if (typeof m["error"] === "string") {
+    return { type: "error", reason: typeof m["disconnection_reason"] === "string" ? m["disconnection_reason"] : m["error"] };
+  }
+  switch (m["type"]) {
+    case "session_started":
+      return { type: "session_started", sessionId: typeof m["session_id"] === "string" ? m["session_id"] : "" };
+    case "transcript":
+      if ((m["role"] === "user" || m["role"] === "agent") && typeof m["text"] === "string") {
+        return { type: "transcript", role: m["role"], text: m["text"] };
+      }
+      return { type: "ignored" };
+    case "transcript_partial":
+      return m["role"] === "user" && typeof m["text"] === "string" ? { type: "transcript_partial", text: m["text"] } : { type: "ignored" };
+    case "agent_interrupted":
+      return { type: "agent_interrupted" };
+    case "call_ended":
+      return { type: "call_ended" };
+    default:
+      return { type: "ignored" };
+  }
+}
+function stripRiffHeader(chunk) {
+  if (chunk.byteLength >= 4) {
+    const magic = new Uint8Array(chunk, 0, 4);
+    if (magic[0] === 82 && magic[1] === 73 && magic[2] === 70 && magic[3] === 70) {
+      return chunk.byteLength <= 44 ? null : chunk.slice(44);
+    }
+  }
+  return chunk;
+}
+function describeRefusal(reason) {
+  switch (reason) {
+    case "origin_not_allowed":
+      return { code: "refused", message: "This page's origin is not allowed to start calls. Add it under Web calls in your Dialgem settings." };
+    case "token_expired":
+      return { code: "refused", message: "The access token expired before the call connected. Request a new one and start again." };
+    case "token_already_used":
+      return { code: "refused", message: "The access token was already used. Each call needs its own token from your backend." };
+    case "token_invalid":
+    case "bad_request":
+      return { code: "refused", message: "The access token is not valid for a call." };
+    case "concurrency_limit_reached":
+      return { code: "busy", message: "Too many calls are running right now. Try again in a moment." };
+    case "web_calls_unavailable":
+      return { code: "server_error", message: "Browser calls are not available right now." };
+    default:
+      return { code: "call_refused", message: `The call was declined: ${reason}.` };
+  }
+}
+function describeClose(code) {
+  switch (code) {
+    case 1008:
+      return {
+        code: "refused",
+        message: "The call was refused. The access token was invalid, expired or already used, or this page's origin is not allowed to start calls."
+      };
+    case 1013:
+      return { code: "busy", message: "Too many calls are running right now. Try again in a moment." };
+    case 1011:
+    case 1002:
+      return { code: "server_error", message: "The call could not start because of a problem on Dialgem's side." };
+    default:
+      return { code: "connection_failed", message: "Could not connect to the call." };
+  }
+}
+
+// src/player.ts
+var PcmPlayer = class {
+  constructor(ctx) {
+    this.ctx = ctx;
+  }
+  ctx;
+  nextTime = 0;
+  sources = [];
+  /** A trailing odd byte: frames are not guaranteed to end on a sample boundary. */
+  carry = null;
+  feed(chunk) {
+    let data = stripRiffHeader(chunk);
+    if (data === null) return;
+    if (this.carry) {
+      const joined = new Uint8Array(this.carry.length + data.byteLength);
+      joined.set(this.carry, 0);
+      joined.set(new Uint8Array(data), this.carry.length);
+      data = joined.buffer;
+      this.carry = null;
+    }
+    const usable = data.byteLength - data.byteLength % 2;
+    if (usable !== data.byteLength) this.carry = new Uint8Array(data.slice(usable));
+    const samples = usable / 2;
+    if (samples < 1) return;
+    const pcm = new Int16Array(data.slice(0, usable));
+    const floats = new Float32Array(samples);
+    for (let i = 0; i < samples; i++) floats[i] = (pcm[i] ?? 0) / 32768;
+    const buffer = this.ctx.createBuffer(1, samples, SAMPLE_RATE);
+    buffer.copyToChannel(floats, 0);
+    const source = this.ctx.createBufferSource();
+    source.buffer = buffer;
+    source.connect(this.ctx.destination);
+    source.onended = () => {
+      const i = this.sources.indexOf(source);
+      if (i !== -1) this.sources.splice(i, 1);
+    };
+    const now = this.ctx.currentTime;
+    if (this.nextTime < now) this.nextTime = now + 0.02;
+    source.start(this.nextTime);
+    this.sources.push(source);
+    this.nextTime += buffer.duration;
+  }
+  /** Stop everything queued, immediately: the caller started talking over the agent. */
+  interrupt() {
+    for (const s of this.sources) {
+      try {
+        s.stop(0);
+      } catch {
+      }
+    }
+    this.sources = [];
+    this.nextTime = 0;
+    this.carry = null;
+  }
+  /** Whether anything is queued or playing. */
+  active() {
+    return this.sources.length > 0;
+  }
+  /** Milliseconds of audio still queued ahead of the audio clock. */
+  remainingMs() {
+    return Math.max(0, (this.nextTime - this.ctx.currentTime) * 1e3);
+  }
+};
+
+// src/worklet.ts
+var WORKLET_NAME = "dialgem-capture";
+var WORKLET_SOURCE = `
+class DialgemCapture extends AudioWorkletProcessor {
+  constructor(options) {
+    super()
+    const o = (options && options.processorOptions) || {}
+    this.chunk = o.chunkSamples || ${CAPTURE_CHUNK_SAMPLES}
+    this.ratio = sampleRate / (o.targetRate || ${SAMPLE_RATE})
+    this.pos = 0
+    this.boundary = this.ratio
+    this.sum = 0
+    this.count = 0
+    this.last = 0
+    this.out = new Int16Array(this.chunk)
+    this.n = 0
+    this.peak = 0
+  }
+
+  emit(v) {
+    const a = v < 0 ? -v : v
+    if (a > this.peak) this.peak = a
+    const s = v > 1 ? 1 : v < -1 ? -1 : v
+    this.out[this.n++] = s < 0 ? s * 32768 : s * 32767
+    if (this.n === this.chunk) {
+      const pcm = this.out.buffer
+      this.port.postMessage({ pcm: pcm, peak: this.peak }, [pcm])
+      this.out = new Int16Array(this.chunk)
+      this.n = 0
+      this.peak = 0
+    }
+  }
+
+  process(inputs) {
+    const input = inputs[0] && inputs[0][0]
+    if (!input) return true
+    for (let i = 0; i < input.length; i++) {
+      this.sum += input[i]
+      this.count++
+      this.pos++
+      while (this.pos >= this.boundary) {
+        const v = this.count > 0 ? this.sum / this.count : this.last
+        this.last = v
+        this.sum = 0
+        this.count = 0
+        this.boundary += this.ratio
+        this.emit(v)
+      }
+    }
+    return true
+  }
+}
+registerProcessor(${JSON.stringify(WORKLET_NAME)}, DialgemCapture)
+`;
+
+// src/call.ts
+var LEVEL_INTERVAL_MS = 100;
+var MAX_DRAIN_MS = 1e4;
+function browser() {
+  const g = globalThis;
+  const nav = g["navigator"];
+  const url = g["URL"];
+  const out = {};
+  if (g["WebSocket"]) out.WebSocket = g["WebSocket"];
+  const audio = g["AudioContext"] ?? g["webkitAudioContext"];
+  if (audio) out.AudioContext = audio;
+  if (g["AudioWorkletNode"]) out.AudioWorkletNode = g["AudioWorkletNode"];
+  if (g["Blob"]) out.Blob = g["Blob"];
+  if (nav?.mediaDevices?.getUserMedia) out.getUserMedia = (c) => nav.mediaDevices.getUserMedia(c);
+  if (url?.createObjectURL) out.createObjectURL = (b) => url.createObjectURL(b);
+  if (url?.revokeObjectURL) out.revokeObjectURL = (u) => url.revokeObjectURL(u);
+  return out;
+}
+var DialgemCall = class extends Emitter {
+  constructor(options) {
+    super();
+    this.options = options;
+    this.platform = { ...browser(), ...options.platform ?? {} };
+  }
+  options;
+  _state = "idle";
+  _muted = false;
+  _callId = null;
+  platform;
+  ctx = null;
+  stream = null;
+  ws = null;
+  player = null;
+  source = null;
+  node = null;
+  sink = null;
+  moduleUrl = null;
+  speakingTimer = null;
+  drainTimer = null;
+  ending = false;
+  pendingRefusal = null;
+  failure = null;
+  lastLevelAt = 0;
+  speaking = false;
+  get state() {
+    return this._state;
+  }
+  /** Set once the call has started. */
+  get callId() {
+    return this._callId;
+  }
+  get muted() {
+    return this._muted;
+  }
+  /**
+   * Opens the microphone and the call. Call it directly from a click or tap: the browser decides whether the page
+   * may play sound at the moment this runs, and a call started from a timer or after other awaits can be silent.
+   * Resolves when the connection is open; the call has started when `started` fires. A failure is reported as an
+   * `error` event and also rejects.
+   */
+  async start() {
+    if (this._state !== "idle") throw new Error("A call object can only be started once. Create a new DialgemCall for each call.");
+    this.setState("connecting");
+    const p = this.platform;
+    if (!p.WebSocket || !p.AudioContext || !p.AudioWorkletNode || !p.getUserMedia || !p.createObjectURL || !p.Blob) {
+      throw this.fail({ code: "unsupported", message: "This browser cannot run voice calls (it needs WebSocket, Web Audio with AudioWorklet, and a microphone API)." });
+    }
+    try {
+      this.ctx = new p.AudioContext();
+      void this.ctx.resume();
+    } catch {
+      throw this.fail({ code: "unsupported", message: "This browser could not start audio." });
+    }
+    this.player = new PcmPlayer(this.ctx);
+    const mic = this.options.microphone ?? {};
+    try {
+      this.stream = await p.getUserMedia({
+        audio: {
+          channelCount: 1,
+          echoCancellation: mic.echoCancellation ?? true,
+          noiseSuppression: mic.noiseSuppression ?? true,
+          autoGainControl: mic.autoGainControl ?? true,
+          ...mic.deviceId ? { deviceId: { exact: mic.deviceId } } : {}
+        }
+      });
+    } catch (error) {
+      const name = error?.name ?? "";
+      throw this.fail(
+        name === "NotAllowedError" || name === "SecurityError" ? { code: "mic_denied", message: "Microphone access was denied. Allow the microphone for this page and try again." } : { code: "mic_unavailable", message: "The microphone could not be opened. Check that one is connected and not in use by another app." }
+      );
+    }
+    if (this.dead()) return this.cleanup();
+    try {
+      this.moduleUrl = p.createObjectURL(new p.Blob([WORKLET_SOURCE], { type: "application/javascript" }));
+      await this.ctx.audioWorklet.addModule(this.moduleUrl);
+    } catch {
+      throw this.fail({
+        code: "unsupported",
+        message: "The audio processor could not be loaded. If this page sets a Content-Security-Policy, allow blob: in script-src."
+      });
+    }
+    if (this.dead()) return this.cleanup();
+    let token;
+    try {
+      const t = this.options.accessToken;
+      token = typeof t === "function" ? await t() : t;
+      if (!token) throw new Error("empty token");
+    } catch {
+      throw this.fail({ code: "token_unavailable", message: "Could not get an access token for the call." });
+    }
+    if (this.dead()) return this.cleanup();
+    let url;
+    try {
+      url = buildCallUrl(this.options.baseURL ?? DEFAULT_BASE_URL, token);
+    } catch (error) {
+      throw this.fail({ code: "connection_failed", message: error instanceof UrlError ? error.message : "Invalid call address." });
+    }
+    await new Promise((resolve) => {
+      const ws = new p.WebSocket(url);
+      ws.binaryType = "arraybuffer";
+      this.ws = ws;
+      ws.onopen = () => {
+        ws.send(INIT_FRAME);
+        resolve();
+      };
+      ws.onmessage = (event) => this.onMessage(event.data);
+      ws.onerror = () => resolve();
+      ws.onclose = (event) => {
+        resolve();
+        this.onClose(event.code);
+      };
+    });
+    if (this.failure) throw this.fail(this.failure);
+  }
+  /** Ends the call. Safe to call at any time, any number of times. */
+  stop() {
+    if (this._state === "idle") {
+      this.setState("ended");
+      this.emit("ended", { reason: "hangup" });
+      return;
+    }
+    if (this._state !== "active" && this._state !== "connecting") return;
+    try {
+      if (this.ws?.readyState === 1) this.ws.send("hangup");
+    } catch {
+    }
+    this.finish("hangup");
+  }
+  /** While muted the agent hears silence. The call stays open. */
+  setMuted(muted) {
+    this._muted = muted;
+    if (muted) this.emit("level", { level: 0 });
+  }
+  // ── server to client ──────────────────────────────────────────────────────────
+  onMessage(data) {
+    if (typeof data !== "string") {
+      if (data instanceof ArrayBuffer) this.onAudio(data);
+      return;
+    }
+    const frame = parseServerFrame(data);
+    switch (frame.type) {
+      case "session_started":
+        this.onStarted(frame.sessionId);
+        break;
+      case "transcript":
+        this.emit("transcript", { role: frame.role, text: frame.text, final: true });
+        break;
+      case "transcript_partial":
+        this.emit("transcript", { role: "user", text: frame.text, final: false });
+        break;
+      case "agent_interrupted":
+        this.player?.interrupt();
+        this.setSpeaking(false);
+        this.emit("interrupted", {});
+        break;
+      case "call_ended":
+        this.onCallEnded();
+        break;
+      case "error":
+        this.pendingRefusal = frame.reason;
+        break;
+    }
+  }
+  onStarted(sessionId) {
+    if (this._state !== "connecting" || !this.ctx || !this.stream) return;
+    this._callId = sessionId || null;
+    this.setState("active");
+    const ctx = this.ctx;
+    this.source = ctx.createMediaStreamSource(this.stream);
+    this.node = new this.platform.AudioWorkletNode(ctx, WORKLET_NAME, {
+      numberOfInputs: 1,
+      numberOfOutputs: 1,
+      outputChannelCount: [1],
+      processorOptions: { targetRate: SAMPLE_RATE, chunkSamples: CAPTURE_CHUNK_SAMPLES }
+    });
+    this.sink = ctx.createGain();
+    this.sink.gain.value = 0;
+    this.source.connect(this.node);
+    this.node.connect(this.sink);
+    this.sink.connect(ctx.destination);
+    this.node.port.onmessage = (event) => this.onCaptured(event.data);
+    this.emit("started", { callId: this._callId ?? "" });
+  }
+  onCaptured(frame) {
+    const ws = this.ws;
+    if (!ws || ws.readyState !== 1 || this.ending) return;
+    ws.send(this._muted ? new ArrayBuffer(frame.pcm.byteLength) : frame.pcm);
+    const now = Date.now();
+    if (!this._muted && now - this.lastLevelAt >= LEVEL_INTERVAL_MS) {
+      this.lastLevelAt = now;
+      this.emit("level", { level: Math.min(1, frame.peak) });
+    }
+  }
+  onAudio(data) {
+    if (this._state !== "active" || !this.player) return;
+    this.player.feed(data);
+    this.setSpeaking(true);
+    if (this.speakingTimer) clearTimeout(this.speakingTimer);
+    this.speakingTimer = setTimeout(() => this.setSpeaking(false), this.player.remainingMs() + 50);
+  }
+  setSpeaking(speaking) {
+    if (speaking === this.speaking) return;
+    this.speaking = speaking;
+    if (!speaking && this.speakingTimer) {
+      clearTimeout(this.speakingTimer);
+      this.speakingTimer = null;
+    }
+    this.emit("agent_speaking", { speaking });
+  }
+  onCallEnded() {
+    if (this.ending || this.dead()) return;
+    this.ending = true;
+    const wait = Math.min(MAX_DRAIN_MS, (this.player?.remainingMs() ?? 0) + 50);
+    this.drainTimer = setTimeout(() => this.finish("agent_ended"), wait);
+  }
+  onClose(code) {
+    if (this.dead()) return;
+    if (this._state === "active") {
+      if (!this.ending) this.finish("connection_lost");
+      return;
+    }
+    if (this.pendingRefusal) {
+      this.fail({ ...describeRefusal(this.pendingRefusal), reason: this.pendingRefusal });
+      return;
+    }
+    this.fail(describeClose(code));
+  }
+  // ── ending ────────────────────────────────────────────────────────────────────
+  dead() {
+    return this._state === "ended" || this._state === "error";
+  }
+  /** Ends the call as failed and reports it once. Returns the error, for `start()` to throw. */
+  fail(error) {
+    if (!this.dead()) {
+      this.failure = error;
+      this.cleanup();
+      this.setState("error");
+      this.emit("error", error);
+    }
+    const shown = this.failure ?? error;
+    return Object.assign(new Error(shown.message), { code: shown.code, reason: shown.reason });
+  }
+  finish(reason) {
+    if (this.dead()) return;
+    this.cleanup();
+    this.setState("ended");
+    this.emit("ended", { reason });
+  }
+  setState(state) {
+    this._state = state;
+    this.emit("state", state);
+  }
+  cleanup() {
+    this.ending = true;
+    for (const t of [this.speakingTimer, this.drainTimer]) if (t) clearTimeout(t);
+    this.speakingTimer = this.drainTimer = null;
+    if (this.speaking) {
+      this.speaking = false;
+      this.emit("agent_speaking", { speaking: false });
+    }
+    this.player?.interrupt();
+    if (this.node) {
+      this.node.port.onmessage = null;
+      try {
+        this.node.disconnect();
+      } catch {
+      }
+    }
+    try {
+      this.source?.disconnect();
+      this.sink?.disconnect();
+    } catch {
+    }
+    this.stream?.getTracks().forEach((t) => t.stop());
+    if (this.ws) {
+      this.ws.onmessage = this.ws.onerror = this.ws.onopen = null;
+      try {
+        this.ws.close();
+      } catch {
+      }
+    }
+    if (this.moduleUrl) this.platform.revokeObjectURL?.(this.moduleUrl);
+    void this.ctx?.close().catch(() => void 0);
+    this.node = this.source = this.sink = this.stream = this.ctx = this.player = null;
+    this.moduleUrl = null;
+  }
+};
+
+// src/react.ts
+function useDialgemCall(options) {
+  const [state, setState] = react.useState("idle");
+  const [transcript, setTranscript] = react.useState([]);
+  const [agentSpeaking, setAgentSpeaking] = react.useState(false);
+  const [muted, setMutedState] = react.useState(false);
+  const [level, setLevel] = react.useState(0);
+  const [callId, setCallId] = react.useState(null);
+  const [endReason, setEndReason] = react.useState(null);
+  const [error, setError] = react.useState(null);
+  const callRef = react.useRef(null);
+  const optionsRef = react.useRef(options);
+  optionsRef.current = options;
+  const nextId = react.useRef(0);
+  react.useEffect(() => () => callRef.current?.stop(), []);
+  const start = react.useCallback(async () => {
+    const running = callRef.current;
+    if (running && (running.state === "connecting" || running.state === "active")) return;
+    setTranscript([]);
+    setAgentSpeaking(false);
+    setMutedState(false);
+    setLevel(0);
+    setCallId(null);
+    setEndReason(null);
+    setError(null);
+    const rest = { ...optionsRef.current };
+    delete rest.getAccessToken;
+    const call = new DialgemCall({ ...rest, accessToken: () => optionsRef.current.getAccessToken() });
+    callRef.current = call;
+    call.on("state", setState);
+    call.on("started", (e) => setCallId(e.callId));
+    call.on("agent_speaking", (e) => setAgentSpeaking(e.speaking));
+    call.on("level", (e) => setLevel(e.level));
+    call.on("ended", (e) => setEndReason(e.reason));
+    call.on("error", setError);
+    call.on(
+      "transcript",
+      (t) => setTranscript((lines) => {
+        const last = lines[lines.length - 1];
+        if (last && last.role === t.role && !last.final && t.role === "user") {
+          return [...lines.slice(0, -1), { ...last, text: t.text, final: t.final }];
+        }
+        return [...lines, { id: nextId.current++, role: t.role, text: t.text, final: t.final }];
+      })
+    );
+    try {
+      await call.start();
+    } catch {
+    }
+  }, []);
+  const stop = react.useCallback(() => callRef.current?.stop(), []);
+  const setMuted = react.useCallback((m) => {
+    callRef.current?.setMuted(m);
+    setMutedState(m);
+  }, []);
+  return { state, transcript, agentSpeaking, muted, level, callId, endReason, error, start, stop, setMuted };
+}
+
+exports.useDialgemCall = useDialgemCall;
+//# sourceMappingURL=react.cjs.map
+//# sourceMappingURL=react.cjs.map