@uimaxbai/am-lyrics 1.2.8 → 1.3.0

package/dist/src/react.js

@@ -322,7 +322,7 @@ class GoogleService {
     }
 }
 
-const VERSION = '1.2.8';
+const VERSION = '1.3.0';
 const INSTRUMENTAL_THRESHOLD_MS = 7000; // Show dots for gaps >= 7s
 const FETCH_TIMEOUT_MS = 8000; // Timeout for all lyrics fetch requests
 const SEEK_THRESHOLD_MS = 500;
@@ -2046,9 +2046,22 @@ let AmLyrics$1 = class AmLyrics extends i {
         if (targetLineIndex === null)
             return;
         const targetLine = this._getLineElement(targetLineIndex);
-        if (targetLine) {
-            this.focusLine(targetLine, forceScroll);
+        if (!targetLine)
+            return;
+        // Only scroll snappily when lines are essentially back-to-back.
+        // If there is any noticeable gap between them, scroll slower.
+        let scrollDuration;
+        const prevPrimaryIndex = AmLyrics.getLineIndexFromElement(this.currentPrimaryActiveLine);
+        if (prevPrimaryIndex !== null &&
+            targetLineIndex > prevPrimaryIndex &&
+            this.lyrics) {
+            const gap = this.lyrics[targetLineIndex].timestamp -
+                this.lyrics[prevPrimaryIndex].endtime;
+            if (gap > 200) {
+                scrollDuration = Math.min(Math.max(gap * 0.6, SCROLL_ANIMATION_DURATION_MS), 2000);
+            }
         }
+        this.focusLine(targetLine, forceScroll, scrollDuration);
     }
     _getTextWidth(text, font) {
         if (!this._textWidthCanvas) {
@@ -2161,16 +2174,14 @@ let AmLyrics$1 = class AmLyrics extends i {
                 if (isGrowableVW) {
                     if (wordLen < 3) {
                         isGrowableVW =
-                            combinedDuration >= 1110 && combinedDuration >= wordLen * 550;
+                            combinedDuration >= 1050 && combinedDuration >= wordLen * 525;
                     }
                     else {
                         isGrowableVW =
-                            combinedDuration >= 850 && combinedDuration >= wordLen * 200;
+                            combinedDuration >= 850 && combinedDuration >= wordLen * 190;
                     }
                 }
-                const isGlowingVW = isGrowableVW &&
-                    combinedDuration >= 1000 &&
-                    combinedDuration >= combinedText.length * 250;
+                const isGlowingVW = isGrowableVW;
                 let charOff = 0;
                 for (let gi = vwStart; gi <= vwEnd; gi += 1) {
                     groupGrowable[gi] = isGrowableVW;
@@ -3443,6 +3454,9 @@ let AmLyrics$1 = class AmLyrics extends i {
                 // as the main vocal, so we intentionally do NOT render a separate
                 // translation/romanization block for background — it would just duplicate
                 // the main line's text.
+                const bgPlacement = hasBackground
+                    ? AmLyrics.getBackgroundTextPlacement(line)
+                    : 'after';
                 const lineData = this.cachedLineData?.[lineIndex];
                 const wordGroups = lineData?.wordGroups ?? [];
                 const groupGrowable = lineData?.groupGrowable ?? [];
@@ -3672,7 +3686,9 @@ let AmLyrics$1 = class AmLyrics extends i {
                 }}
           >
             <div class="lyrics-line-container">
-              ${mainVocalElement} ${backgroundVocalElement}
+              ${bgPlacement === 'before' ? backgroundVocalElement : ''}
+              ${mainVocalElement}
+              ${bgPlacement === 'after' ? backgroundVocalElement : ''}
               ${translationElement} ${lineRomanizationElement}
             </div>
           </div>