@applemusic-like-lyrics/core 0.4.0 → 0.4.2

package/dist/amll-core.cjs

@@ -30,9 +30,9 @@ let _pixi_filter_bulge_pinch = require("@pixi/filter-bulge-pinch");
 let _pixi_filter_color_matrix = require("@pixi/filter-color-matrix");
 let _pixi_sprite = require("@pixi/sprite");
 let _ungap_structured_clone = require("@ungap/structured-clone");
-_ungap_structured_clone = __toESM(_ungap_structured_clone);
+_ungap_structured_clone = __toESM(_ungap_structured_clone, 1);
 let bezier_easing = require("bezier-easing");
-bezier_easing = __toESM(bezier_easing);
+bezier_easing = __toESM(bezier_easing, 1);
 //#region src/bg-render/base.ts
 var AbstractBaseRenderer = class {};
 var BaseRenderer = class extends AbstractBaseRenderer {
@@ -2274,7 +2274,7 @@ var LyricPlayerBase = class extends EventTarget {
 	bottomLine = new BottomLineEl(this);
 	enableBlur = true;
 	enableScale = true;
-	maskObsceneWords = MaskObsceneWordsMode.Disabled;
+	maskObsceneWords = "";
 	maskObsceneWordChar = "*";
 	hidePassedLines = false;
 	scrollBoundary = [0, 0];
@@ -2564,7 +2564,7 @@ var LyricPlayerBase = class extends EventTarget {
 		const c = char.charAt(0) || "*";
 		if (this.maskObsceneWordChar === c) return;
 		this.maskObsceneWordChar = c;
-		if (this.maskObsceneWords !== MaskObsceneWordsMode.Disabled) {
+		if (this.maskObsceneWords !== "") {
 			this.rebuildLyricLines();
 			this.calcLayout();
 		}
@@ -2579,10 +2579,10 @@ var LyricPlayerBase = class extends EventTarget {
 	*/
 	processObsceneWord(word) {
 		const text = word.word;
-		if (!word.obscene || this.maskObsceneWords === MaskObsceneWordsMode.Disabled) return text;
+		if (!word.obscene || this.maskObsceneWords === "") return text;
 		const maskChar = this.maskObsceneWordChar;
-		if (this.maskObsceneWords === MaskObsceneWordsMode.FullMask) return text.replace(/\S/g, maskChar);
-		if (this.maskObsceneWords === MaskObsceneWordsMode.PartialMask) {
+		if (this.maskObsceneWords === "full-mask") return text.replace(/\S/g, maskChar);
+		if (this.maskObsceneWords === "partial-mask") {
 			const trimmed = text.trim();
 			if (trimmed.length <= 2) return text.replace(/\S/g, maskChar);
 			const startPos = text.indexOf(trimmed);
@@ -2943,7 +2943,7 @@ var LyricPlayerBase = class extends EventTarget {
 			let targetScale = 100;
 			if (!isActive && this.isPlaying) if (line.isBG) targetScale = 75;
 			else targetScale = SCALE_ASPECT;
-			const renderMode = isActive ? LyricLineRenderMode.GRADIENT : LyricLineRenderMode.SOLID;
+			const renderMode = isActive ? 1 : 0;
 			lineObj.setTransform(curPos, targetScale, targetOpacity, blurLevel, force, delay, renderMode);
 			if (line.isBG && (isActive || !this.isPlaying)) curPos += this.lyricLinesSize.get(lineObj)?.[1] ?? LINE_HEIGHT_FALLBACK;
 			else if (!line.isBG) curPos += this.lyricLinesSize.get(lineObj)?.[1] ?? LINE_HEIGHT_FALLBACK;
@@ -3096,8 +3096,17 @@ var LyricLineBase = class extends EventTarget {
 		posY: new Spring(0),
 		scale: new Spring(100)
 	};
+	/**
+	* 用于 CJK 词语边界检测的分词器
+	*/
+	static wordSegmenter = typeof Intl !== "undefined" && Intl.Segmenter ? new Intl.Segmenter(void 0, { granularity: "word" }) : null;
+	/**
+	* Unicode 标准的全局 Grapheme Cluster 分词器
+	* 用于正确处理 emoji、复合字符等
+	*/
+	static graphemeSegmenter = typeof Intl !== "undefined" && Intl.Segmenter ? new Intl.Segmenter(void 0, { granularity: "grapheme" }) : null;
 	onLineSizeChange(_size) {}
-	setTransform(top = this.top, scale = this.scale, opacity = this.opacity, blur = this.blur, _force = false, delay = 0, _mode = LyricLineRenderMode.SOLID) {
+	setTransform(top = this.top, scale = this.scale, opacity = this.opacity, blur = this.blur, _force = false, delay = 0, _mode = 0) {
 		this.top = top;
 		this.scale = scale;
 		this.opacity = opacity;
@@ -3122,8 +3131,277 @@ var LyricLineBase = class extends EventTarget {
 	dispose() {}
 };
 //#endregion
+//#region src/utils/lyric-line-break.ts
+/**
+* 单个词超过容器宽度时的大惩罚倍数
+*/
+const OVERFLOW_PENALTY_MULTIPLIER = 1e3;
+/**
+* 截断 CJK 词组边界的惩罚比例
+*
+* 相对于容器宽度
+*/
+const CJK_BREAK_PENALTY_RATIO = .15;
+/**
+* 截断普通文本（非空格、非 CJK 词界）的惩罚比例
+*/
+const NORMAL_BREAK_PENALTY_RATIO = .5;
+/**
+* 在空格处断开的奖励比例
+*/
+const SPACE_BREAK_REWARD_RATIO = .4;
+/**
+* 在标点符号处断开的奖励比例
+*
+* 比空格更高以便优先一点在标点处换行
+*/
+const PUNCTUATION_BREAK_REWARD_RATIO = .6;
+const PUNCTUATION_REGEX = /[,.;:!?，。；：！？、）】》」』’”)[\]}>~…]$/;
+/**
+* 计算平均行长度的断点位置
+* @param children 子节点信息
+* @param containerWidth 容器可用内容宽度
+* @param fullText 完整的行文本
+* @param segmenter 预创建的 Intl.Segmenter 分词器
+* @returns 需要在其前面插入 `<br>` 的子节点索引数组，升序
+*/
+function calcBalancedBreaks(children, containerWidth, fullText, segmenter) {
+	const n = children.length;
+	if (n === 0 || containerWidth <= 0) return [];
+	const cjkBoundaries = /* @__PURE__ */ new Set();
+	let offset = 0;
+	for (const { segment, isWordLike } of segmenter.segment(fullText)) {
+		if (offset > 0 && isWordLike) {
+			if ([...segment].some((ch) => isCJK(ch))) cjkBoundaries.add(offset);
+		}
+		offset += segment.length;
+	}
+	const charOffsets = new Int32Array(n + 1);
+	const prefixWidth = new Float64Array(n + 1);
+	for (let i = 0; i < n; i++) {
+		charOffsets[i + 1] = charOffsets[i] + children[i].text.length;
+		prefixWidth[i + 1] = prefixWidth[i] + children[i].width;
+	}
+	if (prefixWidth[n] <= containerWidth) return [];
+	/**
+	* dp[i] 表示将 index i 到 n-1 的节点进行排版的最小代价
+	*/
+	const dp = new Float64Array(n + 1).fill(Number.POSITIVE_INFINITY);
+	const nextBreak = new Int32Array(n + 1).fill(-1);
+	dp[n] = 0;
+	const PENALTY_CJK = (containerWidth * CJK_BREAK_PENALTY_RATIO) ** 2;
+	const PENALTY_NORMAL = (containerWidth * NORMAL_BREAK_PENALTY_RATIO) ** 2;
+	for (let i = n - 1; i >= 0; i--) for (let j = i + 1; j <= n; j++) {
+		const w = prefixWidth[j] - prefixWidth[i];
+		let lineCost = 0;
+		if (w > containerWidth) if (j === i + 1) lineCost = (w - containerWidth) ** 2 * OVERFLOW_PENALTY_MULTIPLIER;
+		else continue;
+		else lineCost = (containerWidth - w) ** 2;
+		let breakPenalty = 0;
+		if (j < n) {
+			const prevChild = children[j - 1];
+			if (PUNCTUATION_REGEX.test(prevChild.text)) breakPenalty = -((containerWidth * PUNCTUATION_BREAK_REWARD_RATIO) ** 2);
+			else if (prevChild.isSpace) breakPenalty = -((containerWidth * SPACE_BREAK_REWARD_RATIO) ** 2);
+			else if (cjkBoundaries.has(charOffsets[j])) breakPenalty = PENALTY_CJK;
+			else breakPenalty = PENALTY_NORMAL;
+		}
+		const totalCost = lineCost + breakPenalty + dp[j];
+		if (totalCost < dp[i]) {
+			dp[i] = totalCost;
+			nextBreak[i] = j;
+		}
+	}
+	const breaks = [];
+	let curr = 0;
+	while (curr < n) {
+		curr = nextBreak[curr];
+		if (curr > 0 && curr < n) breaks.push(curr);
+	}
+	return breaks;
+}
+//#endregion
+//#region src/utils/line-balancer.ts
+let sharedCanvasCtx = null;
+function getMeasurementContext() {
+	if (!sharedCanvasCtx) sharedCanvasCtx = document.createElement("canvas").getContext("2d");
+	return sharedCanvasCtx;
+}
+/**
+* 用于平衡歌词行在换行后的各行长度
+*/
+var LineBalancer = class {
+	isBalancing = false;
+	lastBalancedContainerWidth = -1;
+	constructor(mainElement) {
+		this.mainElement = mainElement;
+	}
+	balanceLineBreaks(isNonDynamic, hasSplittedWords, wordSegmenter) {
+		if (this.isBalancing || !this.mainElement) return;
+		const computedStyle = getComputedStyle(this.mainElement);
+		const paddingLeft = Number.parseFloat(computedStyle.paddingLeft) || 0;
+		const paddingRight = Number.parseFloat(computedStyle.paddingRight) || 0;
+		const containerWidth = this.mainElement.clientWidth - paddingLeft - paddingRight;
+		if (containerWidth <= 0) return;
+		if (isNonDynamic) {
+			this.balanceNonDynamicLineBreaks(containerWidth, computedStyle, wordSegmenter);
+			return;
+		}
+		if (!hasSplittedWords) return;
+		this.balanceDynamicLineBreaks(containerWidth, wordSegmenter);
+	}
+	reset() {
+		this.lastBalancedContainerWidth = -1;
+	}
+	executeLineBalance(containerWidth, adapter, wordSegmenter) {
+		const existingBrs = this.mainElement.querySelectorAll("br");
+		if (containerWidth === this.lastBalancedContainerWidth && existingBrs.length > 0) return;
+		adapter.resetDOM();
+		const prevWhiteSpace = this.mainElement.style.whiteSpace;
+		this.mainElement.style.whiteSpace = "nowrap";
+		const parentElement = this.mainElement.parentElement;
+		let prevTransform = "";
+		let transformChanged = false;
+		if (parentElement) {
+			prevTransform = parentElement.style.transform;
+			if (prevTransform && prevTransform !== "none") {
+				parentElement.style.transform = "none";
+				transformChanged = true;
+			}
+		}
+		let lockAcquired = false;
+		try {
+			const { childInfos, fullText } = adapter.buildChildInfos();
+			let layoutWidth = childInfos.reduce((sum, c) => sum + c.width, 0);
+			if (adapter.needsCalibration) {
+				const range = document.createRange();
+				range.selectNodeContents(this.mainElement);
+				const visualWidth = range.getBoundingClientRect().width;
+				if (layoutWidth > 0 && visualWidth > 0) {
+					const scale = visualWidth / layoutWidth;
+					for (const info of childInfos) info.width *= scale;
+				}
+				layoutWidth = visualWidth;
+			}
+			const safeContainerWidth = Math.max(1, containerWidth);
+			if (layoutWidth <= safeContainerWidth) {
+				this.lastBalancedContainerWidth = containerWidth;
+				return;
+			}
+			const breaks = calcBalancedBreaks(childInfos, safeContainerWidth, fullText, wordSegmenter);
+			if (breaks.length === 0) {
+				this.lastBalancedContainerWidth = containerWidth;
+				return;
+			}
+			this.isBalancing = true;
+			lockAcquired = true;
+			adapter.applyBreaks(breaks, childInfos);
+			this.lastBalancedContainerWidth = containerWidth;
+			this.isBalancing = false;
+		} finally {
+			this.mainElement.style.whiteSpace = prevWhiteSpace;
+			if (transformChanged && parentElement) parentElement.style.transform = prevTransform;
+			if (lockAcquired) this.isBalancing = false;
+		}
+	}
+	balanceDynamicLineBreaks(containerWidth, wordSegmenter) {
+		const infoToNode = [];
+		this.executeLineBalance(containerWidth, {
+			resetDOM: () => {
+				this.mainElement.querySelectorAll("br").forEach((br) => {
+					br.remove();
+				});
+			},
+			buildChildInfos: () => {
+				infoToNode.length = 0;
+				const childNodes = Array.from(this.mainElement.childNodes);
+				const childInfos = [];
+				const range = document.createRange();
+				for (const node of childNodes) if (node.nodeType === Node.TEXT_NODE) {
+					const text = node.textContent ?? "";
+					if (text.length === 0) continue;
+					range.selectNodeContents(node);
+					childInfos.push({
+						width: range.getBoundingClientRect().width,
+						text,
+						isSpace: text.trim().length === 0
+					});
+					infoToNode.push(node);
+				} else if (node.nodeType === Node.ELEMENT_NODE) {
+					const el = node;
+					const rect = el.getBoundingClientRect();
+					const elStyle = getComputedStyle(el);
+					const marginLeft = Number.parseFloat(elStyle.marginLeft) || 0;
+					const marginRight = Number.parseFloat(elStyle.marginRight) || 0;
+					childInfos.push({
+						width: Math.max(0, rect.width + marginLeft + marginRight),
+						text: el.textContent ?? "",
+						isSpace: false
+					});
+					infoToNode.push(node);
+				}
+				return {
+					childInfos,
+					fullText: childInfos.map((c) => c.text).join("")
+				};
+			},
+			applyBreaks: (breaks) => {
+				for (let i = breaks.length - 1; i >= 0; i--) {
+					const breakIndex = breaks[i];
+					if (breakIndex >= 0 && breakIndex < infoToNode.length) this.mainElement.insertBefore(document.createElement("br"), infoToNode[breakIndex]);
+				}
+			},
+			needsCalibration: false
+		}, wordSegmenter);
+	}
+	balanceNonDynamicLineBreaks(containerWidth, computedStyle, wordSegmenter) {
+		const fullText = this.mainElement.textContent ?? "";
+		if (fullText.trim().length === 0) return;
+		this.executeLineBalance(containerWidth, {
+			resetDOM: () => {
+				this.mainElement.innerHTML = "";
+				this.mainElement.textContent = fullText;
+			},
+			buildChildInfos: () => {
+				const ctx = getMeasurementContext();
+				if (!ctx) {
+					console.debug("Canvas 2D context is not supported, skipping line balancing");
+					return {
+						childInfos: [],
+						fullText
+					};
+				}
+				ctx.font = `${computedStyle.fontWeight} ${computedStyle.fontSize} ${computedStyle.fontFamily}`;
+				if ("letterSpacing" in ctx) ctx.letterSpacing = computedStyle.letterSpacing !== "normal" ? computedStyle.letterSpacing : "0px";
+				if ("wordSpacing" in ctx) ctx.wordSpacing = computedStyle.wordSpacing !== "normal" ? computedStyle.wordSpacing : "0px";
+				const childInfos = [];
+				for (const { segment } of wordSegmenter.segment(fullText)) childInfos.push({
+					width: ctx.measureText(segment).width,
+					text: segment,
+					isSpace: segment.trim().length === 0
+				});
+				return {
+					childInfos,
+					fullText
+				};
+			},
+			applyBreaks: (breaks, childInfos) => {
+				this.mainElement.innerHTML = "";
+				const breakSet = new Set(breaks);
+				const fragment = document.createDocumentFragment();
+				for (let i = 0; i < childInfos.length; i++) {
+					if (breakSet.has(i)) fragment.appendChild(document.createElement("br"));
+					fragment.appendChild(document.createTextNode(childInfos[i].text));
+				}
+				this.mainElement.appendChild(fragment);
+			},
+			needsCalibration: true
+		}, wordSegmenter);
+	}
+};
+//#endregion
 //#region src/utils/lyric-split-words.ts
-const hasSegmenter = typeof Intl !== "undefined" && typeof Intl.Segmenter !== "undefined";
+const SPLIT_WHITESPACE_RE = /(\s+)/;
+const WHITESPACE_RE = /\s/g;
 /**
 * 将输入的单词重新分组，之间没有空格的单词将会组合成一个单词数组
 *
@@ -3134,27 +3412,41 @@ const hasSegmenter = typeof Intl !== "undefined" && typeof Intl.Segmenter !== "u
 * @returns 重新分组后的单词数组
 */
 function chunkAndSplitLyricWords(words) {
-	const atoms = [];
+	const result = [];
+	let currentGroup = [];
+	const flushGroup = () => {
+		if (currentGroup.length > 0) {
+			result.push(currentGroup.length === 1 ? currentGroup[0] : [...currentGroup]);
+			currentGroup = [];
+		}
+	};
+	const processAtom = (atom) => {
+		const isSpace = atom.word.trim().length === 0;
+		const hasRuby = (atom.ruby?.length ?? 0) > 0;
+		const isCJKChar = isCJK(atom.word);
+		if (!isSpace && !hasRuby && !isCJKChar) currentGroup.push(atom);
+		else {
+			flushGroup();
+			result.push(atom);
+		}
+	};
 	for (const w of words) {
 		const isSpace = w.word.trim().length === 0;
 		const romanWord = w.romanWord ?? "";
 		const obscene = w.obscene ?? false;
 		const hasRuby = (w.ruby?.length ?? 0) > 0;
-		if (isSpace) {
-			atoms.push({ ...w });
+		if (isSpace || hasRuby) {
+			processAtom({ ...w });
 			continue;
 		}
-		if (hasRuby) {
-			atoms.push({ ...w });
-			continue;
-		}
-		const parts = w.word.split(/(\s+)/).filter((p) => p.length > 0);
+		const parts = w.word.split(SPLIT_WHITESPACE_RE).filter((p) => p.length > 0);
+		const totalLength = w.word.replace(WHITESPACE_RE, "").length || 1;
+		const timePerUnit = (w.endTime - w.startTime) / totalLength;
 		let currentOffset = 0;
-		const totalLength = w.word.replace(/\s/g, "").length || 1;
 		for (const part of parts) {
 			if (!part.trim()) {
-				const startTime = w.startTime + currentOffset / totalLength * (w.endTime - w.startTime);
-				atoms.push({
+				const startTime = w.startTime + currentOffset * timePerUnit;
+				processAtom({
 					word: part,
 					romanWord: "",
 					startTime,
@@ -3166,63 +3458,31 @@ function chunkAndSplitLyricWords(words) {
 			if (isCJK(part) && part.length > 1 && romanWord.trim().length === 0) {
 				const chars = part.split("");
 				for (const char of chars) {
-					const charDuration = 1 / totalLength * (w.endTime - w.startTime);
-					const startTime = w.startTime + currentOffset / totalLength * (w.endTime - w.startTime);
-					atoms.push({
+					const startTime = w.startTime + currentOffset * timePerUnit;
+					processAtom({
 						word: char,
 						romanWord: "",
 						startTime,
-						endTime: startTime + charDuration,
+						endTime: startTime + timePerUnit,
 						obscene
 					});
 					currentOffset += 1;
 				}
 			} else {
 				const partRealLen = part.length;
-				const duration = partRealLen / totalLength * (w.endTime - w.startTime);
-				const startTime = w.startTime + currentOffset / totalLength * (w.endTime - w.startTime);
-				atoms.push({
+				const startTime = w.startTime + currentOffset * timePerUnit;
+				processAtom({
 					word: part,
 					romanWord,
 					startTime,
-					endTime: startTime + duration,
+					endTime: startTime + partRealLen * timePerUnit,
 					obscene
 				});
 				currentOffset += partRealLen;
 			}
 		}
 	}
-	if (!hasSegmenter) return atoms;
-	const fullText = atoms.map((a) => a.word).join("");
-	const segmenter = new Intl.Segmenter(void 0, { granularity: "word" });
-	const segments = Array.from(segmenter.segment(fullText));
-	const result = [];
-	let atomIndex = 0;
-	let expectedLength = 0;
-	let actualLength = 0;
-	let currentGroup = [];
-	for (const segment of segments) {
-		const segmentLen = segment.segment.length;
-		expectedLength += segmentLen;
-		while (actualLength < expectedLength && atomIndex < atoms.length) {
-			const currentAtom = atoms[atomIndex];
-			currentGroup.push(currentAtom);
-			actualLength += currentAtom.word.length;
-			atomIndex++;
-		}
-		if (actualLength === expectedLength) {
-			while (currentGroup.length > 1 && !currentGroup[0].word.trim()) {
-				const spaceAtom = currentGroup.shift();
-				if (spaceAtom) result.push(spaceAtom);
-			}
-			if (currentGroup.length === 1) result.push(currentGroup[0]);
-			else if (currentGroup.length > 1) result.push(currentGroup);
-			currentGroup = [];
-		}
-	}
-	while (atomIndex < atoms.length) result.push(atoms[atomIndex++]);
-	if (currentGroup.length > 0) if (currentGroup.length === 1) result.push(currentGroup[0]);
-	else result.push(currentGroup);
+	flushGroup();
 	return result;
 }
 //#endregion
@@ -3304,12 +3564,15 @@ var LyricLineEl$1 = class extends LyricLineBase {
 	splittedWords = [];
 	built = false;
 	lineSize = [0, 0];
-	renderMode = LyricLineRenderMode.SOLID;
+	renderMode = 0;
 	currentBrightAlpha = 1;
 	currentDarkAlpha = .2;
 	targetBrightAlpha = 1;
 	targetDarkAlpha = .2;
-	segmenter = new Intl.Segmenter(void 0, { granularity: "grapheme" });
+	/**
+	* 用于平衡换行、尽量减少各行长度差异的类
+	*/
+	balancer;
 	constructor(lyricPlayer, lyricLine = {
 		words: [],
 		translatedLyric: "",
@@ -3337,6 +3600,7 @@ var LyricLineEl$1 = class extends LyricLineBase {
 		main.setAttribute("class", lyric_player_module_default.lyricMainLine);
 		trans.setAttribute("class", lyric_player_module_default.lyricSubLine);
 		roman.setAttribute("class", lyric_player_module_default.lyricSubLine);
+		if (LyricLineBase.wordSegmenter) this.balancer = new LineBalancer(main);
 		this.rebuildStyle();
 	}
 	listenersMap = /* @__PURE__ */ new Map();
@@ -3410,7 +3674,7 @@ var LyricLineEl$1 = class extends LyricLineBase {
 	disable() {
 		this.isEnabled = false;
 		this.element.classList.remove(lyric_player_module_default.active);
-		this.renderMode = LyricLineRenderMode.SOLID;
+		this.renderMode = 0;
 		const main = this.element.children[0];
 		for (const word of this.splittedWords) {
 			for (const a of word.elementAnimations) if (a.id === "float-word" || a.id.includes("emphasize-word-float-only")) {
@@ -3546,7 +3810,14 @@ var LyricLineEl$1 = class extends LyricLineBase {
 		const displayWord = this.lyricPlayer.processObsceneWord(word);
 		if (shouldEmphasize) {
 			mainWordEl.classList.add(lyric_player_module_default.emphasize);
-			for (const { segment } of this.segmenter.segment(displayWord.trim())) {
+			const trimmedWord = displayWord.trim();
+			if (LyricLineBase.graphemeSegmenter) for (const { segment } of LyricLineBase.graphemeSegmenter.segment(trimmedWord)) {
+				const charEl = document.createElement("span");
+				charEl.innerText = segment;
+				subElements.push(charEl);
+				wordContainer.appendChild(charEl);
+			}
+			else for (const segment of Array.from(trimmedWord)) {
 				const charEl = document.createElement("span");
 				charEl.innerText = segment;
 				subElements.push(charEl);
@@ -3728,6 +3999,7 @@ var LyricLineEl$1 = class extends LyricLineBase {
 				word.padding = 0;
 			}
 		}
+		if (this.balancer && LyricLineBase.wordSegmenter) this.balancer.balanceLineBreaks(this.lyricPlayer._getIsNonDynamic(), this.splittedWords.length > 0, LyricLineBase.wordSegmenter);
 		if (this.lyricPlayer.supportMaskImage) this.generateWebAnimationBasedMaskImage();
 		else this.generateCalcBasedMaskImage();
 		if (this.isEnabled) {
@@ -3900,7 +4172,7 @@ var LyricLineEl$1 = class extends LyricLineBase {
 		const factor = Math.max(0, Math.min(1, (scale - .97) / .03));
 		const dynamicDarkAlpha = factor * .2 + .2;
 		const dynamicBrightAlpha = factor * .8 + .2;
-		if (this.renderMode === LyricLineRenderMode.SOLID) {
+		if (this.renderMode === 0) {
 			this.targetBrightAlpha = dynamicDarkAlpha;
 			this.targetDarkAlpha = dynamicDarkAlpha;
 		} else {
@@ -3922,7 +4194,7 @@ var LyricLineEl$1 = class extends LyricLineBase {
 		this.element.style.setProperty("--bright-mask-alpha", this.currentBrightAlpha.toFixed(3));
 		this.element.style.setProperty("--dark-mask-alpha", this.currentDarkAlpha.toFixed(3));
 	}
-	setTransform(top = this.top, scale = this.scale, opacity = 1, blur = 0, force = false, delay = 0, mode = LyricLineRenderMode.SOLID) {
+	setTransform(top = this.top, scale = this.scale, opacity = 1, blur = 0, force = false, delay = 0, mode = 0) {
 		super.setTransform(top, scale, opacity, blur, force, delay);
 		this.renderMode = mode;
 		const beforeInSight = this.isInSight;
@@ -3979,6 +4251,7 @@ var LyricLineEl$1 = class extends LyricLineBase {
 		return !(t > pb + h + ov || b < -h - ov);
 	}
 	disposeElements() {
+		this.balancer?.reset();
 		for (const realWord of this.splittedWords) {
 			for (const a of realWord.elementAnimations) a.cancel();
 			for (const a of realWord.maskAnimations) a.cancel();