@keyframelabs/elements 0.2.1 → 0.4.0

package/dist/index.js

@@ -1,60 +1,60 @@
-import { createClient as f } from "@keyframelabs/sdk";
-const o = 24e3;
-function m(i) {
-  const e = atob(i), t = new Uint8Array(e.length);
-  for (let s = 0; s < e.length; s++)
-    t[s] = e.charCodeAt(s);
+import { createClient as v } from "@keyframelabs/sdk";
+const u = 24e3;
+function w(s) {
+  const e = atob(s), t = new Uint8Array(e.length);
+  for (let i = 0; i < e.length; i++)
+    t[i] = e.charCodeAt(i);
   return t;
 }
-function g(i) {
+function y(s) {
   let e = "";
-  for (let t = 0; t < i.length; t++)
-    e += String.fromCharCode(i[t]);
+  for (let t = 0; t < s.length; t++)
+    e += String.fromCharCode(s[t]);
   return btoa(e);
 }
-function h(i, e, t) {
+function g(s, e, t) {
   if (e === t)
-    return i;
-  const s = new Int16Array(i.buffer, i.byteOffset, i.length / 2), n = e / t, a = Math.floor(s.length / n), d = new Int16Array(a);
-  for (let r = 0; r < a; r++) {
-    const _ = r * n, p = Math.floor(_), b = Math.min(p + 1, s.length - 1), v = _ - p;
-    d[r] = Math.round(
-      s[p] * (1 - v) + s[b] * v
+    return s;
+  const i = new Int16Array(s.buffer, s.byteOffset, s.length / 2), n = e / t, o = Math.floor(i.length / n), r = new Int16Array(o);
+  for (let l = 0; l < o; l++) {
+    const a = l * n, c = Math.floor(a), C = Math.min(c + 1, i.length - 1), m = a - c;
+    r[l] = Math.round(
+      i[c] * (1 - m) + i[C] * m
     );
   }
-  return new Uint8Array(d.buffer);
+  return new Uint8Array(r.buffer);
 }
-function E() {
-  const i = /* @__PURE__ */ new Map();
+function x() {
+  const s = /* @__PURE__ */ new Map();
   return {
     on(e, t) {
-      i.has(e) || i.set(e, /* @__PURE__ */ new Set()), i.get(e).add(t);
+      s.has(e) || s.set(e, /* @__PURE__ */ new Set()), s.get(e).add(t);
     },
     off(e, t) {
-      i.get(e)?.delete(t);
+      s.get(e)?.delete(t);
     },
     emit(e, t) {
-      i.get(e)?.forEach((s) => s(t));
+      s.get(e)?.forEach((i) => i(t));
     },
     removeAllListeners() {
-      i.clear();
+      s.clear();
     }
   };
 }
-function w(i) {
-  const e = new Int16Array(i.length);
-  for (let t = 0; t < i.length; t++) {
-    const s = Math.max(-1, Math.min(1, i[t]));
-    e[t] = s < 0 ? s * 32768 : s * 32767;
+function E(s) {
+  const e = new Int16Array(s.length);
+  for (let t = 0; t < s.length; t++) {
+    const i = Math.max(-1, Math.min(1, s[t]));
+    e[t] = i < 0 ? i * 32768 : i * 32767;
   }
   return new Uint8Array(e.buffer);
 }
-const C = 16e3;
-class u {
+const A = 16e3;
+class S {
   ws = null;
   _state = "idle";
-  events = E();
-  inputSampleRate = C;
+  events = x();
+  inputSampleRate = A;
   /** Current agent state */
   get state() {
     return this._state;
@@ -113,84 +113,8 @@ class u {
     this.events.emit("closed", { code: e, reason: t });
   }
 }
-const k = "gemini-2.5-flash-native-audio-preview-12-2025", A = "wss://generativelanguage.googleapis.com/ws/google.ai.generativelanguage.v1beta.GenerativeService.BidiGenerateContent", I = "wss://generativelanguage.googleapis.com/ws/google.ai.generativelanguage.v1alpha.GenerativeService.BidiGenerateContentConstrained";
-class R extends u {
-  agentName = "GeminiLive";
-  async connect(e) {
-    if (this.ws)
-      throw new Error("Already connected");
-    if (!e.apiKey)
-      throw new Error("Gemini API key is required");
-    e.inputSampleRate && (this.inputSampleRate = e.inputSampleRate);
-    const t = e.model ?? k, n = (e.authType ?? "api_key") === "ephemeral_token" ? `${I}?access_token=${encodeURIComponent(e.apiKey)}` : `${A}?key=${encodeURIComponent(e.apiKey)}`;
-    return new Promise((a, d) => {
-      this.ws = new WebSocket(n), this.ws.onopen = () => {
-        const r = {
-          setup: {
-            model: `models/${t}`,
-            generationConfig: {
-              responseModalities: ["AUDIO"]
-            },
-            systemInstruction: e.systemPrompt ? { parts: [{ text: e.systemPrompt }] } : void 0
-          }
-        };
-        this.ws.send(JSON.stringify(r)), this.setState("listening"), a();
-      }, this.ws.onerror = () => {
-        d(new Error("Failed to connect to Gemini Live"));
-      }, this.ws.onclose = (r) => {
-        this.ws = null, this.setState("idle"), this.emitClosed(r.code, r.reason);
-      }, this.ws.onmessage = (r) => {
-        this.handleMessage(r.data);
-      };
-    });
-  }
-  handleParsedMessage(e) {
-    const s = e.serverContent;
-    if (s) {
-      if (s.interrupted) {
-        this.events.emit("interrupted", void 0), this.setState("listening");
-        return;
-      }
-      if (s.turnComplete) {
-        this.events.emit("turnEnd", void 0), this.setState("listening");
-        return;
-      }
-      if (s.modelTurn?.parts) {
-        this._state !== "speaking" && (this.events.emit("turnStart", void 0), this.setState("speaking"));
-        for (const n of s.modelTurn.parts) {
-          if (n.inlineData?.data) {
-            const a = m(n.inlineData.data);
-            this.events.emit("audio", a);
-          }
-          n.text && this.events.emit("transcript", {
-            role: "assistant",
-            text: n.text,
-            isFinal: !0
-          });
-        }
-      }
-    }
-  }
-  sendAudio(e) {
-    if (!this.ws || this.ws.readyState !== WebSocket.OPEN) {
-      console.warn("[GeminiLive] Cannot send audio: not connected");
-      return;
-    }
-    const t = {
-      realtimeInput: {
-        mediaChunks: [
-          {
-            mimeType: `audio/pcm;rate=${this.inputSampleRate}`,
-            data: g(e)
-          }
-        ]
-      }
-    };
-    this.ws.send(JSON.stringify(t));
-  }
-}
-const M = ["neutral", "angry", "sad", "happy"], T = "wss://api.elevenlabs.io/v1/convai/conversation";
-class S extends u {
+const I = ["neutral", "angry", "sad", "happy"], T = "wss://api.elevenlabs.io/v1/convai/conversation";
+class M extends S {
   agentName = "ElevenLabs";
   outputSampleRate = 24e3;
   // Default, updated from metadata
@@ -215,15 +139,15 @@ class S extends u {
       throw new Error("ElevenLabs agent ID or signed URL is required");
     e.inputSampleRate && (this.sourceInputSampleRate = e.inputSampleRate);
     let t;
-    return e.signedUrl ? t = e.signedUrl : (t = `${T}?agent_id=${e.agentId}`, e.apiKey && (t += `&xi-api-key=${e.apiKey}`)), new Promise((s, n) => {
+    return e.signedUrl ? t = e.signedUrl : (t = `${T}?agent_id=${e.agentId}`, e.apiKey && (t += `&xi-api-key=${e.apiKey}`)), new Promise((i, n) => {
       this.ws = new WebSocket(t), this.ws.onopen = () => {
-        this.setState("listening"), s();
+        this.setState("listening"), i();
       }, this.ws.onerror = () => {
         n(new Error("Failed to connect to ElevenLabs"));
-      }, this.ws.onclose = (a) => {
-        this.ws = null, this.setState("idle"), this.emitClosed(a.code, a.reason);
-      }, this.ws.onmessage = (a) => {
-        this.handleMessage(a.data);
+      }, this.ws.onclose = (o) => {
+        this.ws = null, this.setState("idle"), this.emitClosed(o.code, o.reason);
+      }, this.ws.onmessage = (o) => {
+        this.handleMessage(o.data);
       };
     });
   }
@@ -260,12 +184,12 @@ class S extends u {
     const t = e.conversation_initiation_metadata_event;
     if (t) {
       if (t.agent_output_audio_format) {
-        const s = t.agent_output_audio_format.match(/pcm_(\d+)/);
-        s && (this.outputSampleRate = parseInt(s[1], 10));
+        const i = t.agent_output_audio_format.match(/pcm_(\d+)/);
+        i && (this.outputSampleRate = parseInt(i[1], 10));
       }
       if (t.user_input_audio_format) {
-        const s = t.user_input_audio_format.match(/pcm_(\d+)/);
-        s && (this.expectedInputSampleRate = parseInt(s[1], 10));
+        const i = t.user_input_audio_format.match(/pcm_(\d+)/);
+        i && (this.expectedInputSampleRate = parseInt(i[1], 10));
       }
       this.initialized = !0;
     }
@@ -281,11 +205,11 @@ class S extends u {
     if (!t?.audio_base_64 || (t.event_id ?? 0) <= this.lastInterruptId)
       return;
     this._state !== "speaking" && (this.events.emit("turnStart", void 0), this.setState("speaking"));
-    let n = m(t.audio_base_64);
-    this.outputSampleRate !== o && (n = h(n, this.outputSampleRate, o)), this.events.emit("audio", n);
-    const a = n.length / 2 / o * 1e3;
-    this.turnStartTime === 0 && (this.turnStartTime = Date.now()), this.accumulatedDurationMs += a, console.debug(
-      `[ElevenLabs] audio chunk: ${n.length} bytes, +${a.toFixed(0)}ms, totalDuration=${this.accumulatedDurationMs.toFixed(0)}ms, agentResponse=${this.agentResponseReceived}`
+    let n = w(t.audio_base_64);
+    this.outputSampleRate !== u && (n = g(n, this.outputSampleRate, u)), this.events.emit("audio", n);
+    const o = n.length / 2 / u * 1e3;
+    this.turnStartTime === 0 && (this.turnStartTime = Date.now()), this.accumulatedDurationMs += o, console.debug(
+      `[ElevenLabs] audio chunk: ${n.length} bytes, +${o.toFixed(0)}ms, totalDuration=${this.accumulatedDurationMs.toFixed(0)}ms, agentResponse=${this.agentResponseReceived}`
     ), this.scheduleVirtualBufferCheck();
   }
   handleUserTranscript(e) {
@@ -328,8 +252,8 @@ class S extends u {
     const t = e.client_tool_call;
     if (t) {
       if (t.tool_name === "set_emotion") {
-        const s = t.parameters?.emotion?.toLowerCase();
-        s && M.includes(s) && this.events.emit("emotion", s);
+        const i = t.parameters?.emotion?.toLowerCase();
+        i && I.includes(i) && this.events.emit("emotion", i);
       }
       this.ws && this.ws.readyState === WebSocket.OPEN && this.ws.send(JSON.stringify({
         type: "client_tool_result",
@@ -349,8 +273,8 @@ class S extends u {
     if (!this.ws || this.ws.readyState !== WebSocket.OPEN || !this.initialized)
       return;
     let t = e;
-    this.sourceInputSampleRate !== this.expectedInputSampleRate && (t = h(e, this.sourceInputSampleRate, this.expectedInputSampleRate)), this.ws.send(JSON.stringify({
-      user_audio_chunk: g(t)
+    this.sourceInputSampleRate !== this.expectedInputSampleRate && (t = g(e, this.sourceInputSampleRate, this.expectedInputSampleRate)), this.ws.send(JSON.stringify({
+      user_audio_chunk: y(t)
     }));
   }
   /**
@@ -383,214 +307,253 @@ class S extends u {
     this.initialized = !1, this.lastInterruptId = 0, this.resetTurnState(), super.close();
   }
 }
-const x = "wss://api.cartesia.ai/agents/stream", P = "2025-04-16";
-class D extends u {
-  agentName = "Cartesia";
-  // Audio configuration
-  cartesiaInputFormat = "pcm_16000";
-  // Format we tell Cartesia we are sending
-  cartesiaOutputRate = 16e3;
-  // Cartesia defaults to 16kHz for web
-  // Connection state
-  streamId = null;
-  isReady = !1;
-  pingInterval = null;
+const R = ["neutral", "angry", "sad", "happy"], O = "wss://api.openai.com/v1/realtime", N = "gpt-realtime", p = 24e3, B = {
+  type: "function",
+  name: "set_emotion",
+  description: "Set the emotional expression of the avatar. Call this on every turn to reflect the tone of your response.",
+  parameters: {
+    type: "object",
+    properties: {
+      emotion: {
+        type: "string",
+        enum: ["neutral", "angry", "sad", "happy"],
+        description: "The emotion to display"
+      }
+    },
+    required: ["emotion"]
+  }
+};
+class L extends S {
+  agentName = "OpenAIRealtime";
+  connectResolve = null;
+  connectReject = null;
+  connectTimeout = null;
+  initialSessionUpdate = null;
+  currentResponseHasAudio = !1;
+  currentTranscript = "";
+  handledFunctionCallIds = /* @__PURE__ */ new Set();
+  sourceInputSampleRate = 16e3;
+  pendingFunctionCallStartedAtMs = null;
+  pendingFunctionCallNames = [];
   async connect(e) {
     if (this.ws)
       throw new Error("Already connected");
-    if (!e.agentId)
-      throw new Error("Cartesia Agent ID is required");
     if (!e.apiKey)
-      throw new Error("Cartesia API Key is required");
-    e.inputSampleRate && (this.inputSampleRate = e.inputSampleRate), this.inputSampleRate === 16e3 ? this.cartesiaInputFormat = "pcm_16000" : this.inputSampleRate === 24e3 ? this.cartesiaInputFormat = "pcm_24000" : this.inputSampleRate === 44100 ? this.cartesiaInputFormat = "pcm_44100" : this.cartesiaInputFormat = "pcm_16000";
-    const t = `${x}/${e.agentId}?api_key=${e.apiKey}&cartesia_version=${P}`;
-    return new Promise((s, n) => {
-      this.ws = new WebSocket(t), this.ws.onopen = () => {
-        this.sendStartEvent(), this.startHeartbeat(), s();
+      throw new Error("OpenAI Realtime token is required");
+    e.inputSampleRate && (this.sourceInputSampleRate = e.inputSampleRate);
+    const t = e.model ?? N;
+    return this.initialSessionUpdate = this.buildSessionUpdate(e, t), new Promise((i, n) => {
+      this.connectResolve = i, this.connectReject = n, this.connectTimeout = setTimeout(() => {
+        this.rejectPendingConnect(new Error("Timed out waiting for OpenAI Realtime session setup")), this.close();
+      }, 1e4), this.ws = new WebSocket(
+        `${O}?model=${encodeURIComponent(t)}`,
+        ["realtime", `openai-insecure-api-key.${e.apiKey}`]
+      ), this.ws.onopen = () => {
       }, this.ws.onerror = () => {
-        n(new Error("Failed to connect to Cartesia"));
-      }, this.ws.onclose = (a) => {
-        this.stopHeartbeat(), this.ws = null, this.isReady = !1, this.streamId = null, this.setState("idle"), this.emitClosed(a.code, a.reason);
-      }, this.ws.onmessage = (a) => {
-        this.handleMessage(a.data);
+        this.rejectPendingConnect(new Error("Failed to connect to OpenAI Realtime"));
+      }, this.ws.onclose = (o) => {
+        if (this.clearConnectTimeout(), this.connectReject) {
+          const r = o.reason ? `: ${o.reason}` : "";
+          this.rejectPendingConnect(new Error(`OpenAI Realtime closed before initialization (${o.code}${r})`));
+        }
+        this.resetTurnState(), this.initialSessionUpdate = null, this.ws = null, this.setState("idle"), this.emitClosed(o.code, o.reason);
+      }, this.ws.onmessage = (o) => {
+        this.handleMessage(o.data);
       };
     });
   }
-  sendStartEvent() {
-    if (!this.ws) return;
-    const e = {
-      event: "start",
-      config: {
-        input_format: this.cartesiaInputFormat
-      }
-    };
-    this.ws.send(JSON.stringify(e));
-  }
-  /**
-   * Keep connection alive with periodic custom events.
-   * Cartesia requires activity every 30s.
-   */
-  startHeartbeat() {
-    this.pingInterval = window.setInterval(() => {
-      this.ws?.readyState === WebSocket.OPEN && this.streamId && this.ws.send(JSON.stringify({
-        event: "custom",
-        stream_id: this.streamId,
-        metadata: { keepalive: !0 }
-      }));
-    }, 2e4);
-  }
-  stopHeartbeat() {
-    this.pingInterval && (clearInterval(this.pingInterval), this.pingInterval = null);
-  }
   handleParsedMessage(e) {
     const t = e;
-    switch (t.event) {
-      case "ack":
-        this.handleAck(t);
+    switch (t.type) {
+      case "session.created":
+        this.sendInitialSessionUpdate();
         break;
-      case "media_output":
-        this.handleMediaOutput(t);
+      case "session.updated":
+        this.clearConnectTimeout(), this.setState("listening"), this.resolvePendingConnect();
         break;
-      case "clear":
-        this.handleClear();
+      case "response.output_audio.delta":
+      case "response.audio.delta":
+        if (!t.delta)
+          return;
+        if (!this.currentResponseHasAudio) {
+          if (this.pendingFunctionCallStartedAtMs !== null) {
+            const i = performance.now() - this.pendingFunctionCallStartedAtMs;
+            console.debug("[OpenAIRealtime] Function call latency", {
+              calls: this.pendingFunctionCallNames,
+              latencyMs: Math.round(i)
+            }), this.pendingFunctionCallStartedAtMs = null, this.pendingFunctionCallNames = [];
+          }
+          this.currentResponseHasAudio = !0, this.events.emit("turnStart", void 0), this.setState("speaking");
+        }
+        this.events.emit("audio", w(t.delta));
+        break;
+      case "response.output_audio_transcript.delta":
+        if (!t.delta)
+          return;
+        this.currentTranscript += t.delta, this.events.emit("transcript", {
+          role: "assistant",
+          text: this.currentTranscript,
+          isFinal: !1
+        });
+        break;
+      case "response.output_audio_transcript.done":
+        if (!t.transcript)
+          return;
+        this.currentTranscript = t.transcript, this.events.emit("transcript", {
+          role: "assistant",
+          text: t.transcript,
+          isFinal: !0
+        });
+        break;
+      case "input_audio_buffer.speech_started":
+        this.resetTurnState(), this.events.emit("interrupted", void 0), this.setState("listening");
+        break;
+      case "response.done":
+        this.handleResponseDone(t.response);
         break;
-      case "error":
-        console.error("[Cartesia] Server error:", t);
+      case "error": {
+        const i = t.error?.message ?? t.message ?? "Unknown OpenAI Realtime error";
+        this.rejectPendingConnect(new Error(i)), console.error("[OpenAIRealtime] Server error:", t);
         break;
+      }
     }
   }
-  handleAck(e) {
-    this.streamId = e.stream_id || null, this.isReady = !0, this.setState("listening");
-  }
-  handleMediaOutput(e) {
-    if (!e.media?.payload) return;
-    this._state !== "speaking" && (this.events.emit("turnStart", void 0), this.setState("speaking"));
-    let t = m(e.media.payload);
-    this.cartesiaOutputRate !== o && (t = h(t, this.cartesiaOutputRate, o)), this.events.emit("audio", t);
-  }
-  handleClear() {
-    this.events.emit("interrupted", void 0), this.setState("listening");
-  }
   sendAudio(e) {
-    if (!this.ws || this.ws.readyState !== WebSocket.OPEN || !this.isReady || !this.streamId)
+    if (!this.ws || this.ws.readyState !== WebSocket.OPEN) {
+      console.warn("[OpenAIRealtime] Cannot send audio: not connected");
       return;
+    }
     let t = e;
-    const s = parseInt(this.cartesiaInputFormat.split("_")[1]);
-    this.inputSampleRate !== s && (t = h(e, this.inputSampleRate, s)), this.ws.send(JSON.stringify({
-      event: "media_input",
-      stream_id: this.streamId,
-      media: {
-        payload: g(t)
-      }
+    this.sourceInputSampleRate !== p && (t = g(e, this.sourceInputSampleRate, p)), this.ws.send(JSON.stringify({
+      type: "input_audio_buffer.append",
+      audio: y(t)
     }));
   }
   close() {
-    this.stopHeartbeat(), this.isReady = !1, this.streamId = null, super.close();
+    this.rejectPendingConnect(new Error("Connection closed")), this.clearConnectTimeout(), this.resetTurnState(), this.initialSessionUpdate = null, this.handledFunctionCallIds.clear(), super.close();
+  }
+  buildSessionUpdate(e, t) {
+    const i = e.turnDetection ?? { type: "semantic_vad", eagerness: "high" };
+    return {
+      type: "session.update",
+      session: {
+        type: "realtime",
+        model: t,
+        output_modalities: ["audio"],
+        instructions: e.systemPrompt,
+        audio: {
+          input: {
+            format: {
+              type: "audio/pcm",
+              rate: p
+            },
+            turn_detection: i
+          },
+          output: {
+            format: {
+              type: "audio/pcm",
+              rate: u
+            },
+            ...e.voice ? { voice: e.voice } : {}
+          }
+        },
+        tools: [B],
+        tool_choice: "auto"
+      }
+    };
   }
-}
-class O extends u {
-  agentName = "Vapi";
-  // Audio configuration - Vapi uses 16kHz PCM by default
-  vapiSampleRate = 16e3;
-  async connect(e) {
-    if (this.ws)
-      throw new Error("Already connected");
-    if (!e.signedUrl)
-      throw new Error("Vapi signed URL is required");
-    return e.inputSampleRate && (this.inputSampleRate = e.inputSampleRate), new Promise((t, s) => {
-      this.ws = new WebSocket(e.signedUrl), this.ws.binaryType = "arraybuffer", this.ws.onopen = () => {
-        this.setState("listening"), t();
-      }, this.ws.onerror = () => {
-        s(new Error("Failed to connect to Vapi"));
-      }, this.ws.onclose = (n) => {
-        this.ws = null, this.setState("idle"), this.emitClosed(n.code, n.reason);
-      }, this.ws.onmessage = (n) => {
-        n.data instanceof ArrayBuffer ? this.handleBinaryAudio(n.data) : this.handleMessage(n.data);
-      };
-    });
+  sendInitialSessionUpdate() {
+    this.initialSessionUpdate && this.sendEvent(this.initialSessionUpdate);
   }
-  /**
-   * Handle binary audio data from Vapi.
-   * Vapi sends raw PCM 16-bit little-endian audio.
-   */
-  handleBinaryAudio(e) {
-    this._state !== "speaking" && (this.events.emit("turnStart", void 0), this.setState("speaking"));
-    const t = new Uint8Array(e), s = this.vapiSampleRate !== o ? h(t, this.vapiSampleRate, o) : t;
-    this.events.emit("audio", s);
+  handleResponseDone(e) {
+    if (!e?.output?.length) {
+      this.currentResponseHasAudio && this.finishAudioTurn();
+      return;
+    }
+    const t = e.output.filter(D);
+    if (t.length > 0) {
+      this.handleFunctionCalls(t);
+      return;
+    }
+    this.currentResponseHasAudio && this.finishAudioTurn();
+  }
+  handleFunctionCalls(e) {
+    let t = !1;
+    const i = [];
+    for (const n of e) {
+      if (!n.call_id || this.handledFunctionCallIds.has(n.call_id))
+        continue;
+      this.handledFunctionCallIds.add(n.call_id), i.push(n.name ?? "unknown");
+      const o = this.handleFunctionCall(n);
+      this.sendEvent({
+        type: "conversation.item.create",
+        item: {
+          type: "function_call_output",
+          call_id: n.call_id,
+          output: JSON.stringify(o)
+        }
+      }), t = !0;
+    }
+    t && (this.pendingFunctionCallStartedAtMs = performance.now(), this.pendingFunctionCallNames = i, console.debug("[OpenAIRealtime] Function call received", {
+      calls: i
+    }), this.sendEvent({ type: "response.create" }));
   }
-  handleParsedMessage(e) {
-    const t = e;
-    switch (t.type) {
-      case "conversation-update":
-        t.role === "user" && t.transcript ? this.events.emit("transcript", {
-          role: "user",
-          text: t.transcript,
-          isFinal: !0
-        }) : t.role === "assistant" && t.transcript && this.events.emit("transcript", {
-          role: "assistant",
-          text: t.transcript,
-          isFinal: !0
-        });
-        break;
-      case "speech-update":
-        t.status === "started" ? (this.events.emit("turnStart", void 0), this.setState("speaking")) : t.status === "stopped" && (this.events.emit("turnEnd", void 0), this.setState("listening"));
-        break;
-      case "transcript":
-        this.events.emit("transcript", {
-          role: t.role === "user" ? "user" : "assistant",
-          text: t.transcript || "",
-          isFinal: t.transcriptType === "final"
-        });
-        break;
-      case "hang":
-      case "end-of-call-report":
-        this.events.emit("turnEnd", void 0), this.setState("idle");
-        break;
-      case "error":
-        console.error("[Vapi] Server error:", t);
-        break;
+  handleFunctionCall(e) {
+    if (e.name !== "set_emotion")
+      return { error: `Unsupported function: ${e.name}` };
+    try {
+      const i = (e.arguments ? JSON.parse(e.arguments) : {}).emotion?.toLowerCase();
+      return i && R.includes(i) ? (this.events.emit("emotion", i), { result: "ok" }) : { error: "Invalid emotion" };
+    } catch {
+      return { error: "Invalid function arguments" };
     }
   }
-  sendAudio(e) {
-    if (!this.ws || this.ws.readyState !== WebSocket.OPEN)
+  finishAudioTurn() {
+    this.resetTurnState(), this.events.emit("turnEnd", void 0), this.setState("listening");
+  }
+  resetTurnState() {
+    this.currentResponseHasAudio = !1, this.currentTranscript = "";
+  }
+  sendEvent(e) {
+    !this.ws || this.ws.readyState !== WebSocket.OPEN || this.ws.send(JSON.stringify(e));
+  }
+  resolvePendingConnect() {
+    if (!this.connectResolve)
       return;
-    let t = e;
-    this.inputSampleRate !== this.vapiSampleRate && (t = h(e, this.inputSampleRate, this.vapiSampleRate)), this.ws.send(t.buffer);
+    const e = this.connectResolve;
+    this.connectResolve = null, this.connectReject = null, e();
   }
-  /**
-   * Send a control message to end the call.
-   */
-  hangup() {
-    this.ws && this.ws.readyState === WebSocket.OPEN && this.ws.send(JSON.stringify({ type: "end-call" }));
+  rejectPendingConnect(e) {
+    if (!this.connectReject)
+      return;
+    const t = this.connectReject;
+    this.connectResolve = null, this.connectReject = null, t(e);
   }
-  close() {
-    this.hangup(), super.close();
+  clearConnectTimeout() {
+    this.connectTimeout !== null && (clearTimeout(this.connectTimeout), this.connectTimeout = null);
   }
 }
-const N = [
-  { id: "gemini", name: "Gemini Live", description: "Google Gemini Live API" },
+function D(s) {
+  return s.type === "function_call";
+}
+const j = [
   { id: "elevenlabs", name: "ElevenLabs", description: "ElevenLabs Conversational AI" },
-  { id: "cartesia", name: "Cartesia", description: "Cartesia Agents API" },
-  { id: "vapi", name: "Vapi", description: "Vapi WebSocket Transport" }
+  { id: "openai", name: "OpenAI Realtime", description: "OpenAI Realtime API" }
 ];
-function y(i) {
-  switch (i) {
-    case "gemini":
-      return new R();
+function k(s) {
+  switch (s) {
     case "elevenlabs":
-      return new S();
-    case "cartesia":
-      return new D();
-    case "vapi":
-      return new O();
+      return new M();
+    case "openai":
+      return new L();
     default:
-      throw new Error(`Unknown agent type: ${i}`);
+      throw new Error(`Unknown agent type: ${s}`);
   }
 }
-function F(i) {
-  return N.find((e) => e.id === i);
+function X(s) {
+  return j.find((e) => e.id === s);
 }
-class L extends Error {
+class F extends Error {
   status;
   payload;
   url;
@@ -598,8 +561,8 @@ class L extends Error {
     super(e.message), this.name = "ApiError", this.status = e.status, this.payload = e.payload, this.url = e.url;
   }
 }
-const l = /* @__PURE__ */ new Set();
-class $ {
+const d = /* @__PURE__ */ new Set();
+class P {
   apiBaseUrl;
   publishableKey;
   callbacks;
@@ -643,31 +606,31 @@ class $ {
   }
   /** Connect to the embed session */
   async connect() {
-    if (l.has(this.publishableKey)) {
+    if (d.has(this.publishableKey)) {
       console.log("[PersonaEmbed] Connection already in progress, skipping");
       return;
     }
-    l.add(this.publishableKey), this.mounted = !0, this.abortController = new AbortController(), this.setStatus("connecting");
+    d.add(this.publishableKey), this.mounted = !0, this.abortController = new AbortController(), this.setStatus("connecting");
     try {
       const e = await this.fetchSession(this.abortController.signal);
       if (!this.mounted) {
-        l.delete(this.publishableKey);
+        d.delete(this.publishableKey);
         return;
       }
       if (await this.initSession(e), await this.initMicrophone(), await this.connectAgent(e.voice_agent_details), !this.mounted) {
-        this.cleanup(), l.delete(this.publishableKey);
+        this.cleanup(), d.delete(this.publishableKey);
         return;
       }
       this.setStatus("connected");
     } catch (e) {
-      if (l.delete(this.publishableKey), e instanceof Error && e.name === "AbortError")
+      if (d.delete(this.publishableKey), e instanceof Error && e.name === "AbortError")
         return;
       console.error("[PersonaEmbed]", e), this.mounted && (this.setStatus("error"), this.callbacks.onError?.(e));
     }
   }
   /** Disconnect and cleanup */
   disconnect() {
-    this.mounted = !1, this.abortController?.abort(), this.abortController = null, l.delete(this.publishableKey), this.cleanup(), this.setStatus("disconnected");
+    this.mounted = !1, this.abortController?.abort(), this.abortController = null, d.delete(this.publishableKey), this.cleanup(), this.setStatus("disconnected");
   }
   /** Toggle microphone mute */
   toggleMute() {
@@ -687,31 +650,31 @@ class $ {
       signal: e
     });
     if (!t.ok) {
-      let s;
+      let i;
       try {
-        s = await t.json();
+        i = await t.json();
       } catch {
       }
-      throw new L({
-        message: s?.message ?? "create_session failed",
+      throw new F({
+        message: i?.message ?? "create_session failed",
         status: t.status,
-        payload: s,
+        payload: i,
         url: t.url
       });
     }
     if (!t.ok) {
-      const s = await t.json().catch(() => null);
-      throw new Error(`create_session failed: ${t.status} ${JSON.stringify(s)}`);
+      const i = await t.json().catch(() => null);
+      throw new Error(`create_session failed: ${t.status} ${JSON.stringify(i)}`);
     }
     return t.json();
   }
   async initSession(e) {
-    this.session = f({
+    this.session = v({
       serverUrl: e.session_details.server_url,
       participantToken: e.session_details.participant_token,
       agentIdentity: e.session_details.agent_identity,
       onVideoTrack: (t) => {
-        console.log("[PersonaEmbed] Setting video track", t.readyState, t.enabled), this._video.srcObject = new MediaStream([t]), this._video.play().catch((s) => console.warn("[PersonaEmbed] Video play failed:", s));
+        console.log("[PersonaEmbed] Setting video track", t.readyState, t.enabled), this._video.srcObject = new MediaStream([t]), this._video.play().catch((i) => console.warn("[PersonaEmbed] Video play failed:", i));
       },
       onAudioTrack: (t) => {
         this._audio.srcObject = new MediaStream([t]), this._audio.play().catch(() => {
@@ -729,11 +692,11 @@ class $ {
       onClose: () => {
         this.mounted && this.callbacks.onDisconnect?.();
       }
-    }), this.agent = y(e.voice_agent_details.type), this.agent.on("audio", (t) => this.session?.sendAudio(t)), this.agent.on("turnEnd", () => this.session?.endAudioTurn()), this.agent.on("interrupted", () => {
+    }), this.agent = k(e.voice_agent_details.type), this.agent.on("audio", (t) => this.session?.sendAudio(t)), this.agent.on("turnEnd", () => this.session?.endAudioTurn()), this.agent.on("interrupted", () => {
       this.session?.endAudioTurn(), this.session?.interrupt();
     }), this.agent.on("closed", () => {
       this.mounted && this.callbacks.onDisconnect?.();
-    }), this.agent instanceof S && this.agent.on("emotion", (t) => this.session?.setEmotion(t)), await this.session.connect();
+    }), this.agent.on("emotion", (t) => this.session?.setEmotion(t)), await this.session.connect();
   }
   async initMicrophone() {
     this.stream = await navigator.mediaDevices.getUserMedia({
@@ -742,37 +705,32 @@ class $ {
     const e = this.audioContext.createMediaStreamSource(this.stream);
     this.processor = this.audioContext.createScriptProcessor(4096, 1, 1), this.processor.onaudioprocess = (t) => {
       if (!this._isMuted) {
-        const s = w(t.inputBuffer.getChannelData(0));
-        this.agent?.sendAudio(s);
+        const i = E(t.inputBuffer.getChannelData(0));
+        this.agent?.sendAudio(i);
       }
     }, e.connect(this.processor), this.processor.connect(this.audioContext.destination);
   }
   async connectAgent(e) {
     if (!this.agent) return;
     const t = { inputSampleRate: 16e3 };
-    e.type === "gemini" ? await this.agent.connect({
-      ...t,
-      apiKey: e.token,
-      authType: "ephemeral_token"
-    }) : e.type === "elevenlabs" ? await this.agent.connect({
+    e.type === "elevenlabs" ? await this.agent.connect({
       ...t,
       agentId: e.agent_id,
       signedUrl: e.signed_url
-    }) : e.type === "cartesia" ? await this.agent.connect({
+    }) : e.type === "openai" && await this.agent.connect({
       ...t,
-      agentId: e.agent_id,
-      apiKey: e.token
-    }) : e.type === "vapi" && await this.agent.connect({
-      ...t,
-      signedUrl: e.signed_url
+      apiKey: e.token,
+      systemPrompt: e.system_prompt,
+      voice: e.voice,
+      turnDetection: e.turn_detection
     });
   }
   cleanup() {
     this.stream?.getTracks().forEach((e) => e.stop()), this.processor?.disconnect(), this.audioContext?.close(), this.agent?.close(), this.session?.close(), this.stream = null, this.processor = null, this.audioContext = null, this.agent = null, this.session = null;
   }
 }
-const c = /* @__PURE__ */ new Set();
-class B {
+const h = /* @__PURE__ */ new Set();
+class Q {
   voiceAgentDetails;
   sessionDetails;
   callbacks;
@@ -816,24 +774,24 @@ class B {
   }
   /** Connect to the session */
   async connect() {
-    if (c.has(this.connectionId)) {
+    if (h.has(this.connectionId)) {
       console.log("[PersonaView] Connection already in progress, skipping");
       return;
     }
-    c.add(this.connectionId), this.mounted = !0, this.setStatus("connecting");
+    h.add(this.connectionId), this.mounted = !0, this.setStatus("connecting");
     try {
       if (await this.initSession(), await this.initMicrophone(), await this.connectAgent(), !this.mounted) {
-        this.cleanup(), c.delete(this.connectionId);
+        this.cleanup(), h.delete(this.connectionId);
         return;
       }
       this.setStatus("connected");
     } catch (e) {
-      c.delete(this.connectionId), console.error("[PersonaView]", e), this.mounted && (this.setStatus("error"), this.callbacks.onError?.(e));
+      h.delete(this.connectionId), console.error("[PersonaView]", e), this.mounted && (this.setStatus("error"), this.callbacks.onError?.(e));
     }
   }
   /** Disconnect and cleanup */
   disconnect() {
-    this.mounted = !1, c.delete(this.connectionId), this.cleanup(), this.setStatus("disconnected");
+    this.mounted = !1, h.delete(this.connectionId), this.cleanup(), this.setStatus("disconnected");
   }
   /** Toggle microphone mute */
   toggleMute() {
@@ -846,7 +804,7 @@ class B {
     this._agentState !== e && (this._agentState = e, this.callbacks.onAgentStateChange?.(e));
   }
   async initSession() {
-    this.session = f({
+    this.session = v({
       serverUrl: this.sessionDetails.server_url,
       participantToken: this.sessionDetails.participant_token,
       agentIdentity: this.sessionDetails.agent_identity,
@@ -869,11 +827,11 @@ class B {
       onClose: () => {
         this.mounted && this.callbacks.onDisconnect?.();
       }
-    }), this.agent = y(this.voiceAgentDetails.type), this.agent.on("audio", (e) => this.session?.sendAudio(e)), this.agent.on("turnEnd", () => this.session?.endAudioTurn()), this.agent.on("interrupted", () => {
+    }), this.agent = k(this.voiceAgentDetails.type), this.agent.on("audio", (e) => this.session?.sendAudio(e)), this.agent.on("turnEnd", () => this.session?.endAudioTurn()), this.agent.on("interrupted", () => {
       this.session?.endAudioTurn(), this.session?.interrupt();
     }), this.agent.on("closed", () => {
       this.mounted && this.callbacks.onDisconnect?.();
-    }), this.agent instanceof S && this.agent.on("emotion", (e) => this.session?.setEmotion(e)), await this.session.connect();
+    }), this.agent.on("emotion", (e) => this.session?.setEmotion(e)), await this.session.connect();
   }
   async initMicrophone() {
     this.stream = await navigator.mediaDevices.getUserMedia({
@@ -882,50 +840,498 @@ class B {
     const e = this.audioContext.createMediaStreamSource(this.stream);
     this.processor = this.audioContext.createScriptProcessor(4096, 1, 1), this.processor.onaudioprocess = (t) => {
       if (!this._isMuted) {
-        const s = w(t.inputBuffer.getChannelData(0));
-        this.agent?.sendAudio(s);
+        const i = E(t.inputBuffer.getChannelData(0));
+        this.agent?.sendAudio(i);
       }
     }, e.connect(this.processor), this.processor.connect(this.audioContext.destination);
   }
   async connectAgent() {
     if (!this.agent) return;
     const e = this.voiceAgentDetails, t = { inputSampleRate: 16e3 };
-    e.type === "gemini" ? await this.agent.connect({
-      ...t,
-      apiKey: e.token,
-      authType: "ephemeral_token"
-    }) : e.type === "elevenlabs" ? await this.agent.connect({
+    e.type === "elevenlabs" ? await this.agent.connect({
       ...t,
       agentId: e.agent_id,
       signedUrl: e.signed_url
-    }) : e.type === "cartesia" ? await this.agent.connect({
+    }) : e.type === "openai" && await this.agent.connect({
       ...t,
-      agentId: e.agent_id,
-      apiKey: e.token
-    }) : e.type === "vapi" && await this.agent.connect({
-      ...t,
-      signedUrl: e.signed_url
+      apiKey: e.token,
+      systemPrompt: e.system_prompt,
+      voice: e.voice,
+      turnDetection: e.turn_detection
     });
   }
   cleanup() {
     this.stream?.getTracks().forEach((e) => e.stop()), this.processor?.disconnect(), this.audioContext?.close(), this.agent?.close(), this.session?.close(), this.stream = null, this.processor = null, this.audioContext = null, this.agent = null, this.session = null;
   }
 }
+const f = ["minimized", "active", "hidden"], U = ["bottom-right", "bottom-left", "top-right", "top-left"], z = [
+  "publishable-key",
+  "api-base-url",
+  "initial-state",
+  "controlled-widget-state",
+  "active-width",
+  "active-height",
+  "minimized-width",
+  "minimized-height",
+  "inline",
+  "corner",
+  "hide-ui",
+  "show-minimize-button",
+  "controlled-show-minimize-button",
+  "button-color",
+  "button-color-opacity",
+  "video-fit",
+  "preview-image"
+], b = "https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap";
+function $() {
+  if (document.querySelector(`link[href="${b}"]`)) return;
+  const s = document.createElement("link");
+  s.rel = "stylesheet", s.href = b, document.head.appendChild(s);
+}
+const H = `
+:host {
+  display: block;
+  font-family: 'Noto Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+}
+
+.kfl-widget {
+  position: fixed;
+  z-index: 2147483647;
+  transition: width 0.2s ease, height 0.2s ease;
+}
+
+:host([inline]) .kfl-widget {
+  position: relative;
+}
+
+.kfl-widget--hidden .kfl-widget-inner {
+  display: none;
+}
+
+.kfl-reveal-btn {
+  position: absolute;
+  width: 40px;
+  height: 40px;
+  border: 1px solid rgba(255, 255, 255, 0.15);
+  background: rgba(30, 30, 30, 0.95);
+  color: rgba(255, 255, 255, 0.7);
+  cursor: pointer;
+  display: none;
+  align-items: center;
+  justify-content: center;
+  transition: background 0.15s, color 0.15s;
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
+}
+
+.kfl-reveal-btn:hover {
+  background: rgba(50, 50, 50, 0.95);
+  color: #fff;
+}
+
+.kfl-reveal-btn svg {
+  width: 16px;
+  height: 16px;
+}
+
+.kfl-reveal-btn--left {
+  border-radius: 0 50% 50% 0;
+  left: 0;
+}
+
+.kfl-reveal-btn--right {
+  border-radius: 50% 0 0 50%;
+  right: 0;
+}
+
+.kfl-widget--hidden .kfl-reveal-btn {
+  display: flex;
+}
+
+.kfl-widget-inner {
+  width: 100%;
+  height: 100%;
+  border-radius: 12px;
+  overflow: hidden;
+  position: relative;
+  background: #000;
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
+}
+
+.kfl-join-btn {
+  position: absolute;
+  bottom: 8px;
+  left: 8px;
+  right: 8px;
+  z-index: 3;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  padding: 6px 12px;
+  border-radius: 999px;
+  border: none;
+  color: #fff;
+  font-size: 12px;
+  font-weight: 500;
+  cursor: pointer;
+  transition: opacity 0.15s;
+}
+
+.kfl-join-btn:hover {
+  opacity: 0.9;
+}
+
+.kfl-join-btn svg {
+  width: 14px;
+  height: 14px;
+}
+
+.kfl-toolbar {
+  position: absolute;
+  bottom: 12px;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 3;
+  display: none;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+}
+
+.kfl-mic-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  border-radius: 9999px;
+  border: none;
+  background: rgba(0, 0, 0, 0.4);
+  backdrop-filter: blur(4px);
+  color: rgba(255, 255, 255, 0.8);
+  cursor: pointer;
+  transition: background 0.15s, color 0.15s;
+}
+
+.kfl-mic-btn:hover {
+  background: rgba(0, 0, 0, 0.6);
+  color: #fff;
+}
+
+.kfl-mic-btn svg {
+  width: 20px;
+  height: 20px;
+}
+
+.kfl-endcall-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  border-radius: 9999px;
+  border: none;
+  background-color: #dc2626;
+  color: #fff;
+  cursor: pointer;
+  box-shadow: 0 10px 15px -3px rgba(127, 29, 29, 0.2);
+  transition: background-color 0.15s, box-shadow 0.15s;
+}
+
+.kfl-endcall-btn:hover {
+  background-color: #b91c1c;
+}
+
+.kfl-endcall-btn svg {
+  width: 20px;
+  height: 20px;
+}
+
+.kfl-toggle-btn {
+  position: absolute;
+  top: 6px;
+  right: 6px;
+  z-index: 3;
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+  background: rgba(0, 0, 0, 0.4);
+  backdrop-filter: blur(4px);
+  border: none;
+  color: rgba(255, 255, 255, 0.8);
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: background 0.15s, color 0.15s;
+}
+
+.kfl-toggle-btn:hover {
+  background: rgba(0, 0, 0, 0.6);
+  color: #fff;
+}
+
+.kfl-toggle-btn svg {
+  width: 12px;
+  height: 12px;
+}
+
+.kfl-embed-container {
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+
+.kfl-preview-img {
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  pointer-events: none;
+  z-index: 1;
+}
+
+.kfl-spinner {
+  position: absolute;
+  inset: 0;
+  z-index: 2;
+  display: none;
+  align-items: center;
+  justify-content: center;
+  background: rgba(0, 0, 0, 0.3);
+}
+
+.kfl-spinner--visible {
+  display: flex;
+}
+
+.kfl-spinner-ring {
+  width: 28px;
+  height: 28px;
+  border: 2.5px solid rgba(255, 255, 255, 0.2);
+  border-top-color: #fff;
+  border-radius: 50%;
+  animation: kfl-spin 0.7s linear infinite;
+}
+
+@keyframes kfl-spin {
+  to { transform: rotate(360deg); }
+}
+
+.kfl-error-toast {
+  position: absolute;
+  bottom: 44px;
+  left: 8px;
+  right: 8px;
+  padding: 6px 10px;
+  border-radius: 8px;
+  background: rgba(220, 38, 38, 0.85);
+  backdrop-filter: blur(4px);
+  color: #fff;
+  font-size: 11px;
+  line-height: 1.4;
+  text-align: center;
+  opacity: 0;
+  transform: translateY(4px);
+  transition: opacity 0.2s, transform 0.2s;
+  pointer-events: none;
+  z-index: 5;
+}
+
+.kfl-error-toast--visible {
+  opacity: 1;
+  transform: translateY(0);
+}
+`, V = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="23 7 16 12 23 17 23 7"/><rect x="1" y="5" width="15" height="14" rx="2" ry="2"/></svg>', K = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.68 13.31a16 16 0 0 0 3.41 2.6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7 2 2 0 0 1 1.72 2v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.42 19.42 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91"/><line x1="23" y1="1" x2="1" y2="23"/></svg>', J = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="4 14 10 14 10 20"/><polyline points="20 10 14 10 14 4"/><line x1="14" y1="10" x2="21" y2="3"/><line x1="3" y1="21" x2="10" y2="14"/></svg>', W = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>', q = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"/></svg>', G = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"/></svg>', _ = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><line x1="12" x2="12" y1="19" y2="22"/></svg>', Y = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="2" x2="22" y1="2" y2="22"/><path d="M18.89 13.23A7.12 7.12 0 0 0 19 12v-2"/><path d="M5 10v2a7 7 0 0 0 12 5"/><path d="M15 9.34V5a3 3 0 0 0-5.68-1.33"/><path d="M9 9v3a3 3 0 0 0 5.12 2.12"/><line x1="12" x2="12" y1="19" y2="22"/></svg>';
+class ee extends HTMLElement {
+  static get observedAttributes() {
+    return [...z];
+  }
+  shadow;
+  embed = null;
+  _widgetState = "minimized";
+  _connected = !1;
+  _connecting = !1;
+  widgetEl;
+  innerEl;
+  containerEl;
+  previewImg;
+  spinnerEl;
+  errorToast;
+  errorTimer = null;
+  joinBtn;
+  endCallBtn;
+  toggleBtn;
+  revealBtn;
+  toolbarEl;
+  micBtn;
+  constructor() {
+    super(), this.shadow = this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    $();
+    const e = document.createElement("style");
+    e.textContent = H, this.shadow.appendChild(e), this.widgetEl = document.createElement("div"), this.widgetEl.className = "kfl-widget", this.innerEl = document.createElement("div"), this.innerEl.className = "kfl-widget-inner", this.containerEl = document.createElement("div"), this.containerEl.className = "kfl-embed-container", this.previewImg = document.createElement("img"), this.previewImg.className = "kfl-preview-img", this.previewImg.alt = "Persona preview", this.previewImg.draggable = !1;
+    const t = this.getAttribute("preview-image");
+    t ? (this.previewImg.src = t, this.previewImg.style.display = "block") : this.previewImg.style.display = "none", this.spinnerEl = document.createElement("div"), this.spinnerEl.className = "kfl-spinner", this.spinnerEl.innerHTML = '<div class="kfl-spinner-ring"></div>', this.errorToast = document.createElement("div"), this.errorToast.className = "kfl-error-toast", this.joinBtn = document.createElement("button"), this.joinBtn.className = "kfl-join-btn", this.joinBtn.innerHTML = `${V} Join call`, this.joinBtn.addEventListener("click", () => this._handleJoinCall()), this.endCallBtn = document.createElement("button"), this.endCallBtn.className = "kfl-endcall-btn", this.endCallBtn.innerHTML = K, this.endCallBtn.addEventListener("click", () => this._handleEndCall()), this.micBtn = document.createElement("button"), this.micBtn.className = "kfl-mic-btn", this.micBtn.innerHTML = _, this.micBtn.addEventListener("click", () => this._handleMicToggle()), this.toolbarEl = document.createElement("div"), this.toolbarEl.className = "kfl-toolbar", this.toolbarEl.appendChild(this.micBtn), this.toolbarEl.appendChild(this.endCallBtn), this.toggleBtn = document.createElement("button"), this.toggleBtn.className = "kfl-toggle-btn", this.toggleBtn.addEventListener("click", () => this._handleToggle()), this.revealBtn = document.createElement("button"), this.revealBtn.className = "kfl-reveal-btn", this.revealBtn.addEventListener("click", () => this._handleReveal()), this.innerEl.appendChild(this.previewImg), this.innerEl.appendChild(this.containerEl), this.innerEl.appendChild(this.spinnerEl), this.innerEl.appendChild(this.errorToast), this.innerEl.appendChild(this.joinBtn), this.innerEl.appendChild(this.toolbarEl), this.innerEl.appendChild(this.toggleBtn), this.widgetEl.appendChild(this.innerEl), this.widgetEl.appendChild(this.revealBtn), this.shadow.appendChild(this.widgetEl);
+    const i = this.getAttribute("initial-state");
+    this._widgetState = i && f.includes(i) ? i : "minimized", this._applyState();
+  }
+  disconnectedCallback() {
+    this.errorTimer && clearTimeout(this.errorTimer), this.embed?.disconnect(), this.embed = null, this._connected = !1;
+  }
+  attributeChangedCallback(e, t, i) {
+    this.widgetEl && (e === "preview-image" ? this.previewImg && (i ? (this.previewImg.src = i, this.previewImg.style.display = this._connected ? "none" : "block") : this.previewImg.style.display = "none") : e === "controlled-widget-state" && i ? (f.includes(i) && (this._widgetState = i), this._applyState()) : this._applyState());
+  }
+  // --- Public API (LemonSlice-compatible) ---
+  async mute() {
+    this.embed && (this.embed.audioElement.muted = !0);
+  }
+  async unmute() {
+    this.embed && (this.embed.audioElement.muted = !1);
+  }
+  isMuted() {
+    return this.embed?.audioElement.muted ?? !1;
+  }
+  canUnmute() {
+    return this._connected;
+  }
+  async micOn() {
+    this._connected || (this._widgetState = "active", this._applyState(), await this._connect()), this.embed && this.embed.isMuted && this.embed.toggleMute(), this._updateMicIcon();
+  }
+  async micOff() {
+    this.embed && !this.embed.isMuted && this.embed.toggleMute(), this._updateMicIcon();
+  }
+  isMicOn() {
+    return this.embed ? !this.embed.isMuted : !0;
+  }
+  canTurnOnMic() {
+    return !!this.getAttribute("publishable-key");
+  }
+  setEmotion(e) {
+    console.warn("[kfl-embed] setEmotion requires direct session access (not yet exposed by PersonaEmbed)");
+  }
+  // --- Internals ---
+  _getAttrNum(e, t) {
+    const i = this.getAttribute(e);
+    if (!i) return t;
+    const n = parseFloat(i);
+    return isNaN(n) ? t : n;
+  }
+  _getCorner() {
+    const e = this.getAttribute("corner");
+    return e && U.includes(e) ? e : "bottom-right";
+  }
+  _applyLayout() {
+    if (!this.widgetEl) return;
+    const e = this.hasAttribute("inline"), t = this._getCorner(), i = this._widgetState === "active", n = this._widgetState === "hidden", o = 40, r = n ? o : i ? this._getAttrNum("active-width", 252) : this._getAttrNum("minimized-width", 144), l = n ? o : i ? this._getAttrNum("active-height", 377) : this._getAttrNum("minimized-height", 216);
+    if (this.widgetEl.style.width = `${r}px`, this.widgetEl.style.height = `${l}px`, e)
+      this.widgetEl.style.position = "relative", this.widgetEl.style.inset = "";
+    else {
+      this.widgetEl.style.position = "fixed", this.widgetEl.style.top = "", this.widgetEl.style.bottom = "", this.widgetEl.style.left = "", this.widgetEl.style.right = "";
+      const a = "16px";
+      t.includes("bottom") && (this.widgetEl.style.bottom = a), t.includes("top") && (this.widgetEl.style.top = a), t.includes("right") && (this.widgetEl.style.right = n ? "0" : a), t.includes("left") && (this.widgetEl.style.left = n ? "0" : a);
+    }
+  }
+  _applyState() {
+    if (!this.widgetEl) return;
+    const e = this.hasAttribute("hide-ui"), t = this._shouldShowMinimizeButton(), i = this._widgetState === "minimized", n = this._widgetState === "hidden";
+    this.widgetEl.classList.toggle("kfl-widget--hidden", n), this.joinBtn.style.display = this._connected || this._connecting || e || n ? "none" : "flex", this.toolbarEl.style.display = this._connected && !e && !i && !n ? "flex" : "none", this._updateMicIcon(), this.spinnerEl.classList.toggle("kfl-spinner--visible", this._connecting && !this._connected);
+    const o = this.getAttribute("button-color") || "#919191", r = this._getAttrNum("button-color-opacity", 0.3), l = Math.round(r * 255).toString(16).padStart(2, "0");
+    this.joinBtn.style.backgroundColor = `${o}${l}`, !e && i && t ? (this.toggleBtn.style.display = "flex", this.toggleBtn.innerHTML = W) : !e && !i && !n ? (this.toggleBtn.style.display = "flex", this.toggleBtn.innerHTML = J) : this.toggleBtn.style.display = "none";
+    const a = this._getCorner(), c = a.includes("right");
+    this.revealBtn.className = `kfl-reveal-btn ${c ? "kfl-reveal-btn--right" : "kfl-reveal-btn--left"}`, this.revealBtn.innerHTML = c ? q : G, n && (this.revealBtn.style.top = "", this.revealBtn.style.bottom = "", a.includes("bottom") ? this.revealBtn.style.bottom = "16px" : this.revealBtn.style.top = "16px"), this._applyLayout();
+  }
+  _shouldShowMinimizeButton() {
+    const e = this.getAttribute("controlled-show-minimize-button");
+    return e !== null ? e !== "false" : this.getAttribute("show-minimize-button") !== "false";
+  }
+  _handleJoinCall() {
+    this._widgetState = "active", this._connecting = !0, this._applyState(), this._connect();
+  }
+  _handleToggle() {
+    if (this._widgetState === "minimized") {
+      if (this.hasAttribute("inline")) return;
+      this._widgetState = "hidden", this.dispatchEvent(new CustomEvent("widgetstatechange", { detail: { state: "hidden" } }));
+    } else this._widgetState === "active" && (this.embed?.disconnect(), this._connected = !1, this._connecting = !1, this.embed = null, this._widgetState = "minimized", this.getAttribute("preview-image") && (this.previewImg.style.display = "block"), this.dispatchEvent(new CustomEvent("widgetstatechange", { detail: { state: "minimized" } })));
+    this._applyState();
+  }
+  _handleEndCall() {
+    this._widgetState === "active" && (this.embed?.disconnect(), this._connected = !1, this._connecting = !1, this.embed = null, this._widgetState = "minimized", this.getAttribute("preview-image") && (this.previewImg.style.display = "block"), this.dispatchEvent(new CustomEvent("widgetstatechange", { detail: { state: "minimized" } })), this._applyState());
+  }
+  _handleReveal() {
+    this._widgetState = "minimized", this.dispatchEvent(new CustomEvent("widgetstatechange", { detail: { state: "minimized" } })), this._applyState();
+  }
+  _handleMicToggle() {
+    this.embed && (this.embed.toggleMute(), this._updateMicIcon());
+  }
+  _updateMicIcon() {
+    if (!this.micBtn) return;
+    const e = this.embed ? this.embed.isMuted : !1;
+    this.micBtn.innerHTML = e ? Y : _;
+  }
+  _resetToMinimized() {
+    try {
+      this.embed?.disconnect();
+    } catch (e) {
+      console.warn("[kfl-embed] Disconnect error:", e);
+    }
+    this._connected = !1, this._connecting = !1, this.embed = null, this.containerEl.innerHTML = "", this.containerEl.removeAttribute("style"), this._widgetState = "minimized", this.getAttribute("preview-image") && (this.previewImg.style.display = "block"), this._applyState();
+  }
+  _showError(e) {
+    this.errorTimer && clearTimeout(this.errorTimer), this.errorToast.textContent = e, this.errorToast.classList.add("kfl-error-toast--visible"), this.errorTimer = setTimeout(() => {
+      this.errorToast.classList.remove("kfl-error-toast--visible"), this.errorTimer = null;
+    }, 4e3);
+  }
+  async _connect() {
+    const e = this.getAttribute("publishable-key");
+    if (!e) {
+      console.error("[kfl-embed] publishable-key attribute is required"), this._resetToMinimized(), this._showError("Missing publishable key");
+      return;
+    }
+    if (this._connected || this.embed) return;
+    const t = this.getAttribute("api-base-url") || void 0, i = this.getAttribute("video-fit") || "cover";
+    this.previewImg.style.display = "none";
+    try {
+      this.embed = new P({
+        container: this.containerEl,
+        publishableKey: e,
+        apiBaseUrl: t,
+        videoFit: i,
+        onStateChange: (n) => {
+          n === "connected" && (this._connected = !0, this._connecting = !1, this._applyState()), this.dispatchEvent(new CustomEvent("statechange", { detail: { status: n } }));
+        },
+        onDisconnect: () => {
+          this._resetToMinimized(), this.dispatchEvent(new CustomEvent("disconnected"));
+        },
+        onError: (n) => {
+          console.error("[kfl-embed] Error:", n), this._resetToMinimized(), this._showError("Unable to connect"), this.dispatchEvent(new CustomEvent("error", { detail: { error: n } }));
+        },
+        onAgentStateChange: (n) => {
+          this.dispatchEvent(new CustomEvent("agentstatechange", { detail: { state: n } }));
+        }
+      }), await this.embed.connect();
+    } catch (n) {
+      console.error("[kfl-embed] Connection failed:", n), this._resetToMinimized(), this._showError("Unable to connect"), this.dispatchEvent(new CustomEvent("error", { detail: { error: n } }));
+    }
+  }
+}
 export {
-  N as AGENT_REGISTRY,
-  u as BaseAgent,
-  D as CartesiaAgent,
-  S as ElevenLabsAgent,
-  R as GeminiLiveAgent,
-  L as KeyframeApiError,
-  $ as PersonaEmbed,
-  B as PersonaView,
-  o as SAMPLE_RATE,
-  m as base64ToBytes,
-  g as bytesToBase64,
-  y as createAgent,
-  E as createEventEmitter,
-  w as floatTo16BitPCM,
-  F as getAgentInfo,
-  h as resamplePcm
+  j as AGENT_REGISTRY,
+  S as BaseAgent,
+  M as ElevenLabsAgent,
+  F as KeyframeApiError,
+  ee as KflEmbedElement,
+  L as OpenAIRealtimeAgent,
+  P as PersonaEmbed,
+  Q as PersonaView,
+  u as SAMPLE_RATE,
+  w as base64ToBytes,
+  y as bytesToBase64,
+  k as createAgent,
+  x as createEventEmitter,
+  E as floatTo16BitPCM,
+  X as getAgentInfo,
+  g as resamplePcm
 };