@braccato/core 0.1.6 → 0.1.7

package/dist/index.js

@@ -11,19 +11,19 @@ function B(t) {
     if (o === "s") return Math.round(n * 1e3);
     if (o === "ms") return Math.round(n);
   }
-  const r = t.split(":").map((n) => n.replace(/[^0-9.]/g, ""));
-  let a = 0;
+  const a = t.split(":").map((n) => n.replace(/[^0-9.]/g, ""));
+  let r = 0;
   try {
-    return r.length === 1 ? a = Number.parseFloat(r[0]) * 1e3 : r.length === 2 ? a = Number.parseInt(r[0], 10) * 6e4 + Number.parseFloat(r[1]) * 1e3 : r.length === 3 && (a = Number.parseInt(r[0], 10) * 36e5 + Number.parseInt(r[1], 10) * 6e4 + Number.parseFloat(r[2]) * 1e3), Math.round(a);
+    return a.length === 1 ? r = Number.parseFloat(a[0]) * 1e3 : a.length === 2 ? r = Number.parseInt(a[0], 10) * 6e4 + Number.parseFloat(a[1]) * 1e3 : a.length === 3 && (r = Number.parseInt(a[0], 10) * 36e5 + Number.parseInt(a[1], 10) * 6e4 + Number.parseFloat(a[2]) * 1e3), Math.round(r);
   } catch {
     return 0;
   }
 }
 function I(t, e) {
-  const r = t.getAttribute(e);
-  if (r !== null) return r;
-  for (const a of t.attributes)
-    if (a.localName === e) return a.value;
+  const a = t.getAttribute(e);
+  if (a !== null) return a;
+  for (const r of t.attributes)
+    if (r.localName === e) return r.value;
   return null;
 }
 function Y(t) {
@@ -34,23 +34,23 @@ function Y(t) {
     role: I(t, "role") ?? void 0,
     children: []
   };
-  for (const r of t.childNodes)
-    if (r.nodeType === 3) {
-      const a = r.textContent ?? "";
-      e.text += a, e.children.push({ text: a, children: [] });
-    } else r.nodeType === 1 && e.children.push(Y(r));
+  for (const a of t.childNodes)
+    if (a.nodeType === 3) {
+      const r = a.textContent ?? "";
+      e.text += r, e.children.push({ text: r, children: [] });
+    } else a.nodeType === 1 && e.children.push(Y(a));
   return e;
 }
