lrc-audio-player 0.1.4 → 0.1.6

package/dist/react.cjs

@@ -402,9 +402,13 @@ function useLyricPlayer(options) {
   const [player, setPlayer] = (0, import_react.useState)(null);
   const [currentLine, setCurrentLine] = (0, import_react.useState)(null);
   const [currentIndex, setCurrentIndex] = (0, import_react.useState)(-1);
+  const [currentToken, setCurrentToken] = (0, import_react.useState)(null);
   const [lines, setLines] = (0, import_react.useState)([]);
   const [isLoading, setIsLoading] = (0, import_react.useState)(false);
   const [error, setError] = (0, import_react.useState)(null);
+  const [isPlaying, setIsPlaying] = (0, import_react.useState)(false);
+  const [currentTime, setCurrentTime] = (0, import_react.useState)(0);
+  const [duration, setDuration] = (0, import_react.useState)(0);
   const optionsRef = (0, import_react.useRef)(options);
   optionsRef.current = options;
   (0, import_react.useEffect)(() => {
@@ -419,6 +423,10 @@ function useLyricPlayer(options) {
     setLines([]);
     setCurrentLine(null);
     setCurrentIndex(-1);
+    setCurrentToken(null);
+    setIsPlaying(false);
+    setCurrentTime(0);
+    setDuration(0);
     LyricPlayer.create({
       audio: audioEl,
       lyrics,
@@ -433,10 +441,23 @@ function useLyricPlayer(options) {
       setPlayer(instance);
       setLines(instance.lines);
       setIsLoading(false);
+      if (!isNaN(instance.duration)) {
+        setDuration(instance.duration);
+      }
+      instance.audio.addEventListener("loadedmetadata", () => {
+        setDuration(instance.duration);
+      });
       instance.on("linechange", (line, index) => {
         setCurrentLine(line);
         setCurrentIndex(index);
       });
+      instance.on("timeupdate", (time) => {
+        setCurrentTime(time);
+        setCurrentToken(instance.getCurrentToken());
+      });
+      instance.on("play", () => setIsPlaying(true));
+      instance.on("pause", () => setIsPlaying(false));
+      instance.on("ended", () => setIsPlaying(false));
     }).catch((err) => {
       if (!cancelled) {
         setError(err instanceof Error ? err : new Error(String(err)));
@@ -457,14 +478,44 @@ function useLyricPlayer(options) {
     options.skipCBR,
     options.cbrBitrate
   ]);
+  const seek = (0, import_react.useCallback)(
+    (timeSeconds) => {
+      player?.seek(timeSeconds);
+    },
+    [player]
+  );
+  const seekToLine = (0, import_react.useCallback)(
+    (index) => {
+      player?.seekToLine(index);
+    },
+    [player]
+  );
+  const play = (0, import_react.useCallback)(() => {
+    return player?.play() ?? Promise.resolve();
+  }, [player]);
+  const pause = (0, import_react.useCallback)(() => {
+    player?.pause();
+  }, [player]);
+  const toggle = (0, import_react.useCallback)(() => {
+    return player?.toggle();
+  }, [player]);
   return {
     player,
     audioRef,
     currentLine,
     currentIndex,
+    currentToken,
     lines,
     isLoading,
-    error
+    error,
+    isPlaying,
+    currentTime,
+    duration,
+    seek,
+    seekToLine,
+    play,
+    pause,
+    toggle
   };
 }
 // Annotate the CommonJS export names for ESM import in node:

package/dist/react.d.cts

@@ -1,4 +1,4 @@
-import { h as LyricPlayerOptions, b as LyricPlayer, L as LyricLine } from './player-sLsiwLVO.cjs';
+import { h as LyricPlayerOptions, b as LyricPlayer, L as LyricLine, g as LyricToken } from './player-sLsiwLVO.cjs';
 export { f as LyricSource } from './player-sLsiwLVO.cjs';
 
 interface UseLyricPlayerOptions extends Omit<LyricPlayerOptions, "audio"> {
@@ -18,12 +18,30 @@ interface UseLyricPlayerResult {
     currentLine: LyricLine | null;
     /** Index of the currently active lyric line (-1 if none yet). */
     currentIndex: number;
+    /** The currently active word/token (for word-level LRC), or null. */
+    currentToken: LyricToken | null;
     /** 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;
+    /** Whether audio is currently playing. */
+    isPlaying: boolean;
+    /** Current playback time in seconds. */
+    currentTime: number;
+    /** Total audio duration in seconds (0 if unknown). */
+    duration: number;
+    /** Jump to a specific time in seconds. */
+    seek: (timeSeconds: number) => void;
+    /** Jump to the start of a specific lyric line. */
+    seekToLine: (index: number) => void;
+    /** Play the audio. */
+    play: () => Promise<void>;
+    /** Pause the audio. */
+    pause: () => void;
+    /** Toggle play/pause. */
+    toggle: () => Promise<void> | void;
 }
 /**
  * React hook that creates a {@link LyricPlayer} bound to an `<audio>`
@@ -36,7 +54,7 @@ interface UseLyricPlayerResult {
  * ```tsx
  * 'use client';
  *
- * const { audioRef, currentLine, lines, player, isLoading } = useLyricPlayer({
+ * const { audioRef, currentLine, lines, isLoading, isPlaying, currentTime } = useLyricPlayer({
  *   audio: '/song.mp3',
  *   lyrics: lrcText,
  * });

package/dist/react.d.ts

@@ -1,4 +1,4 @@
-import { h as LyricPlayerOptions, b as LyricPlayer, L as LyricLine } from './player-sLsiwLVO.js';
+import { h as LyricPlayerOptions, b as LyricPlayer, L as LyricLine, g as LyricToken } from './player-sLsiwLVO.js';
 export { f as LyricSource } from './player-sLsiwLVO.js';
 
 interface UseLyricPlayerOptions extends Omit<LyricPlayerOptions, "audio"> {
@@ -18,12 +18,30 @@ interface UseLyricPlayerResult {
     currentLine: LyricLine | null;
     /** Index of the currently active lyric line (-1 if none yet). */
     currentIndex: number;
+    /** The currently active word/token (for word-level LRC), or null. */
+    currentToken: LyricToken | null;
     /** 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;
+    /** Whether audio is currently playing. */
+    isPlaying: boolean;
+    /** Current playback time in seconds. */
+    currentTime: number;
+    /** Total audio duration in seconds (0 if unknown). */
+    duration: number;
+    /** Jump to a specific time in seconds. */
+    seek: (timeSeconds: number) => void;
+    /** Jump to the start of a specific lyric line. */
+    seekToLine: (index: number) => void;
+    /** Play the audio. */
+    play: () => Promise<void>;
+    /** Pause the audio. */
+    pause: () => void;
+    /** Toggle play/pause. */
+    toggle: () => Promise<void> | void;
 }
 /**
  * React hook that creates a {@link LyricPlayer} bound to an `<audio>`
@@ -36,7 +54,7 @@ interface UseLyricPlayerResult {
  * ```tsx
  * 'use client';
  *
- * const { audioRef, currentLine, lines, player, isLoading } = useLyricPlayer({
+ * const { audioRef, currentLine, lines, isLoading, isPlaying, currentTime } = useLyricPlayer({
  *   audio: '/song.mp3',
  *   lyrics: lrcText,
  * });

package/dist/react.js

@@ -4,15 +4,19 @@ import {
 } from "./chunk-3A2M5KTA.js";
 
 // src/react.ts
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useRef, useState, useCallback } from "react";
 function useLyricPlayer(options) {
   const audioRef = useRef(null);
   const [player, setPlayer] = useState(null);
   const [currentLine, setCurrentLine] = useState(null);
   const [currentIndex, setCurrentIndex] = useState(-1);
+  const [currentToken, setCurrentToken] = useState(null);
   const [lines, setLines] = useState([]);
   const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState(null);
+  const [isPlaying, setIsPlaying] = useState(false);
+  const [currentTime, setCurrentTime] = useState(0);
+  const [duration, setDuration] = useState(0);
   const optionsRef = useRef(options);
   optionsRef.current = options;
   useEffect(() => {
@@ -27,6 +31,10 @@ function useLyricPlayer(options) {
     setLines([]);
     setCurrentLine(null);
     setCurrentIndex(-1);
+    setCurrentToken(null);
+    setIsPlaying(false);
+    setCurrentTime(0);
+    setDuration(0);
     LyricPlayer.create({
       audio: audioEl,
       lyrics,
@@ -41,10 +49,23 @@ function useLyricPlayer(options) {
       setPlayer(instance);
       setLines(instance.lines);
       setIsLoading(false);
+      if (!isNaN(instance.duration)) {
+        setDuration(instance.duration);
+      }
+      instance.audio.addEventListener("loadedmetadata", () => {
+        setDuration(instance.duration);
+      });
       instance.on("linechange", (line, index) => {
         setCurrentLine(line);
         setCurrentIndex(index);
       });
+      instance.on("timeupdate", (time) => {
+        setCurrentTime(time);
+        setCurrentToken(instance.getCurrentToken());
+      });
+      instance.on("play", () => setIsPlaying(true));
+      instance.on("pause", () => setIsPlaying(false));
+      instance.on("ended", () => setIsPlaying(false));
     }).catch((err) => {
       if (!cancelled) {
         setError(err instanceof Error ? err : new Error(String(err)));
@@ -65,14 +86,44 @@ function useLyricPlayer(options) {
     options.skipCBR,
     options.cbrBitrate
   ]);
+  const seek = useCallback(
+    (timeSeconds) => {
+      player?.seek(timeSeconds);
+    },
+    [player]
+  );
+  const seekToLine = useCallback(
+    (index) => {
+      player?.seekToLine(index);
+    },
+    [player]
+  );
+  const play = useCallback(() => {
+    return player?.play() ?? Promise.resolve();
+  }, [player]);
+  const pause = useCallback(() => {
+    player?.pause();
+  }, [player]);
+  const toggle = useCallback(() => {
+    return player?.toggle();
+  }, [player]);
   return {
     player,
     audioRef,
     currentLine,
     currentIndex,
+    currentToken,
     lines,
     isLoading,
-    error
+    error,
+    isPlaying,
+    currentTime,
+    duration,
+    seek,
+    seekToLine,
+    play,
+    pause,
+    toggle
   };
 }
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lrc-audio-player",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "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",