@lumiastream/ui 0.6.4 → 0.6.6-beta.1

package/dist/index.js

@@ -5759,6 +5759,11 @@ function mapTrain(widget, ctx) {
     { width: 540, height: 60 }
   );
 }
+function seTimerWantsContainerScaling(widget) {
+  const fontSize = widget.text?.css?.["font-size"];
+  if (typeof fontSize !== "string") return false;
+  return /\d\s*(vw|vh|vmin|vmax|cqw|cqh|cqi|cqb)\s*$/i.test(fontSize.trim());
+}
 function mapTimer(widget, ctx) {
   const v = widget.variables ?? {};
   const textValue = typeof widget.text?.value === "string" ? widget.text.value : void 0;
@@ -5828,13 +5833,7 @@ function mapTimer(widget, ctx) {
     widget,
     "timer",
     {
-      // Carry the streamer's SE text styling (font/size/color/shadow) so an
-      // imported countdown doesn't render in Lumia's default Roboto/24px.
-      // scaleWithContainer: SE renders the countdown at the literal font-size and lets
-      // `widget { overflow:hidden }` clip the overflow (visually masked by the canvas-level
-      // transform). Lumia has no equivalent clip on the layer, so a 150px font in a 162px
-      // box overflows visibly. Opt the imported timer into Lumia's container-query auto-fit.
-      css: { ...mapSeTextCssToModuleCss(widget), scaleWithContainer: true },
+      css: { ...mapSeTextCssToModuleCss(widget), ...seTimerWantsContainerScaling(widget) ? { scaleWithContainer: "true" } : {} },
       content: {
         version: 1,
         type: "countdown",

package/dist/se-import.js

@@ -2679,6 +2679,11 @@ function mapTrain(widget, ctx) {
     { width: 540, height: 60 }
   );
 }
+function seTimerWantsContainerScaling(widget) {
+  const fontSize = widget.text?.css?.["font-size"];
+  if (typeof fontSize !== "string") return false;
+  return /\d\s*(vw|vh|vmin|vmax|cqw|cqh|cqi|cqb)\s*$/i.test(fontSize.trim());
+}
 function mapTimer(widget, ctx) {
   const v = widget.variables ?? {};
   const textValue = typeof widget.text?.value === "string" ? widget.text.value : void 0;
@@ -2748,13 +2753,7 @@ function mapTimer(widget, ctx) {
     widget,
     "timer",
     {
-      // Carry the streamer's SE text styling (font/size/color/shadow) so an
-      // imported countdown doesn't render in Lumia's default Roboto/24px.
-      // scaleWithContainer: SE renders the countdown at the literal font-size and lets
-      // `widget { overflow:hidden }` clip the overflow (visually masked by the canvas-level
-      // transform). Lumia has no equivalent clip on the layer, so a 150px font in a 162px
-      // box overflows visibly. Opt the imported timer into Lumia's container-query auto-fit.
-      css: { ...mapSeTextCssToModuleCss(widget), scaleWithContainer: true },
+      css: { ...mapSeTextCssToModuleCss(widget), ...seTimerWantsContainerScaling(widget) ? { scaleWithContainer: "true" } : {} },
       content: {
         version: 1,
         type: "countdown",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lumiastream/ui",
-  "version": "0.6.4",
+  "version": "0.6.6-beta.1",
   "author": "Lumia Stream",
   "license": "ISC",
   "description": "Lumia UI Kit",