@klikeai/cut-preview 1.0.1 → 1.0.2

package/dist/index.d.ts

@@ -61,6 +61,11 @@ interface CaptionStyle {
     template?: CaptionTemplate;
     /** Âncora vertical do bloco (sempre dentro das safe zones). */
     position?: 'bottom' | 'center' | 'top';
+    /** Fundo do bloco (hex #RRGGBB) — vale p/ QUALQUER template; '' = sem
+     * fundo (o template pill mantém o fundo escuro default). */
+    backgroundColor?: string;
+    /** Opacidade do fundo 0-1 (default 0.72; usada com backgroundColor). */
+    backgroundOpacity?: number;
 }
 interface CaptionsProps {
     enabled: boolean;

package/dist/index.js

@@ -21,7 +21,9 @@ var DEFAULT_CAPTION_STYLE = {
   activeScale: 1.15,
   animateIn: true,
   template: "classic",
-  position: "bottom"
+  position: "bottom",
+  backgroundColor: "",
+  backgroundOpacity: 0.72
 };
 var DEFAULT_CAPTION_DISPLAY_MODE = "highlight";
 var DEFAULT_CAPTION_COMBINE_MS = 1200;
@@ -291,6 +293,13 @@ var gradeFilter = (preset, intensity) => {
   if (t.hueDeg !== void 0) parts.push(`hue-rotate(${lerp(0, t.hueDeg)}deg)`);
   return parts.length ? parts.join(" ") : "none";
 };
+var hexToRgba = (hex, alpha = 1) => {
+  const m = /^#?([0-9a-f]{6})$/i.exec(hex.trim());
+  if (!m) return hex;
+  const n = parseInt(m[1], 16);
+  const a = Math.max(0, Math.min(alpha, 1));
+  return `rgba(${n >> 16 & 255}, ${n >> 8 & 255}, ${n & 255}, ${a})`;
+};
 var textOutline = (color, px = 3) => {
   const o = [];
   for (let dx = -px; dx <= px; dx++) {
@@ -592,12 +601,16 @@ var Page = ({ page, style, displayMode, safeZones }) => {
             lineHeight: 1.25,
             opacity: enter,
             transform: `scale(${interpolate3(enter, [0, 1], [0.92, 1])})`,
-            // Template pill: bloco da página sobre fundo arredondado translúcido.
-            ...template === "pill" ? {
-              backgroundColor: "rgba(12, 12, 14, 0.72)",
-              borderRadius: 22 * ui,
-              padding: "0.35em 0.6em"
-            } : {}
+            // Fundo do bloco: override explícito (backgroundColor+opacity) vale
+            // p/ QUALQUER template; sem override, só o pill tem o fundo default.
+            ...(() => {
+              const blockBg = style.backgroundColor ? hexToRgba(style.backgroundColor, style.backgroundOpacity) : template === "pill" ? "rgba(12, 12, 14, 0.72)" : void 0;
+              return blockBg ? {
+                backgroundColor: blockBg,
+                borderRadius: 22 * ui,
+                padding: "0.35em 0.6em"
+              } : {};
+            })()
           },
           children: page.tokens.map((t, i) => renderToken(t.text, t.fromMs, t.toMs, i))
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@klikeai/cut-preview",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "SmartStudioComposition + calculateMetadata do Klike Cut para o preview ao vivo (Remotion Player).",
   "type": "module",
   "main": "./dist/index.js",