@cartesia/cartesia-js 0.0.4-alpha.0 → 1.0.0-alpha.2

package/dist/react/index.d.cts

@@ -1,27 +1,33 @@
-import { C as Chunk, S as StreamEventData } from '../index-C2_3XFxn.cjs';
+import Source from '../tts/source.cjs';
 import 'emittery';
-import 'partysocket';
-import '../lib/client.cjs';
 import '../types/index.cjs';
 
-type UseAudioOptions = {
+type UseTTSOptions = {
     apiKey: string | null;
     baseUrl?: string;
+    sampleRate: number;
 };
-interface UseAudioReturn {
-    stream: (options: object) => void;
+type PlaybackStatus = "inactive" | "playing" | "paused" | "finished";
+type BufferStatus = "inactive" | "buffering" | "buffered";
+type Metrics = {
+    modelLatency: number | null;
+};
+interface UseTTSReturn {
+    buffer: (options: object) => Promise<void>;
     play: (bufferDuration?: number) => Promise<void>;
-    download: () => Blob | null;
-    isPlaying: boolean;
+    pause: () => Promise<void>;
+    resume: () => Promise<void>;
+    toggle: () => Promise<void>;
+    source: Source | null;
+    playbackStatus: PlaybackStatus;
+    bufferStatus: BufferStatus;
+    isWaiting: boolean;
     isConnected: boolean;
-    isStreamed: boolean;
-    isBuffering: boolean;
-    chunks: Chunk[];
-    messages: StreamEventData["message"][];
+    metrics: Metrics;
 }
 /**
  * React hook to use the Cartesia audio API.
  */
-declare function useAudio({ apiKey, baseUrl }: UseAudioOptions): UseAudioReturn;
+declare function useTTS({ apiKey, baseUrl, sampleRate, }: UseTTSOptions): UseTTSReturn;
 
-export { type UseAudioOptions, useAudio };
+export { type BufferStatus, type Metrics, type PlaybackStatus, type UseTTSOptions, type UseTTSReturn, useTTS };

package/dist/react/index.d.ts

@@ -1,27 +1,33 @@
-import { C as Chunk, S as StreamEventData } from '../index-DgwnZezj.js';
+import Source from '../tts/source.js';
 import 'emittery';
-import 'partysocket';
-import '../lib/client.js';
 import '../types/index.js';
 
-type UseAudioOptions = {
+type UseTTSOptions = {
     apiKey: string | null;
     baseUrl?: string;
+    sampleRate: number;
 };
-interface UseAudioReturn {
-    stream: (options: object) => void;
+type PlaybackStatus = "inactive" | "playing" | "paused" | "finished";
+type BufferStatus = "inactive" | "buffering" | "buffered";
+type Metrics = {
+    modelLatency: number | null;
+};
+interface UseTTSReturn {
+    buffer: (options: object) => Promise<void>;
     play: (bufferDuration?: number) => Promise<void>;
-    download: () => Blob | null;
-    isPlaying: boolean;
+    pause: () => Promise<void>;
+    resume: () => Promise<void>;
+    toggle: () => Promise<void>;
+    source: Source | null;
+    playbackStatus: PlaybackStatus;
+    bufferStatus: BufferStatus;
+    isWaiting: boolean;
     isConnected: boolean;
-    isStreamed: boolean;
-    isBuffering: boolean;
-    chunks: Chunk[];
-    messages: StreamEventData["message"][];
+    metrics: Metrics;
 }
 /**
  * React hook to use the Cartesia audio API.
  */
-declare function useAudio({ apiKey, baseUrl }: UseAudioOptions): UseAudioReturn;
+declare function useTTS({ apiKey, baseUrl, sampleRate, }: UseTTSOptions): UseTTSReturn;
 
-export { type UseAudioOptions, useAudio };
+export { type BufferStatus, type Metrics, type PlaybackStatus, type UseTTSOptions, type UseTTSReturn, useTTS };

package/dist/react/index.js

@@ -1,108 +1,144 @@
 import {
-  audio_default
-} from "../chunk-4MHF74A7.js";
-import {
-  base64ToArray,
-  bufferToWav
-} from "../chunk-5TSWLYOW.js";
-import "../chunk-MJIFZWHS.js";
-import {
-  SAMPLE_RATE
-} from "../chunk-OVI3W3GG.js";
+  Cartesia
+} from "../chunk-T3RG6WV4.js";
+import "../chunk-WVTITUXX.js";
 import {
   pingServer
-} from "../chunk-XPIMIAAE.js";
+} from "../chunk-3FL2SNIR.js";
+import "../chunk-KWBSQZTY.js";
+import "../chunk-3F5E46FT.js";
+import "../chunk-PQ6CIPFW.js";
+import "../chunk-JGP5BIUV.js";
+import "../chunk-XHTDPLFR.js";
+import {
+  Player
+} from "../chunk-36JBKJUN.js";
+import "../chunk-RO7TY474.js";
 import {
   __async
-} from "../chunk-R4P7LWVZ.js";
+} from "../chunk-WIFMLPT5.js";
 
 // src/react/index.ts
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-function useAudio({ apiKey, baseUrl }) {
+var PING_INTERVAL = 5e3;
+var DEFAULT_BUFFER_DURATION = 0.01;
+function useTTS({
+  apiKey,
+  baseUrl,
+  sampleRate
+}) {
+  var _a, _b;
   if (typeof window === "undefined") {
     return {
-      stream: () => {
-      },
+      buffer: () => __async(this, null, function* () {
+      }),
       play: () => __async(this, null, function* () {
       }),
-      download: () => null,
+      pause: () => __async(this, null, function* () {
+      }),
+      resume: () => __async(this, null, function* () {
+      }),
+      toggle: () => __async(this, null, function* () {
+      }),
+      playbackStatus: "inactive",
+      bufferStatus: "inactive",
+      isWaiting: false,
+      source: null,
       isConnected: false,
-      isPlaying: false,
-      isStreamed: false,
-      isBuffering: false,
-      chunks: [],
-      messages: []
+      metrics: {
+        modelLatency: null
+      }
     };
   }
-  const audio = useMemo(() => {
+  const websocket = useMemo(() => {
     if (!apiKey) {
       return null;
     }
-    const audio2 = new audio_default({ apiKey, baseUrl });
-    return audio2;
-  }, [apiKey, baseUrl]);
-  const streamReturn = useRef(null);
-  const [isStreamed, setIsStreamed] = useState(false);
-  const [isPlaying, setIsPlaying] = useState(false);
-  const [isBuffering, setIsBuffering] = useState(false);
+    const cartesia = new Cartesia({ apiKey, baseUrl });
+    baseUrl = baseUrl != null ? baseUrl : cartesia.baseUrl;
+    return cartesia.tts.websocket({ sampleRate });
+  }, [apiKey, baseUrl, sampleRate]);
+  const websocketReturn = useRef(null);
+  const player = useRef(null);
+  const [playbackStatus, setPlaybackStatus] = useState("inactive");
+  const [bufferStatus, setBufferStatus] = useState("inactive");
+  const [isWaiting, setIsWaiting] = useState(false);
   const [isConnected, setIsConnected] = useState(false);
-  const [chunks, setChunks] = useState([]);
+  const [bufferDuration, setBufferDuration] = useState(null);
   const [messages, setMessages] = useState([]);
-  const latencyEndpoint = "https://api.cartesia.ai";
-  const stream = useCallback(
+  const buffer = useCallback(
     (options) => __async(this, null, function* () {
-      var _a;
-      setIsStreamed(false);
-      streamReturn.current = (_a = audio == null ? void 0 : audio.stream(options)) != null ? _a : null;
-      if (!streamReturn.current) {
+      var _a2;
+      setMessages([]);
+      setBufferStatus("buffering");
+      websocketReturn.current = (_a2 = websocket == null ? void 0 : websocket.send(options)) != null ? _a2 : null;
+      if (!websocketReturn.current) {
         return;
       }
-      setMessages([]);
-      streamReturn.current.on(
-        "chunk",
-        ({ chunks: chunks3 }) => {
-          setChunks(chunks3);
-        }
-      );
-      streamReturn.current.on(
-        "message",
-        (message) => {
-          setMessages((messages2) => [...messages2, message]);
-        }
-      );
-      const { chunks: chunks2 } = yield streamReturn.current.once("streamed");
-      setChunks(chunks2);
-      setIsStreamed(true);
+      const unsubscribe = websocketReturn.current.on("message", (message) => {
+        setMessages((messages2) => [...messages2, JSON.parse(message)]);
+      });
+      yield websocketReturn.current.source.once("close");
+      setBufferStatus("buffered");
+      unsubscribe();
     }),
-    [audio]
+    [websocket]
   );
-  const download = useCallback(() => {
-    if (!isStreamed) {
-      return null;
+  const metrics = useMemo(() => {
+    var _a2;
+    if (messages.length === 0) {
+      return {
+        modelLatency: null
+      };
     }
-    const audio2 = bufferToWav(SAMPLE_RATE, [base64ToArray(chunks)]);
-    return new Blob([audio2], { type: "audio/wav" });
-  }, [isStreamed, chunks]);
+    const modelLatency = (_a2 = messages[0].step_time) != null ? _a2 : null;
+    return {
+      modelLatency: Math.trunc(modelLatency)
+    };
+  }, [messages]);
   useEffect(() => {
     let cleanup = () => {
     };
     function setupConnection() {
       return __async(this, null, function* () {
         try {
-          const connection = yield audio == null ? void 0 : audio.connect();
+          const connection = yield websocket == null ? void 0 : websocket.connect();
           if (!connection) {
             return;
           }
+          const unsubscribes = [];
           setIsConnected(true);
-          connection.on("open", () => {
-            setIsConnected(true);
-          });
-          const unsubscribe = connection.on("close", () => {
-            setIsConnected(false);
-          });
+          unsubscribes.push(
+            connection.on("open", () => {
+              setIsConnected(true);
+            })
+          );
+          unsubscribes.push(
+            connection.on("close", () => {
+              setIsConnected(false);
+            })
+          );
+          const intervalId = setInterval(() => {
+            if (baseUrl) {
+              pingServer(new URL(baseUrl).origin).then((ping) => {
+                let bufferDuration2;
+                if (ping < 300) {
+                  bufferDuration2 = 0.01;
+                } else if (ping > 1500) {
+                  bufferDuration2 = 6;
+                } else {
+                  bufferDuration2 = ping / 1e3 * 4;
+                }
+                setBufferDuration(bufferDuration2);
+              });
+            }
+          }, PING_INTERVAL);
           return () => {
-            unsubscribe();
-            audio == null ? void 0 : audio.disconnect();
+            for (const unsubscribe of unsubscribes) {
+              unsubscribe();
+            }
+            clearInterval(intervalId);
+            websocket == null ? void 0 : websocket.disconnect();
           };
         } catch (e) {
           console.error(e);
@@ -113,53 +149,69 @@ function useAudio({ apiKey, baseUrl }) {
       cleanup = cleanupConnection;
     });
     return () => cleanup == null ? void 0 : cleanup();
-  }, [audio]);
+  }, [websocket, baseUrl]);
   const play = useCallback(() => __async(this, null, function* () {
-    var _a;
-    if (isPlaying || !streamReturn.current) {
+    if (playbackStatus === "playing" || !websocketReturn.current) {
       return;
     }
-    setIsPlaying(true);
-    const ping = yield pingServer(latencyEndpoint);
-    let bufferingTimeout;
-    let bufferDuration;
-    if (ping < 300) {
-      bufferDuration = 0;
-    } else if (ping > 1500) {
-      bufferDuration = 6;
-    } else {
-      bufferDuration = ping / 1e3 * 4;
-    }
-    streamReturn.current.once("buffering").then(() => {
-      bufferingTimeout = setTimeout(() => {
-        setIsBuffering(true);
-      }, 250);
+    setPlaybackStatus("playing");
+    const unsubscribes = [];
+    unsubscribes.push(
+      websocketReturn.current.source.on("wait", () => {
+        setIsWaiting(true);
+      })
+    );
+    unsubscribes.push(
+      websocketReturn.current.source.on("read", () => {
+        setIsWaiting(false);
+      })
+    );
+    player.current = new Player({
+      bufferDuration: bufferDuration != null ? bufferDuration : DEFAULT_BUFFER_DURATION
     });
-    streamReturn.current.once("buffered").then(() => {
-      if (bufferingTimeout) {
-        clearTimeout(bufferingTimeout);
+    yield player.current.play(websocketReturn.current.source);
+    for (const unsubscribe of unsubscribes) {
+      unsubscribe();
+    }
+    setPlaybackStatus("finished");
+  }), [playbackStatus, bufferDuration]);
+  const pause = useCallback(() => __async(this, null, function* () {
+    var _a2;
+    yield (_a2 = player.current) == null ? void 0 : _a2.pause();
+    setPlaybackStatus("paused");
+  }), []);
+  const resume = useCallback(() => __async(this, null, function* () {
+    var _a2;
+    yield (_a2 = player.current) == null ? void 0 : _a2.resume();
+    setPlaybackStatus("playing");
+  }), []);
+  const toggle = useCallback(() => __async(this, null, function* () {
+    var _a2;
+    yield (_a2 = player.current) == null ? void 0 : _a2.toggle();
+    setPlaybackStatus((status) => {
+      if (status === "playing") {
+        return "paused";
       }
-      setIsBuffering(false);
-    });
-    streamReturn.current.once("scheduled").then((data) => {
-      setTimeout(() => {
-        setIsPlaying(false);
-      }, data.playbackEndsIn);
+      if (status === "paused") {
+        return "playing";
+      }
+      return status;
     });
-    yield (_a = streamReturn.current) == null ? void 0 : _a.play({ bufferDuration });
-  }), [isPlaying]);
+  }), []);
   return {
-    stream,
+    buffer,
     play,
-    download,
-    isPlaying,
+    pause,
+    source: (_b = (_a = websocketReturn.current) == null ? void 0 : _a.source) != null ? _b : null,
+    resume,
+    toggle,
+    playbackStatus,
+    bufferStatus,
+    isWaiting,
     isConnected,
-    isStreamed,
-    isBuffering,
-    chunks,
-    messages
+    metrics
   };
 }
 export {
-  useAudio
+  useTTS
 };

package/dist/react/utils.js

@@ -1,7 +1,7 @@
 import {
   pingServer
-} from "../chunk-XPIMIAAE.js";
-import "../chunk-R4P7LWVZ.js";
+} from "../chunk-3FL2SNIR.js";
+import "../chunk-WIFMLPT5.js";
 export {
   pingServer
 };