@braccato/core 1.12.1 → 1.12.3

package/README.md

@@ -242,7 +242,8 @@ pair snaps at the halfway point instead of flowing.
 
 Given `songwriters`, the view ends with `A, B & C` after the last line. It sits dim through the song,
 and once the last line has ended it brightens and takes the scroll focus, the way Apple Music closes a
-song. Seeking back hands the focus to the lines again. Unsynced lyrics have no end, so their credits
+song. The scroll never carries the last sung line out of view to do it, so a long list of writers
+settles below that line rather than centred. Seeking back hands the focus to the lines again. Unsynced lyrics have no end, so their credits
 show at full strength from the start.
 
 | Custom property                      | Default          | What it sets                                         |
@@ -252,6 +253,9 @@ show at full strength from the start.
 | `--blyrics-credits-opacity`          | `0.2`            | While the song plays.                                |
 | `--blyrics-credits-focused-opacity`  | `0.85`           | Once the song has ended.                             |
 
+The credits are a `p`, not a `div`, so rules a theme writes for the lines as `.blyrics-container > div`
+(hover scaling, per-line opacity and blur) never reach them. Style them through `.blyrics-credits`.
+
 The container carries `data-credits-focused` while the credits hold the focus. To hide them, a
 stylesheet can set `.blyrics-credits { display: none; }`, which the scroll then ignores, or a theme can
 declare `/* blyrics-hide-credits = true; */` so they are never built.

package/dist/README.md

@@ -242,7 +242,8 @@ pair snaps at the halfway point instead of flowing.
 
 Given `songwriters`, the view ends with `A, B & C` after the last line. It sits dim through the song,
 and once the last line has ended it brightens and takes the scroll focus, the way Apple Music closes a
-song. Seeking back hands the focus to the lines again. Unsynced lyrics have no end, so their credits
+song. The scroll never carries the last sung line out of view to do it, so a long list of writers
+settles below that line rather than centred. Seeking back hands the focus to the lines again. Unsynced lyrics have no end, so their credits
 show at full strength from the start.
 
 | Custom property                      | Default          | What it sets                                         |
@@ -252,6 +253,9 @@ show at full strength from the start.
 | `--blyrics-credits-opacity`          | `0.2`            | While the song plays.                                |
 | `--blyrics-credits-focused-opacity`  | `0.85`           | Once the song has ended.                             |
 
+The credits are a `p`, not a `div`, so rules a theme writes for the lines as `.blyrics-container > div`
+(hover scaling, per-line opacity and blur) never reach them. Style them through `.blyrics-credits`.
+
 The container carries `data-credits-focused` while the credits hold the focus. To hide them, a
 stylesheet can set `.blyrics-credits { display: none; }`, which the scroll then ignores, or a theme can
 declare `/* blyrics-hide-credits = true; */` so they are never built.

package/dist/engine.js

@@ -2031,8 +2031,9 @@ export function tickView(engine, currentTime, options) {
             // Make sure top of last active lyric is visible.
             scrollPos = Math.min(scrollPos, lastActiveLyric.position);
             const credits = engine.cachedCreditsItem;
-            if (engine.creditsFocused && credits) {
-                scrollPos = credits.position + credits.height / 2 - scrollPosOffset;
+            if (engine.creditsFocused && credits && lastSungLine) {
+                // Tall credits would otherwise carry the last line out of view while it is still being sung.
+                scrollPos = Math.min(credits.position + credits.height / 2 - scrollPosOffset, lastSungLine.position);
             }
             // Past either end the browser clamps the write and reports nothing, leaving the view aiming
             // at a position it never reached and re-aiming once per remaining line.

package/dist/styles/lyrics.css

@@ -240,7 +240,12 @@
 }
 
 .blyrics-container > .blyrics-credits {
+	box-sizing: border-box;
 	cursor: default;
+	margin: 0;
+	padding: var(--blyrics-padding) 0.25em;
+	transform: scale(var(--blyrics-scale));
+	transform-origin: left center;
 }
 
 .blyrics-credits {
@@ -250,6 +255,7 @@
 }
 
 .blyrics-credits__text {
+	display: block;
 	font-size: var(--blyrics-credits-font-size);
 }
 

package/dist/view.js

@@ -45,10 +45,11 @@ function formatSongwriters(names) {
     return names.length > 1 ? `${names.slice(0, -1).join(", ")} & ${names.at(-1)}` : (names[0] ?? "");
 }
 function buildCredits(doc, songwriters) {
-    const credits = doc.createElement("div");
+    // Not a div: themes style the lines as `.blyrics-container > div`, and none of that is meant for the credits.
+    const credits = doc.createElement("p");
     credits.className = CREDITS_CLASS;
     // The smaller size lives on an inner block so the credits keep the lines' em, and with it their inset.
-    const text = doc.createElement("div");
+    const text = doc.createElement("span");
     text.className = CREDITS_TEXT_CLASS;
     const names = doc.createElement("span");
     names.className = CREDITS_NAMES_CLASS;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@braccato/core",
-  "version": "1.12.1",
+  "version": "1.12.3",
   "description": "Synchronized lyrics renderer with word-by-word animations",
   "type": "module",
   "license": "MIT",