@lumiastream/ui 0.2.8-alpha.26 → 0.2.8-alpha.27

package/dist/index.js

@@ -3226,9 +3226,17 @@ var YOUTUBE_CONTEXTS = {
   "subscriber-week": { amount: "youtube_week_member_count", count: "youtube_week_member_count" },
   "subscriber-month": { amount: "youtube_month_member_count", count: "youtube_month_member_count" }
 };
+var RECENT_TO_LATEST_LISTENER = {
+  "follower-recent": "follower-latest",
+  "subscriber-recent": "subscriber-latest",
+  "cheer-recent": "cheer-latest",
+  "tip-recent": "tip-latest",
+  "raid-recent": "raid-latest"
+};
 function listenerPlaceholderContext(listener, provider = "twitch") {
+  const resolved = RECENT_TO_LATEST_LISTENER[listener] ?? listener;
   const platformTable = provider === "kick" ? KICK_CONTEXTS : provider === "youtube" ? YOUTUBE_CONTEXTS : null;
-  return platformTable?.[listener] ?? TWITCH_CONTEXTS[listener] ?? {};
+  return platformTable?.[resolved] ?? TWITCH_CONTEXTS[resolved] ?? {};
 }
 var SE_WIDGET_TYPE_LABELS = {
   "subscriber-latest": "Latest subscriber",
@@ -3313,8 +3321,9 @@ var YOUTUBE_LISTENER_VARS = {
 };
 function listenerToLumiaVariable(listener, provider = "twitch") {
   if (typeof listener !== "string" || !listener) return "username";
-  if (provider === "kick" && KICK_LISTENER_VARS[listener]) return KICK_LISTENER_VARS[listener];
-  if (provider === "youtube" && YOUTUBE_LISTENER_VARS[listener]) return YOUTUBE_LISTENER_VARS[listener];
+  const resolvedListener = RECENT_TO_LATEST_LISTENER[listener] ?? listener;
+  if (provider === "kick" && KICK_LISTENER_VARS[resolvedListener]) return KICK_LISTENER_VARS[resolvedListener];
+  if (provider === "youtube" && YOUTUBE_LISTENER_VARS[resolvedListener]) return YOUTUBE_LISTENER_VARS[resolvedListener];
   const m = {
     // Latest events
     "follower-latest": "twitch_last_follower",
@@ -3371,7 +3380,7 @@ function listenerToLumiaVariable(listener, provider = "twitch") {
     "cheer-alltime-top-donation": "twitch_alltime_top_cheerer_amount",
     "cheer-alltime-top-donator": "twitch_alltime_top_cheerer"
   };
-  return m[listener] ?? listener.replace(/-/g, "_");
+  return m[resolvedListener] ?? resolvedListener.replace(/-/g, "_");
 }
 function seCssToBounds(css, defaults = { width: 600, height: 200 }, canvas) {
   let widthIsAuto = false;
@@ -4342,6 +4351,9 @@ function mapEventList(widget, ctx) {
   const filters = computeListenerFilters(widget.listeners, widget.listener);
   const maxItems = v.visibleEvents ?? v.visibleItems ?? 5;
   return buildUnit(widget, "eventlist", {
+    // SE event-list widgets style per-event lines via widget.text.css; the
+    // Lumia eventlist reads font/size/color from module.css.
+    css: mapSeTextCssToModuleCss(widget, { fontSize: 18 }),
     content: {
       theme: v.theme ?? "simple",
       direction: v.direction ?? "top",
@@ -4775,14 +4787,10 @@ function mapMediaShare(widget, ctx) {
       // `durationSeconds + grace`).
       importMeta: buildImportMeta(widget, { timeLeft: v.timeLeft === true })
     },
-    css: {
-      fontFamily: "Roboto",
-      fontWeight: "bold",
-      color: "#ffffff",
-      textShadow: "rgb(0, 0, 0) 1px 1px 1px",
-      background: "transparent",
-      fontSize: 18
-    }
+    // Lumia songrequest renders the queue list as styled text; pull SE's
+    // widget.text.css so font/size/color carry across (defaults match the
+    // previous hardcoded fallbacks for this widget specifically).
+    css: mapSeTextCssToModuleCss(widget, { fontSize: 18 })
   }, ctx);
 }
 function mapKappagen(widget, ctx) {
@@ -4850,6 +4858,9 @@ function mapLeaderboardFromVariables(widget, currency, ctx) {
   const window = v.period === "weekly" ? "week" : v.period === "monthly" ? "month" : "alltime";
   const title = currency === "tips" ? "Top Tippers" : currency === "cheers" ? "Top Cheerers" : "Top Gifters";
   return buildUnit(widget, "loyaltyleaderboard", {
+    // Carry SE text styling so the leaderboard list keeps the streamer's
+    // chosen font / size / color.
+    css: mapSeTextCssToModuleCss(widget, { fontSize: 18 }),
     content: {
       source: "variables",
       currency,
@@ -4876,6 +4887,8 @@ function mapGiveaway(widget, ctx) {
   const primary = v.colors?.primary ?? "#393853";
   const accent = v.colors?.accent ?? "#FF4076";
   return buildUnit(widget, "raffle", {
+    // Raffle renders entrants/winner text via module.css.
+    css: mapSeTextCssToModuleCss(widget),
     content: {
       version: 1,
       type: "basic",
@@ -4960,6 +4973,9 @@ function isHypetrainCustomWidget(widget) {
 function mapHypetrain(widget, ctx) {
   const v = widget.variables ?? {};
   return buildUnit(widget, "hypetrain", {
+    // Hypetrain renders level / progress / contributor text — carry SE
+    // styling so an imported hype-train widget keeps its font + accent.
+    css: mapSeTextCssToModuleCss(widget),
     content: {
       // Twitch-native is the right default — SE hype-train widgets always
       // reflected the Twitch native train. Users can flip to 'synthetic'
@@ -5352,6 +5368,23 @@ var GOAL_TYPES = /* @__PURE__ */ new Set([
   "se-widget-merch-goal"
 ]);
 var EVENTLIST_TYPES = /* @__PURE__ */ new Set(["se-widget-event-list", "se-widget-follower-recent", "se-widget-subscriber-recent", "se-widget-cheer-recent", "se-widget-tip-recent"]);
+var SCROLLING_RECENT_TYPES = /* @__PURE__ */ new Set([
+  "se-widget-follower-recent",
+  "se-widget-subscriber-recent",
+  "se-widget-cheer-recent",
+  "se-widget-tip-recent"
+]);
+var RECENT_TO_LATEST_FALLBACK_VAR = {
+  "se-widget-follower-recent": "twitch_last_follower",
+  "se-widget-subscriber-recent": "twitch_last_subscriber",
+  "se-widget-cheer-recent": "twitch_last_bit",
+  "se-widget-tip-recent": "latest_donator"
+};
+function isScrollingRecentWidget(widget) {
+  if (!SCROLLING_RECENT_TYPES.has(widget.type)) return false;
+  const scrolling = widget.text?.scrolling;
+  return !!(scrolling && typeof scrolling === "object" && scrolling.enabled === true);
+}
 function dispatch(widget, ctx) {
   const t = widget.type;
   console.log("[SE-IMPORT] dispatch widget", {
@@ -5380,6 +5413,10 @@ function dispatch(widget, ctx) {
   if (t === "se-widget-donor-drive-alert") return { unit: mapSingleAlert(widget, "donordrive-donation", ctx), status: "direct", lumiaType: "alert" };
   if (t === "se-widget-extralife-alert") return { unit: mapSingleAlert(widget, "extralife-donation", ctx), status: "direct", lumiaType: "alert" };
   if (t === "se-widget-tiltify-alert") return { unit: mapSingleAlert(widget, "tiltify-campaignDonation", ctx), status: "direct", lumiaType: "alert" };
+  if (isScrollingRecentWidget(widget)) {
+    const fallbackVar = RECENT_TO_LATEST_FALLBACK_VAR[t] ?? "username";
+    return { unit: mapReadout(widget, fallbackVar, ctx), status: "direct", lumiaType: "text" };
+  }
   if (EVENTLIST_TYPES.has(t)) return { unit: mapEventList(widget, ctx), status: "direct", lumiaType: "eventlist" };
   if (t === "se-widget-top-tippers-list") return { unit: mapLeaderboardFromVariables(widget, "tips", ctx), status: "direct", lumiaType: "loyaltyleaderboard" };
   if (t === "se-widget-top-cheerers-list") return { unit: mapLeaderboardFromVariables(widget, "cheers", ctx), status: "direct", lumiaType: "loyaltyleaderboard" };

package/dist/se-import.js

@@ -111,9 +111,17 @@ var YOUTUBE_CONTEXTS = {
   "subscriber-week": { amount: "youtube_week_member_count", count: "youtube_week_member_count" },
   "subscriber-month": { amount: "youtube_month_member_count", count: "youtube_month_member_count" }
 };
+var RECENT_TO_LATEST_LISTENER = {
+  "follower-recent": "follower-latest",
+  "subscriber-recent": "subscriber-latest",
+  "cheer-recent": "cheer-latest",
+  "tip-recent": "tip-latest",
+  "raid-recent": "raid-latest"
+};
 function listenerPlaceholderContext(listener, provider = "twitch") {
+  const resolved = RECENT_TO_LATEST_LISTENER[listener] ?? listener;
   const platformTable = provider === "kick" ? KICK_CONTEXTS : provider === "youtube" ? YOUTUBE_CONTEXTS : null;
-  return platformTable?.[listener] ?? TWITCH_CONTEXTS[listener] ?? {};
+  return platformTable?.[resolved] ?? TWITCH_CONTEXTS[resolved] ?? {};
 }
 var SE_WIDGET_TYPE_LABELS = {
   "subscriber-latest": "Latest subscriber",
@@ -198,8 +206,9 @@ var YOUTUBE_LISTENER_VARS = {
 };
 function listenerToLumiaVariable(listener, provider = "twitch") {
   if (typeof listener !== "string" || !listener) return "username";
-  if (provider === "kick" && KICK_LISTENER_VARS[listener]) return KICK_LISTENER_VARS[listener];
-  if (provider === "youtube" && YOUTUBE_LISTENER_VARS[listener]) return YOUTUBE_LISTENER_VARS[listener];
+  const resolvedListener = RECENT_TO_LATEST_LISTENER[listener] ?? listener;
+  if (provider === "kick" && KICK_LISTENER_VARS[resolvedListener]) return KICK_LISTENER_VARS[resolvedListener];
+  if (provider === "youtube" && YOUTUBE_LISTENER_VARS[resolvedListener]) return YOUTUBE_LISTENER_VARS[resolvedListener];
   const m = {
     // Latest events
     "follower-latest": "twitch_last_follower",
@@ -256,7 +265,7 @@ function listenerToLumiaVariable(listener, provider = "twitch") {
     "cheer-alltime-top-donation": "twitch_alltime_top_cheerer_amount",
     "cheer-alltime-top-donator": "twitch_alltime_top_cheerer"
   };
-  return m[listener] ?? listener.replace(/-/g, "_");
+  return m[resolvedListener] ?? resolvedListener.replace(/-/g, "_");
 }
 function seCssToBounds(css, defaults = { width: 600, height: 200 }, canvas) {
   let widthIsAuto = false;
@@ -1227,6 +1236,9 @@ function mapEventList(widget, ctx) {
   const filters = computeListenerFilters(widget.listeners, widget.listener);
   const maxItems = v.visibleEvents ?? v.visibleItems ?? 5;
   return buildUnit(widget, "eventlist", {
+    // SE event-list widgets style per-event lines via widget.text.css; the
+    // Lumia eventlist reads font/size/color from module.css.
+    css: mapSeTextCssToModuleCss(widget, { fontSize: 18 }),
     content: {
       theme: v.theme ?? "simple",
       direction: v.direction ?? "top",
@@ -1660,14 +1672,10 @@ function mapMediaShare(widget, ctx) {
       // `durationSeconds + grace`).
       importMeta: buildImportMeta(widget, { timeLeft: v.timeLeft === true })
     },
-    css: {
-      fontFamily: "Roboto",
-      fontWeight: "bold",
-      color: "#ffffff",
-      textShadow: "rgb(0, 0, 0) 1px 1px 1px",
-      background: "transparent",
-      fontSize: 18
-    }
+    // Lumia songrequest renders the queue list as styled text; pull SE's
+    // widget.text.css so font/size/color carry across (defaults match the
+    // previous hardcoded fallbacks for this widget specifically).
+    css: mapSeTextCssToModuleCss(widget, { fontSize: 18 })
   }, ctx);
 }
 function mapKappagen(widget, ctx) {
@@ -1735,6 +1743,9 @@ function mapLeaderboardFromVariables(widget, currency, ctx) {
   const window = v.period === "weekly" ? "week" : v.period === "monthly" ? "month" : "alltime";
   const title = currency === "tips" ? "Top Tippers" : currency === "cheers" ? "Top Cheerers" : "Top Gifters";
   return buildUnit(widget, "loyaltyleaderboard", {
+    // Carry SE text styling so the leaderboard list keeps the streamer's
+    // chosen font / size / color.
+    css: mapSeTextCssToModuleCss(widget, { fontSize: 18 }),
     content: {
       source: "variables",
       currency,
@@ -1761,6 +1772,8 @@ function mapGiveaway(widget, ctx) {
   const primary = v.colors?.primary ?? "#393853";
   const accent = v.colors?.accent ?? "#FF4076";
   return buildUnit(widget, "raffle", {
+    // Raffle renders entrants/winner text via module.css.
+    css: mapSeTextCssToModuleCss(widget),
     content: {
       version: 1,
       type: "basic",
@@ -1845,6 +1858,9 @@ function isHypetrainCustomWidget(widget) {
 function mapHypetrain(widget, ctx) {
   const v = widget.variables ?? {};
   return buildUnit(widget, "hypetrain", {
+    // Hypetrain renders level / progress / contributor text — carry SE
+    // styling so an imported hype-train widget keeps its font + accent.
+    css: mapSeTextCssToModuleCss(widget),
     content: {
       // Twitch-native is the right default — SE hype-train widgets always
       // reflected the Twitch native train. Users can flip to 'synthetic'
@@ -2237,6 +2253,23 @@ var GOAL_TYPES = /* @__PURE__ */ new Set([
   "se-widget-merch-goal"
 ]);
 var EVENTLIST_TYPES = /* @__PURE__ */ new Set(["se-widget-event-list", "se-widget-follower-recent", "se-widget-subscriber-recent", "se-widget-cheer-recent", "se-widget-tip-recent"]);
+var SCROLLING_RECENT_TYPES = /* @__PURE__ */ new Set([
+  "se-widget-follower-recent",
+  "se-widget-subscriber-recent",
+  "se-widget-cheer-recent",
+  "se-widget-tip-recent"
+]);
+var RECENT_TO_LATEST_FALLBACK_VAR = {
+  "se-widget-follower-recent": "twitch_last_follower",
+  "se-widget-subscriber-recent": "twitch_last_subscriber",
+  "se-widget-cheer-recent": "twitch_last_bit",
+  "se-widget-tip-recent": "latest_donator"
+};
+function isScrollingRecentWidget(widget) {
+  if (!SCROLLING_RECENT_TYPES.has(widget.type)) return false;
+  const scrolling = widget.text?.scrolling;
+  return !!(scrolling && typeof scrolling === "object" && scrolling.enabled === true);
+}
 function dispatch(widget, ctx) {
   const t = widget.type;
   console.log("[SE-IMPORT] dispatch widget", {
@@ -2265,6 +2298,10 @@ function dispatch(widget, ctx) {
   if (t === "se-widget-donor-drive-alert") return { unit: mapSingleAlert(widget, "donordrive-donation", ctx), status: "direct", lumiaType: "alert" };
   if (t === "se-widget-extralife-alert") return { unit: mapSingleAlert(widget, "extralife-donation", ctx), status: "direct", lumiaType: "alert" };
   if (t === "se-widget-tiltify-alert") return { unit: mapSingleAlert(widget, "tiltify-campaignDonation", ctx), status: "direct", lumiaType: "alert" };
+  if (isScrollingRecentWidget(widget)) {
+    const fallbackVar = RECENT_TO_LATEST_FALLBACK_VAR[t] ?? "username";
+    return { unit: mapReadout(widget, fallbackVar, ctx), status: "direct", lumiaType: "text" };
+  }
   if (EVENTLIST_TYPES.has(t)) return { unit: mapEventList(widget, ctx), status: "direct", lumiaType: "eventlist" };
   if (t === "se-widget-top-tippers-list") return { unit: mapLeaderboardFromVariables(widget, "tips", ctx), status: "direct", lumiaType: "loyaltyleaderboard" };
   if (t === "se-widget-top-cheerers-list") return { unit: mapLeaderboardFromVariables(widget, "cheers", ctx), status: "direct", lumiaType: "loyaltyleaderboard" };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@lumiastream/ui",
-	"version": "0.2.8-alpha.26",
+	"version": "0.2.8-alpha.27",
 	"author": "Lumia Stream",
 	"license": "ISC",
 	"description": "Lumia UI Kit",