-function $(t, e, r = !1) {
-  let a = "";
+function $(t, e, a = !1) {
+  let r = "";
   const n = [];
   let o = !1;
   for (const i of t) {
-    const s = r || i.role === "x-bg";
+    const s = a || i.role === "x-bg";
     if (i.children.length > 0)
-      if (s && !r) {
+      if (s && !a) {
         const c = $(i.children, e, !0);
-        a += c.text, n.push(...c.parts), c.isWordSynced && (o = !0);
+        r += c.text, n.push(...c.parts), c.isWordSynced && (o = !0);
       } else if (i.begin !== void 0 && i.end !== void 0) {
         const c = i.children.map((f) => f.text).join("") || i.text;
         n.push({
@@ -58,13 +58,13 @@ function $(t, e, r = !1) {
           durationMs: i.end - i.begin,
           words: c,
           isBackground: s || void 0
-        }), a += c, o = !0;
+        }), r += c, o = !0;
       } else {
         const c = $(i.children, e, s);
-        a += c.text, n.push(...c.parts), c.isWordSynced && (o = !0);
+        r += c.text, n.push(...c.parts), c.isWordSynced && (o = !0);
       }
     else if (i.text)
-      if (a += i.text, i.begin !== void 0 && i.end !== void 0)
+      if (r += i.text, i.begin !== void 0 && i.end !== void 0)
         n.push({
           startTimeMs: i.begin,
           durationMs: i.end - i.begin,
@@ -81,34 +81,34 @@ function $(t, e, r = !1) {
         });
       }
   }
-  return o ? { parts: n, text: a, isWordSynced: o } : { parts: [], text: a, isWordSynced: !1 };
+  return o ? { parts: n, text: r, isWordSynced: o } : { parts: [], text: r, isWordSynced: !1 };
 }
-function ut(t, e, r) {
+function ut(t, e, a) {
   if (t.length === 0) return t;
-  const a = [], n = (s, c) => ({
+  const r = [], n = (s, c) => ({
     startTimeMs: s,
     durationMs: c,
     words: "",
     parts: [],
     isInstrumental: !0
   });
-  t[0].startTimeMs > r && a.push(n(0, t[0].startTimeMs));
+  t[0].startTimeMs > a && r.push(n(0, t[0].startTimeMs));
   for (let s = 0; s < t.length; s++)
-    if (a.push(t[s]), s < t.length - 1) {
+    if (r.push(t[s]), s < t.length - 1) {
       const c = t[s].startTimeMs + t[s].durationMs, f = t[s + 1].startTimeMs - c;
-      f > r && a.push(n(c, f));
+      f > a && r.push(n(c, f));
     }
   const o = t[t.length - 1], i = o.startTimeMs + o.durationMs;
-  return e - i > r && a.push(n(i, e - i)), a;
+  return e - i > a && r.push(n(i, e - i)), r;
 }
 function mt(t, e = {}) {
-  const r = t.replace(/\\"/g, '"'), a = new DOMParser().parseFromString(r, "text/xml"), n = a.querySelector("tt"), o = (n ? I(n, "lang") : null) ?? void 0, i = a.querySelector("body");
+  const a = t.replace(/\\"/g, '"'), r = new DOMParser().parseFromString(a, "text/xml"), n = r.querySelector("tt"), o = (n ? I(n, "lang") : null) ?? void 0, i = r.querySelector("body");
   if (!i) return { lyrics: [], isWordSynced: !1, language: o };
   const s = i.getAttribute("dur"), c = s ? B(s) : 0, f = i.querySelectorAll("p"), d = /* @__PURE__ */ new Map();
   let l = !1;
   const m = /* @__PURE__ */ new Map(), p = [
-    ...a.querySelectorAll("agent"),
-    ...a.getElementsByTagNameNS("http://www.w3.org/ns/ttml#metadata", "agent")
+    ...r.querySelectorAll("agent"),
+    ...r.getElementsByTagNameNS("http://www.w3.org/ns/ttml#metadata", "agent")
   ];
   let w = 0;
   for (const _ of p) {
@@ -128,7 +128,7 @@ function mt(t, e = {}) {
       key: L
     });
   }
-  const b = a.querySelectorAll("translations");
+  const b = r.querySelectorAll("translations");
   for (const _ of b) {
     const h = _.getAttribute("lang");
     if (!h) continue;
@@ -141,7 +141,7 @@ function mt(t, e = {}) {
       }
     }
   }
-  const v = a.querySelectorAll("transliterations");
+  const v = r.querySelectorAll("transliterations");
   for (const _ of v) {
     const h = _.querySelectorAll("transliteration");
     for (const M of h) {
@@ -174,27 +174,27 @@ function tt(t) {
   if (!t) return 0;
   if (typeof t == "number") return t;
   const e = t.split(":");
-  let r = 0;
+  let a = 0;
   try {
     if (e.length === 1)
-      r = Number.parseFloat(e[0]) * 1e3;
+      a = Number.parseFloat(e[0]) * 1e3;
     else if (e.length === 2) {
-      const a = Number.parseInt(e[0], 10), n = Number.parseFloat(e[1]);
-      r = a * 60 * 1e3 + n * 1e3;
+      const r = Number.parseInt(e[0], 10), n = Number.parseFloat(e[1]);
+      a = r * 60 * 1e3 + n * 1e3;
     } else if (e.length === 3) {
-      const a = Number.parseInt(e[0], 10), n = Number.parseInt(e[1], 10), o = Number.parseFloat(e[2]);
-      r = a * 3600 * 1e3 + n * 60 * 1e3 + o * 1e3;
+      const r = Number.parseInt(e[0], 10), n = Number.parseInt(e[1], 10), o = Number.parseFloat(e[2]);
+      a = r * 3600 * 1e3 + n * 60 * 1e3 + o * 1e3;
     }
-    return Math.round(r);
+    return Math.round(a);
   } catch {
     return 0;
   }
 }
 function ht(t, e) {
-  var r;
-  const a = t.split(`
+  var a;
+  const r = t.split(`
 `), n = [], o = {};
-  for (const i of a) {
+  for (const i of r) {
     const s = i.trim(), c = s.match(/^\[(\w+):(.*)\]$/);
     if (c && pt.includes(c[1])) {
       o[c[1]] = c[2];
@@ -243,17 +243,17 @@ function ht(t, e) {
     let i = Number(o.offset);
     Number.isNaN(i) && (i = 0), i = i * 1e3;
     for (const s of n)
-      s.startTimeMs -= i, (r = s.parts) == null || r.forEach((c) => {
+      s.startTimeMs -= i, (a = s.parts) == null || a.forEach((c) => {
         c.startTimeMs -= i;
       });
   }
   return n;
 }
 function bt(t) {
-  for (const a of t)
-    if (a.parts)
-      for (let n = 1; n < a.parts.length; n++) {
-        const o = a.parts[n], i = a.parts[n - 1];
+  for (const r of t)
+    if (r.parts)
+      for (let n = 1; n < r.parts.length; n++) {
+        const o = r.parts[n], i = r.parts[n - 1];
         if (o.words === " " && i.words !== " ") {
           const s = o.durationMs - i.durationMs;
           if (Math.abs(s) <= 15 || o.durationMs <= 100) {
@@ -262,22 +262,22 @@ function bt(t) {
           }
         }
       }
-  let e = 0, r = 0;
-  for (const a of t)
-    if (!(!a.parts || a.parts.length === 0))
-      for (let n = 0; n < a.parts.length - 2; n++) {
-        const o = a.parts[n];
-        o.words !== " " && (o.durationMs <= 100 && e++, r++);
+  let e = 0, a = 0;
+  for (const r of t)
+    if (!(!r.parts || r.parts.length === 0))
+      for (let n = 0; n < r.parts.length - 2; n++) {
+        const o = r.parts[n];
+        o.words !== " " && (o.durationMs <= 100 && e++, a++);
       }
-  if (r > 0 && e / r > 0.5)
-    for (let a = 0; a < t.length; a++) {
-      const n = t[a];
+  if (a > 0 && e / a > 0.5)
+    for (let r = 0; r < t.length; r++) {
+      const n = t[r];
       if (!(!n.parts || n.parts.length === 0))
         for (let o = 0; o < n.parts.length; o++) {
           const i = n.parts[o];
           if (i.words !== " " && i.durationMs <= 400) {
             let s = null;
-            o + 1 < n.parts.length ? s = n.parts[o + 1] : a + 1 < t.length && t[a + 1].parts && t[a + 1].parts.length > 0 && (s = t[a + 1].parts[0]), s === null ? i.durationMs = 300 : s.words === " " ? (i.durationMs += s.durationMs, s.startTimeMs += s.durationMs, s.durationMs = 0) : i.durationMs = s.startTimeMs - i.startTimeMs;
+            o + 1 < n.parts.length ? s = n.parts[o + 1] : r + 1 < t.length && t[r + 1].parts && t[r + 1].parts.length > 0 && (s = t[r + 1].parts[0]), s === null ? i.durationMs = 300 : s.words === " " ? (i.durationMs += s.durationMs, s.startTimeMs += s.durationMs, s.durationMs = 0) : i.durationMs = s.startTimeMs - i.startTimeMs;
           }
         }
     }
@@ -287,36 +287,36 @@ const gt = {
     return /\[\d+:\d+\.\d+\]/.test(t);
   },
   parse(t, e = 0) {
-    const r = ht(t, e);
-    return bt(r), r;
+    const a = ht(t, e);
+    return bt(a), a;
   }
 };
 function et(t) {
   const e = t.trim().match(/^(\d+):(\d+):(\d+)[,.](\d+)$/);
   if (!e) return 0;
-  const r = Number.parseInt(e[1], 10), a = Number.parseInt(e[2], 10), n = Number.parseInt(e[3], 10), o = Number.parseInt(e[4].padEnd(3, "0").slice(0, 3), 10);
-  return r * 36e5 + a * 6e4 + n * 1e3 + o;
+  const a = Number.parseInt(e[1], 10), r = Number.parseInt(e[2], 10), n = Number.parseInt(e[3], 10), o = Number.parseInt(e[4].padEnd(3, "0").slice(0, 3), 10);
+  return a * 36e5 + r * 6e4 + n * 1e3 + o;
 }
 const yt = {
   detect(t) {
     return /\d+\r?\n\d{2}:\d{2}:\d{2}[,.]\d+ --> \d{2}:\d{2}:\d{2}[,.]\d+/.test(t);
   },
   parse(t, e = 0) {
-    const r = t.trim().split(/\r?\n\r?\n/), a = [];
-    for (const n of r) {
+    const a = t.trim().split(/\r?\n\r?\n/), r = [];
+    for (const n of a) {
       const o = n.split(/\r?\n/);
       if (o.length < 2) continue;
       const i = o.find((p) => p.includes("-->"));
       if (!i) continue;
       const [s, c] = i.split("-->").map((p) => p.trim()), f = et(s), d = et(c), l = o.indexOf(i), m = o.slice(l + 1).join(`
 `).replace(/<[^>]+>/g, "").trim();
-      m && a.push({
+      m && r.push({
         startTimeMs: f,
         words: m,
         durationMs: d - f
       });
     }
-    return a;
+    return r;
   }
 }, ct = {
   detect(t) {
@@ -324,9 +324,9 @@ const yt = {
   },
   parse(t, e = 0) {
     return t.split(`
-`).map((r) => ({
+`).map((a) => ({
       startTimeMs: 0,
-      words: r,
+      words: a,
       durationMs: 0
     }));
   }
@@ -335,9 +335,9 @@ const yt = {
     return /\[\d+,\d+\]/.test(t) && /\(\d+,\d+\)/.test(t);
   },
   parse(t, e = 0) {
-    const r = t.split(`
-`), a = [];
-    for (const n of r) {
+    const a = t.split(`
+`), r = [];
+    for (const n of a) {
       const o = n.trim().match(/^\[(\d+),(\d+)\](.*)$/);
       if (!o) continue;
       const i = Number.parseInt(o[1], 10), s = Number.parseInt(o[2], 10), c = o[3], f = [];
@@ -347,14 +347,14 @@ const yt = {
         const p = m[1], w = Number.parseInt(m[2], 10), b = Number.parseInt(m[3], 10);
         d += p, f.push({ startTimeMs: w, words: p, durationMs: b });
       }
-      a.push({
+      r.push({
         startTimeMs: i,
         words: d,
         durationMs: s,
         parts: f.length > 0 ? f : void 0
       });
     }
-    return a;
+    return r;
   }
 }, vt = [ft, gt, yt, St, ct];
 function wt(t) {
@@ -378,28 +378,28 @@ function _t() {
 function Mt(t) {
   t.skipScrollsDecayTimes = [], t.doneFirstInstantScroll = !1, t.queuedScroll = !1;
 }
-function rt(t) {
+function at(t) {
   t.wasUserScrolling = !0, t.scrollResumeTime = Date.now() + Tt;
 }
-function at(t) {
+function rt(t) {
   t.scrollResumeTime = 0;
 }
 function At(t) {
   return t.scrollResumeTime > Date.now();
 }
 function Et(t, e) {
-  let r = 0;
-  for (; r < t.skipScrollsDecayTimes.length && !(t.skipScrollsDecayTimes[r] > e); r++)
+  let a = 0;
+  for (; a < t.skipScrollsDecayTimes.length && !(t.skipScrollsDecayTimes[a] > e); a++)
     ;
-  t.skipScrollsDecayTimes = t.skipScrollsDecayTimes.slice(r), t.skipScrolls -= r, t.skipScrolls < 1 && (t.skipScrolls = 1);
+  t.skipScrollsDecayTimes = t.skipScrollsDecayTimes.slice(a), t.skipScrolls -= a, t.skipScrolls < 1 && (t.skipScrolls = 1);
 }
-const W = "braccato--animating", G = "braccato--pre-animating", q = "braccato--paused", nt = "braccato--active", Ct = "braccato--user-scrolling", Lt = 0.5, xt = 0.5, Nt = 0.62, kt = 0.37, It = 150, Q = /* @__PURE__ */ new Map();
+const W = "braccato--animating", H = "braccato--pre-animating", q = "braccato--paused", nt = "braccato--active", Ct = "braccato--user-scrolling", Lt = 0.5, xt = 0.5, Nt = 0.62, kt = 0.37, It = 150, Q = /* @__PURE__ */ new Map();
 function Dt(t) {
   return t ? t.endsWith("ms") ? Number.parseFloat(t.slice(0, -2)) : t.endsWith("s") ? Number.parseFloat(t.slice(0, -1)) * 1e3 : 0 : 0;
 }
 function U(t, e) {
-  let r = Q.get(e);
-  return r === void 0 && (r = Dt(getComputedStyle(t).getPropertyValue(e)), Q.set(e, r)), r;
+  let a = Q.get(e);
+  return a === void 0 && (a = Dt(getComputedStyle(t).getPropertyValue(e)), Q.set(e, a)), a;
 }
 function it(t) {
   t.offsetHeight;
@@ -418,8 +418,8 @@ function Pt(t) {
   Mt(t.scroll), t.lastActiveElements = [], Q.clear();
 }
 function zt(t, e) {
-  const r = Date.now();
-  let { currentTime: a, isPlaying: n, smoothScroll: o } = e;
+  const a = Date.now();
+  let { currentTime: r, isPlaying: n, smoothScroll: o } = e;
   const {
     eventCreationTime: i,
     lyricsData: s,
@@ -429,14 +429,14 @@ function zt(t, e) {
     earlyScrollConsider: l = Nt,
     queueScrollMs: m = It
   } = e;
-  if (a === 0 && !n) return;
-  const p = Math.abs(a - t.lastTime - (i - t.lastEventCreationTime) / 1e3) > Lt;
-  t.lastTime = a, t.lastPlayState = n, t.lastEventCreationTime = i;
-  const w = n ? r - i : 0;
-  a += w / 1e3;
+  if (r === 0 && !n) return;
+  const p = Math.abs(r - t.lastTime - (i - t.lastEventCreationTime) / 1e3) > Lt;
+  t.lastTime = r, t.lastPlayState = n, t.lastEventCreationTime = i;
+  const w = n ? a - i : 0;
+  r += w / 1e3;
   const { lines: b, container: v, syncType: P } = s;
-  P === "richsync" ? a += U(v, "--braccato-richsync-timing-offset") / 1e3 : a += U(v, "--braccato-timing-offset") / 1e3;
-  const T = a + U(v, "--braccato-scroll-timing-offset") / 1e3, _ = c.getBoundingClientRect().height;
+  P === "richsync" ? r += U(v, "--braccato-richsync-timing-offset") / 1e3 : r += U(v, "--braccato-timing-offset") / 1e3;
+  const T = r + U(v, "--braccato-scroll-timing-offset") / 1e3, _ = c.getBoundingClientRect().height;
   let h = c.scrollTop;
   const M = [], L = [];
   let k = p;
@@ -444,9 +444,9 @@ function zt(t, e) {
     const u = b[y], g = u.time, A = y + 1 < b.length ? b[y + 1].time : Number.POSITIVE_INFINITY;
     T >= g - l && (T < A || T < g + u.duration) ? (M.push(u), !t.lastActiveElements.includes(u) && T >= g && (k = !0), t.selectedElementIndex = y, u.isScrolled || (u.element.classList.add(nt), u.isScrolled = !0)) : u.isScrolled && (u.element.classList.remove(nt), u.isScrolled = !1);
     const x = n ? 2 : 0, N = Math.max(A, g + u.duration + 0.05);
-    if (a + x >= g && a < N) {
+    if (r + x >= g && r < N) {
       u.isSelected = !0;
-      const O = a - g, z = (r - u.animationStartTimeMs) / 1e3 - O;
+      const O = r - g, z = (a - u.animationStartTimeMs) / 1e3 - O;
       if (u.accumulatedOffsetMs = u.accumulatedOffsetMs / 1.08, u.accumulatedOffsetMs += z * 1e3 * 0.4, u.isAnimating && Math.abs(u.accumulatedOffsetMs) > 100 && n && (u.isAnimating = !1), n !== u.isAnimationPlayStatePlaying) {
         u.isAnimationPlayStatePlaying = n;
         const J = [u, ...u.parts];
@@ -456,13 +456,13 @@ function zt(t, e) {
           u.isAnimating = !1;
         } else
           for (const F of J)
-            F.animationStartTimeMs > r ? (F.element.classList.remove(W), F.element.classList.remove(G)) : F.element.classList.add(q);
+            F.animationStartTimeMs > a ? (F.element.classList.remove(W), F.element.classList.remove(H)) : F.element.classList.add(q);
       }
       u.isAnimating || L.push(u);
     } else if (u.isSelected) {
       const O = [u, ...u.parts];
       for (const z of O)
-        z.element.style.setProperty("--braccato-swipe-delay", ""), z.element.style.setProperty("--braccato-anim-delay", ""), z.element.classList.remove(W), z.element.classList.remove(G), z.element.classList.remove(q), z.animationStartTimeMs = Number.POSITIVE_INFINITY;
+        z.element.style.setProperty("--braccato-swipe-delay", ""), z.element.style.setProperty("--braccato-anim-delay", ""), z.element.classList.remove(W), z.element.classList.remove(H), z.element.classList.remove(q), z.animationStartTimeMs = Number.POSITIVE_INFINITY;
       u.isSelected = !1, u.isAnimating = !1;
     }
   }
@@ -470,43 +470,43 @@ function zt(t, e) {
     for (const y of L) {
       const u = [y, ...y.parts];
       for (const g of u) {
-        const A = a - g.time;
-        g.element.classList.remove(W), g.element.classList.remove(q), g.element.style.setProperty("--braccato-swipe-delay", `${-A - g.duration * 0.1}s`), g.element.style.setProperty("--braccato-anim-delay", `${-A}s`), g.element.classList.add(G);
+        const A = r - g.time;
+        g.element.classList.remove(W), g.element.classList.remove(q), g.element.style.setProperty("--braccato-swipe-delay", `${-A - g.duration * 0.1}s`), g.element.style.setProperty("--braccato-anim-delay", `${-A}s`), g.element.classList.add(H);
       }
     }
     it(L[0].element);
     for (const y of L) {
       const u = [y, ...y.parts];
       for (const g of u) {
-        const A = a - g.time;
-        g.element.classList.add(W), g.animationStartTimeMs = r - A * 1e3;
+        const A = r - g.time;
+        g.element.classList.add(W), g.animationStartTimeMs = a - A * 1e3;
       }
-      y.isAnimating = !0, y.lastAnimSetupAt = r, y.isAnimationPlayStatePlaying = !0, y.accumulatedOffsetMs = 0;
+      y.isAnimating = !0, y.lastAnimSetupAt = a, y.isAnimationPlayStatePlaying = !0, y.accumulatedOffsetMs = 0;
     }
   }
   const S = t.scroll;
-  if (S.scrollResumeTime < r || S.scrollPos === -1) {
+  if (S.scrollResumeTime < a || S.scrollPos === -1) {
     M.length === 0 && M.push(b[0]), t.lastActiveElements = M.filter((N) => T >= N.time);
     const y = _ * f, u = M[M.length - 1], g = M.filter((N, O) => T < N.time + N.duration - d || O === M.length - 1).map((N) => N.position + N.height / 2);
     let x = g.reduce((N, O) => N + O, 0) / g.length - y;
     if (x = Math.min(x, M[0].position), x = Math.max(x, u.position - _ + u.height), x = Math.min(x, u.position), x = Math.max(0, x), h === 0 && !S.doneFirstInstantScroll && (o = !1, S.doneFirstInstantScroll = !0, S.nextScrollAllowedTime = 0), S.wasUserScrolling || k || S.queuedScroll)
-      if (r > S.nextScrollAllowedTime) {
+      if (a > S.nextScrollAllowedTime) {
         if (S.queuedScroll = !1, o && Math.abs(h - x) > 2) {
           v.style.transitionTimingFunction = "", v.style.transitionProperty = "", v.style.transitionDuration = "";
           const N = U(v, "transition-duration");
-          v.style.transition = "none", v.style.transform = `translate(0px, ${-(h - x)}px)`, it(v), v.style.transition = "", v.style.transform = "translate(0px, 0px)", S.nextScrollAllowedTime = N + r + 20;
+          v.style.transition = "none", v.style.transform = `translate(0px, ${-(h - x)}px)`, it(v), v.style.transition = "", v.style.transform = "translate(0px, 0px)", S.nextScrollAllowedTime = N + a + 20;
         }
-        h = x, S.scrollPos = h, c.scrollTop = h, S.skipScrolls += 1, S.skipScrollsDecayTimes.push(r + 2e3);
-      } else (S.nextScrollAllowedTime - r < m || p) && (S.queuedScroll = !0);
+        h = x, S.scrollPos = h, c.scrollTop = h, S.skipScrolls += 1, S.skipScrollsDecayTimes.push(a + 2e3);
+      } else (S.nextScrollAllowedTime - a < m || p) && (S.queuedScroll = !0);
   }
-  S.wasUserScrolling && S.scrollResumeTime < r && (v.classList.remove(Ct), S.wasUserScrolling = !1), Et(S, r);
+  S.wasUserScrolling && S.scrollResumeTime < a && (v.classList.remove(Ct), S.wasUserScrolling = !1), Et(S, a);
 }
 const C = "http://www.w3.org/2000/svg", Ot = "braccato--instrumental", Ft = "braccato--instrumental-icon", Bt = "braccato--instrumental-bg", Wt = "braccato--instrumental-fill", qt = "braccato--wave-clip", Ut = "braccato--wave-rect", $t = "braccato--wave-path", st = "M10 21q-1.65 0-2.825-1.175T6 17t1.175-2.825T10 13q.575 0 1.063.138t.937.412V4q0-.425.288-.712T13 3h4q.425 0 .713.288T18 4v2q0 .425-.288.713T17 7h-3v10q0 1.65-1.175 2.825T10 21";
-function Gt(t, e) {
-  const r = document.createElement("div");
-  r.classList.add(Ot), r.style.setProperty("--braccato-duration", `${t}ms`);
-  const a = document.createElementNS(C, "svg");
-  a.classList.add(Ft), a.setAttribute("viewBox", "0 0 24 24");
+function Ht(t, e) {
+  const a = document.createElement("div");
+  a.classList.add(Ot), a.style.setProperty("--braccato-duration", `${t}ms`);
+  const r = document.createElementNS(C, "svg");
+  r.classList.add(Ft), r.setAttribute("viewBox", "0 0 24 24");
   const n = document.createElementNS(C, "defs"), o = `braccato-glow-${e}`, i = `braccato-wave-clip-${e}`, s = document.createElementNS(C, "filter");
   s.setAttribute("id", o), s.setAttribute("x", "-100%"), s.setAttribute("y", "-100%"), s.setAttribute("width", "300%"), s.setAttribute("height", "300%");
   const c = document.createElementNS(C, "feGaussianBlur");
@@ -522,117 +522,118 @@ function Gt(t, e) {
   const w = document.createElementNS(C, "path");
   w.classList.add(Ut), w.setAttribute("d", "M -4 3.9 L 30 3.9 L 30 30 L -4 30 Z"), p.appendChild(w);
   const b = document.createElementNS(C, "path");
-  b.classList.add($t), b.setAttribute("d", "M -4 3 Q 1 2 5 3 Q 10 4 14 3 Q 18 2 22 3 Q 26 4 30 3 L 30 4 L -4 4 Z"), p.appendChild(b), n.appendChild(p), a.appendChild(n);
+  b.classList.add($t), b.setAttribute("d", "M -4 3 Q 1 2 5 3 Q 10 4 14 3 Q 18 2 22 3 Q 26 4 30 3 L 30 4 L -4 4 Z"), p.appendChild(b), n.appendChild(p), r.appendChild(n);
   const v = document.createElementNS(C, "path");
-  v.classList.add(Bt), v.setAttribute("d", st), a.appendChild(v);
+  v.classList.add(Bt), v.setAttribute("d", st), r.appendChild(v);
   const P = document.createElementNS(C, "g");
   P.setAttribute("filter", `url(#${o})`);
   const T = document.createElementNS(C, "path");
-  return T.classList.add(Wt), T.setAttribute("clip-path", `url(#${i})`), T.setAttribute("d", st), P.appendChild(T), a.appendChild(P), r.appendChild(a), r;
+  return T.classList.add(Wt), T.setAttribute("clip-path", `url(#${i})`), T.setAttribute("d", st), P.appendChild(T), r.appendChild(P), a.appendChild(r), a;
 }
-const Ht = /[\p{Script=Arabic}\p{Script=Hebrew}\p{Script=Syriac}\p{Script=Thaana}]/u;
+const Gt = /[\p{Script=Arabic}\p{Script=Hebrew}\p{Script=Syriac}\p{Script=Thaana}]/u;
 function j(t) {
-  return Ht.test(t);
+  return Gt.test(t);
 }
-const Yt = /[\s​­\p{Dash_Punctuation}]/u, Qt = /\s+$/, jt = 5;
-function Vt(t) {
+const Yt = /[\s​­\p{Dash_Punctuation}]/u, Qt = /\s+$/, jt = 5, Vt = /[\p{sc=Han}\p{sc=Hiragana}\p{sc=Katakana}\p{sc=Hangul}\p{sc=Thai}\p{sc=Lao}\p{sc=Khmer}\p{sc=Myanmar}]/u;
+function Zt(t) {
   const e = t.replace(Qt, "");
   return e.length <= jt ? !1 : !Yt.test(e);
 }
-function Zt(t) {
+function Kt(t) {
   try {
-    const e = new Intl.Segmenter(void 0, { granularity: "word" }), r = Array.from(e.segment(t), (n) => n.segment);
-    if (r.length > 1) return r;
-    const a = new Intl.Segmenter(void 0, { granularity: "grapheme" });
-    return Array.from(a.segment(t), (n) => n.segment);
+    const e = new Intl.Segmenter(void 0, { granularity: "word" }), a = Array.from(e.segment(t), (n) => n.segment);
+    if (a.length > 1) return a;
+    if (!Vt.test(t)) return [t];
+    const r = new Intl.Segmenter(void 0, { granularity: "grapheme" });
+    return Array.from(r.segment(t), (n) => n.segment);
   } catch {
     return Array.from(t);
   }
 }
-function Kt(t) {
-  if (!Vt(t.words))
+function Jt(t) {
+  if (!Zt(t.words))
     return [{ ...t, isWrapAfter: !1 }];
-  const e = Zt(t.words);
+  const e = Kt(t.words);
   if (e.length <= 1)
     return [{ ...t, isWrapAfter: !1 }];
-  const r = t.durationMs / e.length;
-  return e.map((a, n) => ({
-    startTimeMs: t.startTimeMs + n * r,
-    durationMs: r,
-    words: a,
+  const a = t.durationMs / e.length;
+  return e.map((r, n) => ({
+    startTimeMs: t.startTimeMs + n * a,
+    durationMs: a,
+    words: r,
     isBackground: t.isBackground,
     isWrapAfter: n < e.length - 1
   }));
 }
-const Jt = "braccato--line", Xt = "braccato--word", te = "braccato--break", V = "braccato-background-lyric", Z = "braccato-rtl", ee = "braccato-zero-dur-animate", re = "braccato--romanized", ae = "braccato--translated", ne = /[\s​­\p{Dash_Punctuation}]/u;
-function ie(t, e) {
-  for (let r = e - 1; r >= 0; r--)
-    if (!t[r].isInstrumental && t[r].agent) return t[r].agent;
-  for (let r = e + 1; r < t.length; r++)
-    if (!t[r].isInstrumental && t[r].agent) return t[r].agent;
-}
+const Xt = "braccato--line", te = "braccato--word", ee = "braccato--break", V = "braccato-background-lyric", Z = "braccato-rtl", ae = "braccato-zero-dur-animate", re = "braccato--romanized", ne = "braccato--translated", ie = /[\s​­\p{Dash_Punctuation}]/u;
 function se(t, e) {
-  var r, a;
+  for (let a = e - 1; a >= 0; a--)
+    if (!t[a].isInstrumental && t[a].agent) return t[a].agent;
+  for (let a = e + 1; a < t.length; a++)
+    if (!t[a].isInstrumental && t[a].agent) return t[a].agent;
+}
+function oe(t, e) {
+  var a, r;
   for (let n = e - 1; n >= 0; n--)
-    if (!t[n].isInstrumental && ((r = t[n].words) != null && r.trim())) return j(t[n].words);
-  for (let n = e + 1; n < t.length; n++)
     if (!t[n].isInstrumental && ((a = t[n].words) != null && a.trim())) return j(t[n].words);
+  for (let n = e + 1; n < t.length; n++)
+    if (!t[n].isInstrumental && ((r = t[n].words) != null && r.trim())) return j(t[n].words);
   return !1;
 }
-function H(t, e) {
-  const r = document.createElement("span");
-  r.classList.add(te), r.style.order = String(e), t.appendChild(r);
+function G(t, e) {
+  const a = document.createElement("span");
+  a.classList.add(ee), a.style.order = String(e), t.appendChild(a);
 }
-function oe(t, e) {
-  let r = [], a = !1;
+function ce(t, e) {
+  let a = [], r = !1;
   const n = () => {
-    if (r.length > 0) {
+    if (a.length > 0) {
       const o = document.createElement("span");
-      for (const i of r) o.appendChild(i);
-      a && o.classList.add(V), t.appendChild(o), r = [];
+      for (const i of a) o.appendChild(i);
+      r && o.classList.add(V), t.appendChild(o), a = [];
     }
   };
   for (const o of e) {
     const i = o.classList.contains(V);
-    a !== i && (n(), a = i), r.push(o);
-    const s = o.textContent ?? "", c = s.length > 0 && ne.test(s[s.length - 1]), f = o.dataset.wrapAfter === "true";
+    r !== i && (n(), r = i), a.push(o);
+    const s = o.textContent ?? "", c = s.length > 0 && ie.test(s[s.length - 1]), f = o.dataset.wrapAfter === "true";
     (c || f) && n();
   }
   n();
 }
-function ot(t, e, r, a) {
+function ot(t, e, a, r) {
   let n = [], o = !0;
   const i = [];
   for (const s of t) {
     const c = j(s.words);
     !c && s.words.trim().length > 0 && (o = !1, n.reverse().forEach((d) => i.push(d)), n = []);
-    const f = Kt(s);
+    const f = Jt(s);
     for (const d of f) {
       const l = document.createElement("span");
-      l.classList.add(Xt), d.durationMs === 0 && l.classList.add(ee), c && l.classList.add(Z);
+      l.classList.add(te), d.durationMs === 0 && l.classList.add(ae), c && l.classList.add(Z);
       const m = {
         time: d.startTimeMs / 1e3,
         duration: d.durationMs / 1e3,
         element: l,
         animationStartTimeMs: Number.POSITIVE_INFINITY
       };
-      l.textContent = d.words, l.dataset.time = String(m.time), l.dataset.duration = String(m.duration), l.dataset.content = d.words, l.style.setProperty("--braccato-duration", `${d.durationMs}ms`), d.durationMs > a && (l.dataset.longWord = "true"), d.isBackground && l.classList.add(V), d.isWrapAfter && (l.dataset.wrapAfter = "true"), d.words.trim().length === 0 && (l.style.display = "inline"), d.words.trim().length !== 0 && e.parts.push(m), c ? n.push(l) : i.push(l);
+      l.textContent = d.words, l.dataset.time = String(m.time), l.dataset.duration = String(m.duration), l.dataset.content = d.words, l.style.setProperty("--braccato-duration", `${d.durationMs}ms`), d.durationMs > r && (l.dataset.longWord = "true"), d.isBackground && l.classList.add(V), d.isWrapAfter && (l.dataset.wrapAfter = "true"), d.words.trim().length === 0 && (l.style.display = "inline"), d.words.trim().length !== 0 && e.parts.push(m), c ? n.push(l) : i.push(l);
     }
   }
   if (o && n.length > 0) {
-    r.classList.add(Z);
+    a.classList.add(Z);
     for (const s of n) i.push(s);
   } else n.length > 0 && n.reverse().forEach((s) => i.push(s));
-  oe(r, i);
+  ce(a, i);
 }
-function ce(t, e, r = {}) {
-  const { longWordThreshold: a = 1500, lineSyncedAnimationDelay: n = 50, disableRichsync: o = !1 } = r;
+function le(t, e, a = {}) {
+  const { longWordThreshold: r = 1500, lineSyncedAnimationDelay: n = 50, disableRichsync: o = !1 } = a;
   e.replaceChildren();
   let s = t.every((d) => d.startTimeMs === 0) ? "none" : "synced";
   const c = [];
   for (let d = 0; d < t.length; d++) {
-    const l = t[d], m = l.isInstrumental ? Gt(l.durationMs, d) : document.createElement("div");
-    m.classList.add(Jt);
+    const l = t[d], m = l.isInstrumental ? Ht(l.durationMs, d) : document.createElement("div");
+    m.classList.add(Xt);
     const p = {
       element: m,
       time: l.startTimeMs / 1e3,
@@ -650,8 +651,8 @@ function ce(t, e, r = {}) {
     };
     if (l.isInstrumental) {
       m.dataset.instrumental = "true", m.dataset.time = String(p.time), m.dataset.duration = String(p.duration), m.dataset.lineNumber = String(d);
-      const b = ie(t, d);
-      b && (m.dataset.agent = b), se(t, d) && m.classList.add(Z), c.push(p), e.appendChild(m);
+      const b = se(t, d);
+      b && (m.dataset.agent = b), oe(t, d) && m.classList.add(Z), c.push(p), e.appendChild(m);
       continue;
     }
     let w = l.parts ?? [];
@@ -659,16 +660,16 @@ function ce(t, e, r = {}) {
       startTimeMs: l.startTimeMs + v * n,
       words: b.trim().length < 1 ? b : `${b} `,
       durationMs: 0
-    }))), w.every((b) => b.durationMs === 0) || (s = "richsync"), ot(w, p, m, a), H(m, 1), m.dataset.time = String(p.time), m.dataset.duration = String(p.duration), m.dataset.lineNumber = String(d), m.style.setProperty("--braccato-duration", `${l.durationMs}ms`), l.agent && (m.dataset.agent = l.agent), l.romanization) {
-      H(m, 4);
+    }))), w.every((b) => b.durationMs === 0) || (s = "richsync"), ot(w, p, m, r), G(m, 1), m.dataset.time = String(p.time), m.dataset.duration = String(p.duration), m.dataset.lineNumber = String(d), m.style.setProperty("--braccato-duration", `${l.durationMs}ms`), l.agent && (m.dataset.agent = l.agent), l.romanization) {
+      G(m, 4);
       const b = document.createElement("div");
-      b.classList.add(re), b.style.order = "5", l.timedRomanization && l.timedRomanization.length > 0 && !o ? ot(l.timedRomanization, p, b, a) : b.textContent = `
+      b.classList.add(re), b.style.order = "5", l.timedRomanization && l.timedRomanization.length > 0 && !o ? ot(l.timedRomanization, p, b, r) : b.textContent = `
 ${l.romanization}`, m.appendChild(b);
     }
     if (l.translation) {
-      H(m, 6);
+      G(m, 6);
       const b = document.createElement("div");
-      b.classList.add(ae), b.style.order = "7", b.textContent = `
+      b.classList.add(ne), b.style.order = "7", b.textContent = `
 ${l.translation.text}`, m.appendChild(b);
     }
     c.push(p), e.appendChild(m);
@@ -683,13 +684,13 @@ ${l.translation.text}`, m.appendChild(b);
     container: e
   };
 }
-const le = ':host{display:block;overflow-y:auto;position:relative;container-type:size;scrollbar-width:none}:host::-webkit-scrollbar{display:none}:host(:has(.braccato--user-scrolling)){scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent}:host(:has(.braccato--user-scrolling))::-webkit-scrollbar{display:block;width:6px}:host(:has(.braccato--user-scrolling))::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:3px}:host(:has(.braccato--user-scrolling))::-webkit-scrollbar-track{background:transparent}.braccato-container{font-family:var(--braccato-font-family);font-size:var(--braccato-font-size);font-weight:var(--braccato-font-weight);isolation:isolate;line-height:var(--braccato-line-height);position:relative;z-index:1;transition:transform var(--braccato-scroll-duration) var(--braccato-scroll-timing-function) 0s;padding-top:2rem;padding-bottom:var(--braccato-padding-bottom)}.braccato-container>div{cursor:pointer;padding:var(--braccato-padding) 0;transform-origin:left center;word-break:break-word;transition:filter calc(var(--braccato-duration) / 3) .4s,opacity calc(var(--braccato-duration) / 2) .166s,transform .166s var(--braccato-anim-delay, 0s)}.braccato-container:has(.braccato--active):not(.braccato--user-scrolling)>div:not(.braccato--active):not(.braccato--active~div){opacity:.33;filter:blur(2.5px)}.braccato-container>div.braccato--active{opacity:1;filter:blur(0px)}.braccato-container>div.braccato--active~div{opacity:.66;filter:blur(0px)}.braccato-container>.braccato--animating{opacity:1!important;filter:blur(0px)!important}.braccato-container>div:hover{opacity:1!important;filter:blur(0px)!important;transform:scale(var(--braccato-hover-scale, 1.01));transition:all .3s ease}.braccato--active{cursor:default}:not(.braccato-background-lyric){order:0}.braccato-background-lyric{order:2}.braccato--line>span>span.braccato-background-lyric{font-size:.675em;font-weight:400}.braccato--line{transform:scale(var(--braccato-scale));transition-property:transform;transition-duration:var(--braccato-scale-transition-duration);transition-timing-function:ease;display:flex;flex-flow:row wrap;align-items:start;align-content:flex-start;padding-left:.25em;padding-right:.25em;box-sizing:border-box}.braccato--line.braccato--animating{transform:scale(var(--braccato-active-scale));transition-delay:var(--braccato-anim-delay)}.braccato--line>span{color:var(--braccato-inactive-color);display:inline-block;white-space:pre-wrap}.braccato--word{white-space:pre;display:inline-block;transform:translateY(0);position:relative}.braccato--line.braccato--pre-animating,.braccato--line.braccato--pre-animating .braccato--word{will-change:transform}.braccato--break{flex-basis:100%;height:0}.braccato--word.braccato--animating{animation:braccato-wobble var(--braccato-wobble-duration) forwards ease;animation-delay:var(--braccato-anim-delay);animation-play-state:running}.braccato--word.braccato--animating.braccato--paused{animation-play-state:paused}.braccato--word:after{position:absolute;content:attr(data-content);top:-2rem;left:-2rem;white-space:pre-wrap;padding:2rem;pointer-events:none;color:transparent;box-sizing:content-box;width:100%;background-image:linear-gradient(90deg,var(--braccato-active-color) calc(100% * var(--lyric-transition-amount-start) - 4rem * var(--lyric-transition-amount-start) + 2rem),#00000000 calc(100% * var(--lyric-transition-amount-end) - 4rem * var(--lyric-transition-amount-end) + 2rem + 1px));opacity:0;--lyric-transition-amount-start: -.2;--lyric-transition-amount-end: -.1;--braccato-glow-color: color(display-p3 1 1 1 / .0001);transition:--lyric-transition-amount-start 1s linear 1000s,--lyric-transition-amount-end 1s linear 1000s,opacity .5s ease;-webkit-background-clip:text;background-clip:text}.braccato--word[data-long-word]:after{--braccato-glow-color: color(display-p3 1 1 1 / 1)}.braccato--word.braccato--pre-animating:not(.braccato--animating):after{transition:none;--lyric-transition-amount-start: -.2;--lyric-transition-amount-end: -.1;opacity:0}.braccato--word.braccato--pre-animating:not(.braccato--animating):not(.braccato-zero-dur-animate):after{opacity:1}.braccato--word.braccato--animating:after{opacity:1;animation:braccato-glow max(calc(var(--braccato-duration) * 1.2),1.2s) forwards ease;animation-delay:var(--braccato-anim-delay);animation-play-state:running;--lyric-transition-amount-start: 1.4;--lyric-transition-amount-end: 1.5;transition-property:--lyric-transition-amount-start,--lyric-transition-amount-end,opacity;transition-duration:calc(var(--braccato-duration) * 1.6),calc(var(--braccato-duration) * 1.6),var(--braccato-highlight-fade-in-duration);transition-timing-function:linear,linear,ease;transition-delay:var(--braccato-swipe-delay),var(--braccato-swipe-delay),var(--braccato-anim-delay)}.braccato--word.braccato--animating.braccato--paused:after{transition-duration:100000000s,100000000s,100000000s;--lyric-transition-amount-start: 10;--lyric-transition-amount-end: 10;opacity:.5;animation-play-state:paused}.braccato--translated,.braccato--romanized{display:block;font-size:var(--braccato-translated-font-size);font-weight:var(--braccato-translated-font-weight);font-family:var(--braccato-translated-font-family);color:var(--braccato-translated-color);white-space:normal;line-height:1.1;margin-top:8px}.braccato--romanized>span{color:var(--braccato-inactive-color);display:inline-block;white-space:pre-wrap}.braccato--romanized{width:fit-content;font-size:calc(var(--braccato-translated-font-size) / 1.25);background:#ffffff0d;padding:.375rem .75rem;border:1px solid rgba(255,255,255,.1);border-radius:1rem}.braccato-rtl{direction:rtl}.braccato-rtl.braccato--word:after{background-image:linear-gradient(270deg,var(--braccato-active-color) calc(100% * var(--lyric-transition-amount-start) - 4rem * var(--lyric-transition-amount-start) + 2rem),#00000000 calc(100% * var(--lyric-transition-amount-end) - 4rem * var(--lyric-transition-amount-end) + 2rem + 1px))}.braccato--line[data-agent=v2],.braccato--line[data-agent=v3]{justify-content:flex-end;text-align:right;transform-origin:right center!important}.braccato--line[data-agent=v1000]{justify-content:center;text-align:center;transform-origin:center center!important}.braccato--instrumental-icon{height:var(--braccato-font-size);width:calc(var(--braccato-font-size) + var(--braccato-font-size) / 3);overflow:visible;margin-left:calc(var(--braccato-font-size) / -3)}.braccato-rtl.braccato--instrumental .braccato--instrumental-icon,.braccato--instrumental[data-agent=v2] .braccato--instrumental-icon,.braccato--instrumental[data-agent=v3] .braccato--instrumental-icon{margin-left:0;margin-right:calc(var(--braccato-font-size) / -3)}.braccato--instrumental[data-agent=v1000] .braccato--instrumental-icon{margin-left:0;margin-right:0}.braccato--instrumental-bg{fill:var(--braccato-inactive-color)}.braccato--instrumental-fill{fill:var(--braccato-active-color);transition:opacity var(--braccato-highlight-fade-out-duration, .5s) ease;opacity:0}.braccato--instrumental.braccato--animating .braccato--instrumental-fill{transition:none;opacity:1}.braccato--instrumental:not(.braccato--pre-animating) .braccato--wave-clip{transition-property:transform;transition-duration:1000000s;transition-delay:0s;transform:translateY(0)}.braccato--instrumental.braccato--pre-animating:not(.braccato--animating) .braccato--wave-clip{animation:none;transform:translateY(78%)}.braccato--instrumental.braccato--animating .braccato--wave-clip{transition-property:transform;transition-duration:calc(var(--braccato-duration, 1ms) * 1);transition-timing-function:linear;transition-delay:var(--braccato-anim-delay);transform:translateY(-4%)}.braccato--paused .braccato--wave-clip{transition-duration:100000000s!important;transform:translateY(100%)!important}.braccato--wave-path{transform-box:fill-box;transform-origin:bottom;animation:braccato-wave 1.25s ease-in-out infinite;animation-play-state:paused;transform:scaleY(1.2)}.braccato--instrumental.braccato--animating:not(.braccato--paused) .braccato--wave-path{animation-play-state:running;transform:scaleY(0);transition-property:transform;transition-duration:calc(var(--braccato-duration, 1ms) * 1);transition-timing-function:ease-in;transition-delay:var(--braccato-anim-delay)}.braccato--instrumental.braccato--animating.braccato--paused .braccato--wave-path{transform:scaleY(.0001);transition-duration:10000000000s;transition-property:transform;transition-timing-function:ease-out;transition-delay:0s}@keyframes braccato-wave{0%,to{d:path("M -4 3 Q 1 2 5 3 Q 10 4 14 3 Q 18 2 22 3 Q 26 4 30 3 L 30 4 L -4 4 Z")}50%{d:path("M -4 3 Q 1 4 5 3 Q 10 2 14 3 Q 18 4 22 3 Q 26 2 30 3 L 30 4 L -4 4 Z")}}.braccato--spacer{padding:0;margin:0}.braccato-autoscroll-btn{font-family:var(--braccato-font-family);position:absolute;display:block;font-size:1.75rem;font-weight:600;white-space:normal;line-height:1.1;width:fit-content;background:#ffffff0d;padding:.5rem 1rem;border:1px solid rgba(255,255,255,.1);border-radius:1rem;color:#fff;left:50%;transform:translate(-50%,2em);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);pointer-events:auto;cursor:pointer;-webkit-user-select:none;user-select:none;z-index:100;transition:opacity .15s linear .05s,transform .2s cubic-bezier(.5,1,.89,1)}.braccato-autoscroll-btn[hidden]{transition:opacity .1s linear,transform .15s ease-in;opacity:0;pointer-events:none;transform:translate(-50%,-3em)}@keyframes braccato-wobble{0%{transform:translateY(0)}to{transform:translateY(-.0375em)}}@keyframes braccato-glow{0%{filter:drop-shadow(0 0 .8rem var(--braccato-glow-color))}to{filter:drop-shadow(0 0 0rem var(--braccato-glow-color))}}', de = ':host{--braccato-text-color: color(display-p3 1 1 1 / 1);--braccato-glow-color: color(display-p3 1 1 1 / .5);--braccato-active-color: var(--braccato-text-color);--braccato-inactive-color: color( from var(--braccato-text-color) display-p3 r g b / var(--braccato-inactive-opacity, .3) );--braccato-active-opacity: 1;--braccato-inactive-opacity: .3;--braccato-richsync-timing-offset: .15s;--braccato-timing-offset: .115s;--braccato-scroll-timing-offset: .5s;--braccato-font-family: "Satoshi", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--braccato-font-size: 3rem;--braccato-font-weight: 600;--braccato-line-height: 1.333;--braccato-translated-font-size: 2rem;--braccato-translated-font-weight: 600;--braccato-translated-font-family: var(--braccato-font-family);--braccato-translated-color: color(display-p3 1 1 1 / var(--braccato-translated-opacity, .6));--braccato-scale-transition-duration: .166s;--braccato-highlight-fade-in-duration: .33s;--braccato-highlight-fade-out-duration: .5s;--braccato-wobble-duration: 1s;--braccato-padding: 1.25rem;--braccato-padding-bottom: 50cqh;--braccato-scale: .95;--braccato-active-scale: 1;--braccato-scroll-duration: .75s;--braccato-scroll-timing-function: cubic-bezier(.86, 0, .07, 1)}';
-var ue = Object.defineProperty, R = (t, e, r, a) => {
+const de = ':host{display:block;overflow-y:auto;position:relative;container-type:size;scrollbar-width:none}:host::-webkit-scrollbar{display:none}:host(:has(.braccato--user-scrolling)){scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent}:host(:has(.braccato--user-scrolling))::-webkit-scrollbar{display:block;width:6px}:host(:has(.braccato--user-scrolling))::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:3px}:host(:has(.braccato--user-scrolling))::-webkit-scrollbar-track{background:transparent}.braccato-container{font-family:var(--braccato-font-family);font-size:var(--braccato-font-size);font-weight:var(--braccato-font-weight);isolation:isolate;line-height:var(--braccato-line-height);position:relative;z-index:1;transition:transform var(--braccato-scroll-duration) var(--braccato-scroll-timing-function) 0s;padding-top:2rem;padding-bottom:var(--braccato-padding-bottom)}.braccato-container>div{cursor:pointer;padding:var(--braccato-padding) 0;transform-origin:left center;word-break:break-word;transition:filter calc(var(--braccato-duration) / 3) .4s,opacity calc(var(--braccato-duration) / 2) .166s,transform .166s var(--braccato-anim-delay, 0s)}.braccato-container:has(.braccato--active):not(.braccato--user-scrolling)>div:not(.braccato--active):not(.braccato--active~div){opacity:.33;filter:blur(2.5px)}.braccato-container>div.braccato--active{opacity:1;filter:blur(0px)}.braccato-container>div.braccato--active~div{opacity:.66;filter:blur(0px)}.braccato-container>.braccato--animating{opacity:1!important;filter:blur(0px)!important}.braccato-container>div:hover{opacity:1!important;filter:blur(0px)!important;transform:scale(var(--braccato-hover-scale, 1.01));transition:all .3s ease}.braccato--active{cursor:default}:not(.braccato-background-lyric){order:0}.braccato-background-lyric{order:2}.braccato--line>span>span.braccato-background-lyric{font-size:.675em;font-weight:400}.braccato--line{transform:scale(var(--braccato-scale));transition-property:transform;transition-duration:var(--braccato-scale-transition-duration);transition-timing-function:ease;display:flex;flex-flow:row wrap;align-items:start;align-content:flex-start;padding-left:.25em;padding-right:.25em;box-sizing:border-box}.braccato--line.braccato--animating{transform:scale(var(--braccato-active-scale));transition-delay:var(--braccato-anim-delay)}.braccato--line>span{color:var(--braccato-inactive-color);display:inline-block;white-space:pre-wrap}.braccato--word{white-space:pre;display:inline-block;transform:translateY(0);position:relative}.braccato--line.braccato--pre-animating,.braccato--line.braccato--pre-animating .braccato--word{will-change:transform}.braccato--break{flex-basis:100%;height:0}.braccato--word.braccato--animating{animation:braccato-wobble var(--braccato-wobble-duration) forwards ease;animation-delay:var(--braccato-anim-delay);animation-play-state:running}.braccato--word.braccato--animating.braccato--paused{animation-play-state:paused}.braccato--word:after{position:absolute;content:attr(data-content);top:-2rem;left:-2rem;white-space:pre-wrap;padding:2rem;pointer-events:none;color:transparent;box-sizing:content-box;width:100%;background-image:linear-gradient(90deg,var(--braccato-active-color) calc(100% * var(--lyric-transition-amount-start) - 4rem * var(--lyric-transition-amount-start) + 2rem),#00000000 calc(100% * var(--lyric-transition-amount-end) - 4rem * var(--lyric-transition-amount-end) + 2rem + 1px));opacity:0;--lyric-transition-amount-start: -.2;--lyric-transition-amount-end: -.1;--braccato-glow-color: color(display-p3 1 1 1 / .0001);transition:--lyric-transition-amount-start 1s linear 1000s,--lyric-transition-amount-end 1s linear 1000s,opacity .5s ease;-webkit-background-clip:text;background-clip:text}.braccato--word[data-long-word]:after{--braccato-glow-color: color(display-p3 1 1 1 / 1)}.braccato--word.braccato--pre-animating:not(.braccato--animating):after{transition:none;--lyric-transition-amount-start: -.2;--lyric-transition-amount-end: -.1;opacity:0}.braccato--word.braccato--pre-animating:not(.braccato--animating):not(.braccato-zero-dur-animate):after{opacity:1}.braccato--word.braccato--animating:after{opacity:1;animation:braccato-glow max(calc(var(--braccato-duration) * 1.2),1.2s) forwards ease;animation-delay:var(--braccato-anim-delay);animation-play-state:running;--lyric-transition-amount-start: 1.4;--lyric-transition-amount-end: 1.5;transition-property:--lyric-transition-amount-start,--lyric-transition-amount-end,opacity;transition-duration:calc(var(--braccato-duration) * 1.6),calc(var(--braccato-duration) * 1.6),var(--braccato-highlight-fade-in-duration);transition-timing-function:linear,linear,ease;transition-delay:var(--braccato-swipe-delay),var(--braccato-swipe-delay),var(--braccato-anim-delay)}.braccato--word.braccato--animating.braccato--paused:after{transition-duration:100000000s,100000000s,100000000s;--lyric-transition-amount-start: 10;--lyric-transition-amount-end: 10;opacity:.5;animation-play-state:paused}.braccato--translated,.braccato--romanized{display:block;font-size:var(--braccato-translated-font-size);font-weight:var(--braccato-translated-font-weight);font-family:var(--braccato-translated-font-family);color:var(--braccato-translated-color);white-space:normal;line-height:1.1;margin-top:8px}.braccato--romanized>span{color:var(--braccato-inactive-color);display:inline-block;white-space:pre-wrap}.braccato--romanized{width:fit-content;font-size:calc(var(--braccato-translated-font-size) / 1.25);background:#ffffff0d;padding:.375rem .75rem;border:1px solid rgba(255,255,255,.1);border-radius:1rem}.braccato-rtl{direction:rtl}.braccato-rtl.braccato--word:after{background-image:linear-gradient(270deg,var(--braccato-active-color) calc(100% * var(--lyric-transition-amount-start) - 4rem * var(--lyric-transition-amount-start) + 2rem),#00000000 calc(100% * var(--lyric-transition-amount-end) - 4rem * var(--lyric-transition-amount-end) + 2rem + 1px))}.braccato--line[data-agent=v2],.braccato--line[data-agent=v3]{justify-content:flex-end;text-align:right;transform-origin:right center!important}.braccato--line[data-agent=v1000]{justify-content:center;text-align:center;transform-origin:center center!important}.braccato--instrumental-icon{height:var(--braccato-font-size);width:calc(var(--braccato-font-size) + var(--braccato-font-size) / 3);overflow:visible;margin-left:calc(var(--braccato-font-size) / -3)}.braccato-rtl.braccato--instrumental .braccato--instrumental-icon,.braccato--instrumental[data-agent=v2] .braccato--instrumental-icon,.braccato--instrumental[data-agent=v3] .braccato--instrumental-icon{margin-left:0;margin-right:calc(var(--braccato-font-size) / -3)}.braccato--instrumental[data-agent=v1000] .braccato--instrumental-icon{margin-left:0;margin-right:0}.braccato--instrumental-bg{fill:var(--braccato-inactive-color)}.braccato--instrumental-fill{fill:var(--braccato-active-color);transition:opacity var(--braccato-highlight-fade-out-duration, .5s) ease;opacity:0}.braccato--instrumental.braccato--animating .braccato--instrumental-fill{transition:none;opacity:1}.braccato--instrumental:not(.braccato--pre-animating) .braccato--wave-clip{transition-property:transform;transition-duration:1000000s;transition-delay:0s;transform:translateY(0)}.braccato--instrumental.braccato--pre-animating:not(.braccato--animating) .braccato--wave-clip{animation:none;transform:translateY(78%)}.braccato--instrumental.braccato--animating .braccato--wave-clip{transition-property:transform;transition-duration:calc(var(--braccato-duration, 1ms) * 1);transition-timing-function:linear;transition-delay:var(--braccato-anim-delay);transform:translateY(-4%)}.braccato--paused .braccato--wave-clip{transition-duration:100000000s!important;transform:translateY(100%)!important}.braccato--wave-path{transform-box:fill-box;transform-origin:bottom;animation:braccato-wave 1.25s ease-in-out infinite;animation-play-state:paused;transform:scaleY(1.2)}.braccato--instrumental.braccato--animating:not(.braccato--paused) .braccato--wave-path{animation-play-state:running;transform:scaleY(0);transition-property:transform;transition-duration:calc(var(--braccato-duration, 1ms) * 1);transition-timing-function:ease-in;transition-delay:var(--braccato-anim-delay)}.braccato--instrumental.braccato--animating.braccato--paused .braccato--wave-path{transform:scaleY(.0001);transition-duration:10000000000s;transition-property:transform;transition-timing-function:ease-out;transition-delay:0s}@keyframes braccato-wave{0%,to{d:path("M -4 3 Q 1 2 5 3 Q 10 4 14 3 Q 18 2 22 3 Q 26 4 30 3 L 30 4 L -4 4 Z")}50%{d:path("M -4 3 Q 1 4 5 3 Q 10 2 14 3 Q 18 4 22 3 Q 26 2 30 3 L 30 4 L -4 4 Z")}}.braccato--spacer{padding:0;margin:0}.braccato-autoscroll-btn{font-family:var(--braccato-font-family);position:absolute;display:block;font-size:1.75rem;font-weight:600;white-space:normal;line-height:1.1;width:fit-content;background:#ffffff0d;padding:.5rem 1rem;border:1px solid rgba(255,255,255,.1);border-radius:1rem;color:#fff;left:50%;transform:translate(-50%,2em);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);pointer-events:auto;cursor:pointer;-webkit-user-select:none;user-select:none;z-index:100;transition:opacity .15s linear .05s,transform .2s cubic-bezier(.5,1,.89,1)}.braccato-autoscroll-btn[hidden]{transition:opacity .1s linear,transform .15s ease-in;opacity:0;pointer-events:none;transform:translate(-50%,-3em)}@keyframes braccato-wobble{0%{transform:translateY(0)}to{transform:translateY(-.0375em)}}@keyframes braccato-glow{0%{filter:drop-shadow(0 0 .8rem var(--braccato-glow-color))}to{filter:drop-shadow(0 0 0rem var(--braccato-glow-color))}}', ue = ':host{--braccato-text-color: color(display-p3 1 1 1 / 1);--braccato-glow-color: color(display-p3 1 1 1 / .5);--braccato-active-color: var(--braccato-text-color);--braccato-inactive-color: color( from var(--braccato-text-color) display-p3 r g b / var(--braccato-inactive-opacity, .3) );--braccato-active-opacity: 1;--braccato-inactive-opacity: .3;--braccato-richsync-timing-offset: .15s;--braccato-timing-offset: .115s;--braccato-scroll-timing-offset: .5s;--braccato-font-family: "Satoshi", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--braccato-font-size: 3rem;--braccato-font-weight: 600;--braccato-line-height: 1.333;--braccato-translated-font-size: 2rem;--braccato-translated-font-weight: 600;--braccato-translated-font-family: var(--braccato-font-family);--braccato-translated-color: color(display-p3 1 1 1 / var(--braccato-translated-opacity, .6));--braccato-scale-transition-duration: .166s;--braccato-highlight-fade-in-duration: .33s;--braccato-highlight-fade-out-duration: .5s;--braccato-wobble-duration: 1s;--braccato-padding: 1.25rem;--braccato-padding-bottom: 50cqh;--braccato-scale: .95;--braccato-active-scale: 1;--braccato-scroll-duration: .75s;--braccato-scroll-timing-function: cubic-bezier(.86, 0, .07, 1)}';
+var me = Object.defineProperty, R = (t, e, a, r) => {
   for (var n = void 0, o = t.length - 1, i; o >= 0; o--)
-    (i = t[o]) && (n = i(e, r, n) || n);
-  return n && ue(e, r, n), n;
+    (i = t[o]) && (n = i(e, a, n) || n);
+  return n && me(e, a, n), n;
 };
-function me() {
+function fe() {
   if (!(typeof CSS > "u" || !CSS.registerProperty))
     try {
       CSS.registerProperty({
@@ -706,7 +707,7 @@ function me() {
     } catch {
     }
 }
-me();
+fe();
 const K = class K extends lt {
   constructor() {
     super(...arguments), this.lyrics = [], this.currentTime = 0, this.playing = !1, this.scrollMode = "internal", this.scrollContainer = null, this.dir = "auto", this.longWordThreshold = 1500, this.lineSyncedDelay = 50, this.disableRichsync = !1, this.debug = !1, this.source = null, this.src = null, this._lyricsData = null, this._animState = Rt(), this._rafId = null, this._lastLyrics = [], this._resizeObserver = null, this._mediaElement = null, this._lastSrc = null, this._srcAbortController = null, this._tickCount = 0, this._onScroll = () => {
@@ -715,7 +716,7 @@ const K = class K extends lt {
         e.skipScrolls--;
         return;
       }
-      At(e) ? rt(e) : (rt(e), this.dispatchEvent(
+      At(e) ? at(e) : (at(e), this.dispatchEvent(
         new CustomEvent("braccato:scroll-state", {
           detail: { userScrolling: !0 },
           bubbles: !0,
@@ -753,12 +754,12 @@ const K = class K extends lt {
       this._log("_injectLyrics: no lyrics, clearing"), e.replaceChildren(), this._lyricsData = null;
       return;
     }
-    const r = {
+    const a = {
       longWordThreshold: this.longWordThreshold,
       lineSyncedAnimationDelay: this.lineSyncedDelay,
       disableRichsync: this.disableRichsync
     };
-    this._lyricsData = ce(this.lyrics, e, r), this._log("_injectLyrics: rendered", {
+    this._lyricsData = le(this.lyrics, e, a), this._log("_injectLyrics: rendered", {
       lineCount: this._lyricsData.lines.length,
       syncType: this._lyricsData.syncType,
       firstLineTime: (o = this._lyricsData.lines[0]) == null ? void 0 : o.time,
@@ -767,8 +768,8 @@ const K = class K extends lt {
     });
     for (let c = 0; c < this._lyricsData.lines.length; c++)
       this._lyricsData.lines[c].element.addEventListener("click", (d) => this._handleLineClick(d, c));
-    const a = this._getScrollContainer();
-    this._log("_injectLyrics: scrollContainer", a.tagName, a.className), a.addEventListener("scroll", this._onScroll, { passive: !0 }), (s = this._resizeObserver) == null || s.disconnect(), this._resizeObserver = new ResizeObserver(() => this._recalculatePositions()), this._resizeObserver.observe(e), this._recalculatePositions(), this.dispatchEvent(
+    const r = this._getScrollContainer();
+    this._log("_injectLyrics: scrollContainer", r.tagName, r.className), r.addEventListener("scroll", this._onScroll, { passive: !0 }), (s = this._resizeObserver) == null || s.disconnect(), this._resizeObserver = new ResizeObserver(() => this._recalculatePositions()), this._resizeObserver.observe(e), this._recalculatePositions(), this.dispatchEvent(
       new CustomEvent("braccato:lyrics-loaded", {
         detail: { syncType: this._lyricsData.syncType, lineCount: this._lyricsData.lines.length },
         bubbles: !0,
@@ -781,9 +782,9 @@ const K = class K extends lt {
     if (!this._lyricsData) return;
     const e = this._lyricsData.container;
     this._lyricsData.width = e.clientWidth, this._lyricsData.height = e.clientHeight;
-    for (const r of this._lyricsData.lines) {
-      const a = r.element.getBoundingClientRect(), n = e.getBoundingClientRect();
-      r.position = a.top - n.top + e.scrollTop, r.height = a.height;
+    for (const a of this._lyricsData.lines) {
+      const r = a.element.getBoundingClientRect(), n = e.getBoundingClientRect();
+      a.position = r.top - n.top + e.scrollTop, a.height = r.height;
     }
     this._animState.scroll.wasUserScrolling = !0;
   }
@@ -813,11 +814,11 @@ const K = class K extends lt {
         isUserScrolling: this._animState.scroll.wasUserScrolling
       });
     }
-    const e = this._mediaElement, r = e ? e.currentTime * 1e3 : this.currentTime, a = e ? !e.paused : this.playing;
+    const e = this._mediaElement, a = e ? e.currentTime * 1e3 : this.currentTime, r = e ? !e.paused : this.playing;
     zt(this._animState, {
-      currentTime: r / 1e3,
+      currentTime: a / 1e3,
       eventCreationTime: Date.now(),
-      isPlaying: a,
+      isPlaying: r,
       smoothScroll: !0,
       lyricsData: this._lyricsData,
       scrollContainer: this._getScrollContainer()
@@ -828,18 +829,18 @@ const K = class K extends lt {
     return this.scrollMode === "external" && this.scrollContainer ? this.scrollContainer : this;
   }
   // -- Events --------------------------
-  _handleLineClick(e, r) {
+  _handleLineClick(e, a) {
     var o, i;
-    const a = (o = this._lyricsData) == null ? void 0 : o.lines[r];
-    if (!a) return;
-    const n = a.time * 1e3;
-    if (this._log("lineClick", { lineIndex: r, time: n, lineTimeSec: a.time, currentTime: this.currentTime }), e.altKey && ((i = this._lyricsData) == null ? void 0 : i.syncType) === "richsync") {
+    const r = (o = this._lyricsData) == null ? void 0 : o.lines[a];
+    if (!r) return;
+    const n = r.time * 1e3;
+    if (this._log("lineClick", { lineIndex: a, time: n, lineTimeSec: r.time, currentTime: this.currentTime }), e.altKey && ((i = this._lyricsData) == null ? void 0 : i.syncType) === "richsync") {
       const s = e.target.closest(".braccato--word");
       if (s) {
-        const c = Number.parseFloat(s.dataset.time || "0") * 1e3, f = a.parts.findIndex((d) => d.element === s);
+        const c = Number.parseFloat(s.dataset.time || "0") * 1e3, f = r.parts.findIndex((d) => d.element === s);
         this.dispatchEvent(
           new CustomEvent("braccato:word-click", {
-            detail: { time: c, lineIndex: r, wordIndex: f },
+            detail: { time: c, lineIndex: a, wordIndex: f },
             bubbles: !0,
             composed: !0
           })
@@ -849,11 +850,11 @@ const K = class K extends lt {
     }
     this._mediaElement && (this._mediaElement.currentTime = n / 1e3, this._mediaElement.paused && this._mediaElement.play()), this.dispatchEvent(
       new CustomEvent("braccato:line-click", {
-        detail: { time: n, lineIndex: r },
+        detail: { time: n, lineIndex: a },
         bubbles: !0,
         composed: !0
       })
-    ), at(this._animState.scroll);
+    ), rt(this._animState.scroll);
   }
   // -- Source Binding --------------------------
   _resolveMediaElement() {
@@ -865,26 +866,26 @@ const K = class K extends lt {
     e instanceof HTMLMediaElement ? this._mediaElement = e : (this._mediaElement = null, this._log("source: no media element found for selector", this.source));
   }
   async _fetchLyricsFromSrc() {
-    var r;
-    if ((r = this._srcAbortController) == null || r.abort(), !this.src) {
+    var a;
+    if ((a = this._srcAbortController) == null || a.abort(), !this.src) {
       this.lyrics = [];
       return;
     }
     const e = new AbortController();
     this._srcAbortController = e;
     try {
-      const a = await fetch(this.src, { signal: e.signal });
-      if (!a.ok) {
-        this._emitError(new Error(`Failed to fetch lyrics: ${a.status} ${a.statusText}`));
+      const r = await fetch(this.src, { signal: e.signal });
+      if (!r.ok) {
+        this._emitError(new Error(`Failed to fetch lyrics: ${r.status} ${r.statusText}`));
         return;
       }
-      const n = await a.text();
+      const n = await r.text();
       if (e.signal.aborted) return;
       const o = this._mediaElement ? this._mediaElement.duration * 1e3 : 3e5, i = wt(n);
       this.lyrics = i.parse(n, o);
-    } catch (a) {
-      if (a instanceof DOMException && a.name === "AbortError") return;
-      this._emitError(a instanceof Error ? a : new Error(String(a)));
+    } catch (r) {
+      if (r instanceof DOMException && r.name === "AbortError") return;
+      this._emitError(r instanceof Error ? r : new Error(String(r)));
     }
   }
   _emitError(e) {
@@ -898,13 +899,13 @@ const K = class K extends lt {
   }
   // -- Public Methods --------------------------
   resumeAutoscroll() {
-    at(this._animState.scroll);
+    rt(this._animState.scroll);
   }
   recalculatePositions() {
     this._recalculatePositions();
   }
 };
-K.styles = [X(de), X(le)];
+K.styles = [X(ue), X(de)];
 let E = K;
 R([
   D({ type: Array })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@braccato/core",
-  "version": "0.1.6",
+  "version": "0.1.7",
   "description": "Synchronized lyrics web component with word-by-word animations",
   "type": "module",
   "license": "MIT",