lrc-audio-player 0.1.3 → 0.1.4

package/dist/react.cjs

@@ -403,32 +403,69 @@ function useLyricPlayer(options) {
   const [currentLine, setCurrentLine] = (0, import_react.useState)(null);
   const [currentIndex, setCurrentIndex] = (0, import_react.useState)(-1);
   const [lines, setLines] = (0, import_react.useState)([]);
+  const [isLoading, setIsLoading] = (0, import_react.useState)(false);
+  const [error, setError] = (0, import_react.useState)(null);
   const optionsRef = (0, import_react.useRef)(options);
   optionsRef.current = options;
   (0, import_react.useEffect)(() => {
     const audioEl = audioRef.current;
     if (!audioEl) return;
-    const { audio, lyrics, offsetMs } = optionsRef.current;
+    const { audio, lyrics, offsetMs, skipCBR, cbrBitrate } = optionsRef.current;
     if (audio) audioEl.src = audio;
-    const instance = new LyricPlayer({
-      audio: audioEl,
-      lyrics,
-      offsetMs
-    });
-    setPlayer(instance);
-    setLines(instance.lines);
+    let cancelled = false;
+    setIsLoading(true);
+    setError(null);
+    setPlayer(null);
+    setLines([]);
     setCurrentLine(null);
     setCurrentIndex(-1);
-    instance.on("linechange", (line, index) => {
-      setCurrentLine(line);
-      setCurrentIndex(index);
+    LyricPlayer.create({
+      audio: audioEl,
+      lyrics,
+      offsetMs,
+      skipCBR,
+      cbrBitrate
+    }).then((instance) => {
+      if (cancelled) {
+        instance.destroy();
+        return;
+      }
+      setPlayer(instance);
+      setLines(instance.lines);
+      setIsLoading(false);
+      instance.on("linechange", (line, index) => {
+        setCurrentLine(line);
+        setCurrentIndex(index);
+      });
+    }).catch((err) => {
+      if (!cancelled) {
+        setError(err instanceof Error ? err : new Error(String(err)));
+        setIsLoading(false);
+      }
     });
     return () => {
-      instance.destroy();
-      setPlayer(null);
+      cancelled = true;
+      setPlayer((prev) => {
+        prev?.destroy();
+        return null;
+      });
     };
-  }, [options.audio, options.lyrics, options.offsetMs]);
-  return { player, audioRef, currentLine, currentIndex, lines };
+  }, [
+    options.audio,
+    options.lyrics,
+    options.offsetMs,
+    options.skipCBR,
+    options.cbrBitrate
+  ]);
+  return {
+    player,
+    audioRef,
+    currentLine,
+    currentIndex,
+    lines,
+    isLoading,
+    error
+  };
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/react.d.cts

@@ -4,6 +4,10 @@ export { f as LyricSource } from './player-sLsiwLVO.cjs';
 interface UseLyricPlayerOptions extends Omit<LyricPlayerOptions, "audio"> {
     /** Audio source URL. Set on the bound <audio> element. */
     audio?: string;
+    /** Skip CBR conversion if your audio is already constant bitrate. */
+    skipCBR?: boolean;
+    /** Target bitrate for CBR conversion. @default '128k' */
+    cbrBitrate?: string;
 }
 interface UseLyricPlayerResult {
     /** The underlying player instance (null until mounted and ready). */
@@ -16,6 +20,10 @@ interface UseLyricPlayerResult {
     currentIndex: number;
     /** All parsed lyric lines (empty until lyrics are loaded). */
     lines: LyricLine[];
+    /** Whether the player is initializing (CBR conversion in progress). */
+    isLoading: boolean;
+    /** Error if initialization failed. */
+    error: Error | null;
 }
 /**
  * React hook that creates a {@link LyricPlayer} bound to an `<audio>`
@@ -28,7 +36,7 @@ interface UseLyricPlayerResult {
  * ```tsx
  * 'use client';
  *
- * const { audioRef, currentLine, lines, player } = useLyricPlayer({
+ * const { audioRef, currentLine, lines, player, isLoading } = useLyricPlayer({
  *   audio: '/song.mp3',
  *   lyrics: lrcText,
  * });
@@ -36,15 +44,11 @@ interface UseLyricPlayerResult {
  * return (
  *   <>
  *     <audio ref={audioRef} controls />
+ *     {isLoading && <p>Loading audio…</p>}
  *     <p>{currentLine?.text}</p>
  *   </>
  * );
  * ```
- *
- * The player is recreated whenever `audio` or `lyrics` change. If you're
- * fetching lyrics asynchronously, wait until they're loaded before calling
- * this hook (or pass `lyrics: ''` while loading - an empty string parses
- * to zero lines and is cheap to recreate).
  */
 declare function useLyricPlayer(options: UseLyricPlayerOptions): UseLyricPlayerResult;
 

package/dist/react.d.ts

@@ -4,6 +4,10 @@ export { f as LyricSource } from './player-sLsiwLVO.js';
 interface UseLyricPlayerOptions extends Omit<LyricPlayerOptions, "audio"> {
     /** Audio source URL. Set on the bound <audio> element. */
     audio?: string;
+    /** Skip CBR conversion if your audio is already constant bitrate. */
+    skipCBR?: boolean;
+    /** Target bitrate for CBR conversion. @default '128k' */
+    cbrBitrate?: string;
 }
 interface UseLyricPlayerResult {
     /** The underlying player instance (null until mounted and ready). */
@@ -16,6 +20,10 @@ interface UseLyricPlayerResult {
     currentIndex: number;
     /** All parsed lyric lines (empty until lyrics are loaded). */
     lines: LyricLine[];
+    /** Whether the player is initializing (CBR conversion in progress). */
+    isLoading: boolean;
+    /** Error if initialization failed. */
+    error: Error | null;
 }
 /**
  * React hook that creates a {@link LyricPlayer} bound to an `<audio>`
@@ -28,7 +36,7 @@ interface UseLyricPlayerResult {
  * ```tsx
  * 'use client';
  *
- * const { audioRef, currentLine, lines, player } = useLyricPlayer({
+ * const { audioRef, currentLine, lines, player, isLoading } = useLyricPlayer({
  *   audio: '/song.mp3',
  *   lyrics: lrcText,
  * });
@@ -36,15 +44,11 @@ interface UseLyricPlayerResult {
  * return (
  *   <>
  *     <audio ref={audioRef} controls />
+ *     {isLoading && <p>Loading audio…</p>}
  *     <p>{currentLine?.text}</p>
  *   </>
  * );
  * ```
- *
- * The player is recreated whenever `audio` or `lyrics` change. If you're
- * fetching lyrics asynchronously, wait until they're loaded before calling
- * this hook (or pass `lyrics: ''` while loading - an empty string parses
- * to zero lines and is cheap to recreate).
  */
 declare function useLyricPlayer(options: UseLyricPlayerOptions): UseLyricPlayerResult;
 

package/dist/react.js

@@ -11,32 +11,69 @@ function useLyricPlayer(options) {
   const [currentLine, setCurrentLine] = useState(null);
   const [currentIndex, setCurrentIndex] = useState(-1);
   const [lines, setLines] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState(null);
   const optionsRef = useRef(options);
   optionsRef.current = options;
   useEffect(() => {
     const audioEl = audioRef.current;
     if (!audioEl) return;
-    const { audio, lyrics, offsetMs } = optionsRef.current;
+    const { audio, lyrics, offsetMs, skipCBR, cbrBitrate } = optionsRef.current;
     if (audio) audioEl.src = audio;
-    const instance = new LyricPlayer({
-      audio: audioEl,
-      lyrics,
-      offsetMs
-    });
-    setPlayer(instance);
-    setLines(instance.lines);
+    let cancelled = false;
+    setIsLoading(true);
+    setError(null);
+    setPlayer(null);
+    setLines([]);
     setCurrentLine(null);
     setCurrentIndex(-1);
-    instance.on("linechange", (line, index) => {
-      setCurrentLine(line);
-      setCurrentIndex(index);
+    LyricPlayer.create({
+      audio: audioEl,
+      lyrics,
+      offsetMs,
+      skipCBR,
+      cbrBitrate
+    }).then((instance) => {
+      if (cancelled) {
+        instance.destroy();
+        return;
+      }
+      setPlayer(instance);
+      setLines(instance.lines);
+      setIsLoading(false);
+      instance.on("linechange", (line, index) => {
+        setCurrentLine(line);
+        setCurrentIndex(index);
+      });
+    }).catch((err) => {
+      if (!cancelled) {
+        setError(err instanceof Error ? err : new Error(String(err)));
+        setIsLoading(false);
+      }
     });
     return () => {
-      instance.destroy();
-      setPlayer(null);
+      cancelled = true;
+      setPlayer((prev) => {
+        prev?.destroy();
+        return null;
+      });
     };
-  }, [options.audio, options.lyrics, options.offsetMs]);
-  return { player, audioRef, currentLine, currentIndex, lines };
+  }, [
+    options.audio,
+    options.lyrics,
+    options.offsetMs,
+    options.skipCBR,
+    options.cbrBitrate
+  ]);
+  return {
+    player,
+    audioRef,
+    currentLine,
+    currentIndex,
+    lines,
+    isLoading,
+    error
+  };
 }
 export {
   useLyricPlayer

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lrc-audio-player",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "Sync LRC/word-level lyrics to an HTML audio element with one constructor. Includes an optional React hook at lrc-audio-player/react.",
   "repository": {
     "type": "git",