@lumiastream/ui 0.5.2 → 0.5.3

package/dist/index.js

@@ -7675,13 +7675,7 @@ function buildBaseAlertEvent(settings, prefix, defaultMessage) {
   const fontWeight = getField(settings, prefix, "font_weight") ?? 600;
   const fontColor = getField(settings, prefix, "font_color") ?? "#FFFFFF";
   const highlightColor = getField(settings, prefix, "font_color2") ?? "#32C3A6";
-  const messageFontSize = pxToNumber(
-    getField(settings, prefix, "message_font_size"),
-    20
-  );
-  const messageFontFamily = getField(settings, prefix, "message_font") ?? fontFamily;
-  const messageFontWeight = getField(settings, prefix, "message_font_weight") ?? 400;
-  const messageFontColor = getField(settings, prefix, "message_font_color") ?? "#FFFFFF";
+  const secondaryMessage = readSecondaryMessageConfig(settings, prefix, fontFamily);
   const imageHref = absolutizeSLUrl(getField(settings, prefix, "image_href"));
   const soundHref = absolutizeSLUrl(getField(settings, prefix, "sound_href"));
   const soundVolume = getField(settings, prefix, "sound_volume") ?? 50;
@@ -7700,7 +7694,7 @@ function buildBaseAlertEvent(settings, prefix, defaultMessage) {
       accentColor: null,
       highlightColor,
       firstMessageTemplate: translateSeText(messageTemplate),
-      secondMessageTemplate: "",
+      secondMessageTemplate: secondaryMessage?.template ?? "",
       thirdMessageTemplate: "",
       showAvatar: false,
       showAmount: true,
@@ -7723,12 +7717,10 @@ function buildBaseAlertEvent(settings, prefix, defaultMessage) {
         textShadow: "rgba(0, 0, 0, 0.8) 1px 1px 1px",
         textAlign: "center"
       },
-      messageCss: {
-        fontFamily: messageFontFamily,
-        fontSize: messageFontSize,
-        color: messageFontColor,
-        fontWeight: messageFontWeight
-      },
+      // `messageCss` only matters when secondMessageTemplate is set;
+      // leave it empty when SL didn't ship a secondary-message block
+      // so Lumia's renderer falls back to its own default styling.
+      messageCss: secondaryMessage?.css ?? {},
       content: { value: translateSeText(messageTemplate) }
     },
     media: {
@@ -7771,6 +7763,36 @@ function buildBaseAlertEvent(settings, prefix, defaultMessage) {
     variations: []
   };
 }
+var SECONDARY_MESSAGE_PREFIX_OVERRIDE = {
+  sub: "resub"
+};
+function readSecondaryMessageConfig(settings, prefix, primaryFontFamily) {
+  const secondaryPrefix = SECONDARY_MESSAGE_PREFIX_OVERRIDE[prefix] ?? prefix;
+  const showKey = `show_${secondaryPrefix}_message`;
+  const enabled = settings[showKey];
+  if (enabled !== true) return null;
+  const fontFamily = getField(settings, secondaryPrefix, "message_font") ?? primaryFontFamily;
+  const fontSize = pxToNumber(
+    getField(settings, secondaryPrefix, "message_font_size"),
+    20
+  );
+  const fontWeight = getField(settings, secondaryPrefix, "message_font_weight") ?? 400;
+  const fontColor = getField(settings, secondaryPrefix, "message_font_color") ?? "#FFFFFF";
+  return {
+    // `{message}` is the SE/SL chat-message token (mapped to Lumia's
+    // `{{message}}` in translate.ts). It resolves at render time from
+    // the alert payload's `message` field — populated for every event
+    // where SL ships a secondary-message line (donations, resubs,
+    // cheers, charity, merch, etc.).
+    template: translateSeText("{message}"),
+    css: {
+      fontFamily,
+      fontSize,
+      color: fontColor,
+      fontWeight
+    }
+  };
+}
 function clampVolume(slVolume) {
   if (typeof slVolume !== "number" || !Number.isFinite(slVolume)) return 0.5;
   return Math.max(0, Math.min(1, slVolume / 100));

package/dist/se-import.js

@@ -6523,13 +6523,7 @@ function buildBaseAlertEvent(settings, prefix, defaultMessage) {
   const fontWeight = getField(settings, prefix, "font_weight") ?? 600;
   const fontColor = getField(settings, prefix, "font_color") ?? "#FFFFFF";
   const highlightColor = getField(settings, prefix, "font_color2") ?? "#32C3A6";
-  const messageFontSize = pxToNumber(
-    getField(settings, prefix, "message_font_size"),
-    20
-  );
-  const messageFontFamily = getField(settings, prefix, "message_font") ?? fontFamily;
-  const messageFontWeight = getField(settings, prefix, "message_font_weight") ?? 400;
-  const messageFontColor = getField(settings, prefix, "message_font_color") ?? "#FFFFFF";
+  const secondaryMessage = readSecondaryMessageConfig(settings, prefix, fontFamily);
   const imageHref = absolutizeSLUrl(getField(settings, prefix, "image_href"));
   const soundHref = absolutizeSLUrl(getField(settings, prefix, "sound_href"));
   const soundVolume = getField(settings, prefix, "sound_volume") ?? 50;
@@ -6548,7 +6542,7 @@ function buildBaseAlertEvent(settings, prefix, defaultMessage) {
       accentColor: null,
       highlightColor,
       firstMessageTemplate: translateSeText(messageTemplate),
-      secondMessageTemplate: "",
+      secondMessageTemplate: secondaryMessage?.template ?? "",
       thirdMessageTemplate: "",
       showAvatar: false,
       showAmount: true,
@@ -6571,12 +6565,10 @@ function buildBaseAlertEvent(settings, prefix, defaultMessage) {
         textShadow: "rgba(0, 0, 0, 0.8) 1px 1px 1px",
         textAlign: "center"
       },
-      messageCss: {
-        fontFamily: messageFontFamily,
-        fontSize: messageFontSize,
-        color: messageFontColor,
-        fontWeight: messageFontWeight
-      },
+      // `messageCss` only matters when secondMessageTemplate is set;
+      // leave it empty when SL didn't ship a secondary-message block
+      // so Lumia's renderer falls back to its own default styling.
+      messageCss: secondaryMessage?.css ?? {},
       content: { value: translateSeText(messageTemplate) }
     },
     media: {
@@ -6619,6 +6611,36 @@ function buildBaseAlertEvent(settings, prefix, defaultMessage) {
     variations: []
   };
 }
+var SECONDARY_MESSAGE_PREFIX_OVERRIDE = {
+  sub: "resub"
+};
+function readSecondaryMessageConfig(settings, prefix, primaryFontFamily) {
+  const secondaryPrefix = SECONDARY_MESSAGE_PREFIX_OVERRIDE[prefix] ?? prefix;
+  const showKey = `show_${secondaryPrefix}_message`;
+  const enabled = settings[showKey];
+  if (enabled !== true) return null;
+  const fontFamily = getField(settings, secondaryPrefix, "message_font") ?? primaryFontFamily;
+  const fontSize = pxToNumber(
+    getField(settings, secondaryPrefix, "message_font_size"),
+    20
+  );
+  const fontWeight = getField(settings, secondaryPrefix, "message_font_weight") ?? 400;
+  const fontColor = getField(settings, secondaryPrefix, "message_font_color") ?? "#FFFFFF";
+  return {
+    // `{message}` is the SE/SL chat-message token (mapped to Lumia's
+    // `{{message}}` in translate.ts). It resolves at render time from
+    // the alert payload's `message` field — populated for every event
+    // where SL ships a secondary-message line (donations, resubs,
+    // cheers, charity, merch, etc.).
+    template: translateSeText("{message}"),
+    css: {
+      fontFamily,
+      fontSize,
+      color: fontColor,
+      fontWeight
+    }
+  };
+}
 function clampVolume(slVolume) {
   if (typeof slVolume !== "number" || !Number.isFinite(slVolume)) return 0.5;
   return Math.max(0, Math.min(1, slVolume / 100));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lumiastream/ui",
-  "version": "0.5.2",
+  "version": "0.5.3",
   "author": "Lumia Stream",
   "license": "ISC",
   "description": "Lumia UI Kit",