feat: karaoke lyrics

src/components/player/Lyric.tsx

@@ -11,7 +11,7 @@ import {
   Button,
   TextInput,
 } from 'react-native';
-import { Lrc as Lyric } from 'react-native-lyric';
+import { Lrc as Lyric, KaraokeMode } from 'react-native-lyric';
 import { Track, useProgress } from 'react-native-track-player';
 import { IconButton } from 'react-native-paper';
 
@@ -76,7 +76,7 @@ export const LyricView = ({
 }: LyricViewProps) => {
   const playerSetting = useNoxSetting(state => state.playerSetting);
   const { position } = useProgress(
-    playerSetting.karaokeLyrics ? 30 : undefined
+    playerSetting.karaokeLyrics ? 50 : undefined
   );
   const [lrc, setLrc] = useState(i18n.t('Lyric.loading'));
   const [lrcOptions, setLrcOptions] = useState<NoxNetwork.NoxFetchedLyric[]>(
@@ -269,11 +269,14 @@ export const LyricView = ({
         lrc={lrc}
         currentTime={(position + currentTimeOffset) * 1000}
         lineHeight={32}
-        lineRenderer={lineRenderer}
         height={height}
         noScrollThrottle={noScrollThrottle}
         onPress={onPress}
-        useMaskedView={playerSetting.karaokeLyrics}
+        karaokeOnColor={playerStyle.colors.primary}
+        karaokeOffColor={playerStyle.colors.secondary}
+        karaokeMode={
+          playerSetting.karaokeLyrics ? KaraokeMode.OnlyRealKaraoke : undefined
+        }
       />
       {showUI && (
         <>

yarn.lock

@@ -12110,7 +12110,7 @@ react-native-get-random-values@^1.11.0:
 
 "react-native-lyric@git+https://github.com/lovegaoshi/react-native-lyric.git#dev":
   version "1.0.1"
-  resolved "git+https://github.com/lovegaoshi/react-native-lyric.git#689087712c96d1d69ea240856c58e029c2bc9b97"
+  resolved "git+https://github.com/lovegaoshi/react-native-lyric.git#b141a77252a9afe9b74f2e70e02bc02188c1c5c3"
   dependencies:
     "@react-native-masked-view/masked-view" "^0.3.1"