veo-sdk 0.3.12 → 0.3.14

package/dist/index.cjs

@@ -659,6 +659,15 @@ function applyDesignVars(host, style) {
       host.style.setProperty(key, value);
     }
   }
+  if (typeof s.background === "string" && COLOR_RE.test(s.background.trim())) {
+    host.style.setProperty("--veo-bg", s.background.trim());
+  }
+  if (typeof s.textColor === "string" && COLOR_RE.test(s.textColor.trim())) {
+    host.style.setProperty("--veo-text", s.textColor.trim());
+  }
+  if (typeof s.textSecondaryColor === "string" && COLOR_RE.test(s.textSecondaryColor.trim())) {
+    host.style.setProperty("--veo-text-secondary", s.textSecondaryColor.trim());
+  }
   if (typeof s.radius === "number" && Number.isFinite(s.radius)) {
     host.style.setProperty("--veo-radius", `${clamp(s.radius, 0, 48)}px`);
   }
@@ -700,10 +709,26 @@ function applyDesignVars(host, style) {
     applyElementVars(host, "title", el.title);
     applyElementVars(host, "text", el.text);
     applyElementVars(host, "image", el.image);
-    const cta = el.cta;
-    if (cta && typeof cta.align === "string" && ALIGN_JUSTIFY[cta.align]) {
-      host.style.setProperty("--veo-actions-justify", ALIGN_JUSTIFY[cta.align]);
-    }
+    applyCtaVars(host, el.cta);
+  }
+}
+function applyCtaVars(host, raw) {
+  if (!raw || typeof raw !== "object") return;
+  const cta = raw;
+  if (typeof cta.align === "string" && ALIGN_JUSTIFY[cta.align]) {
+    host.style.setProperty("--veo-actions-justify", ALIGN_JUSTIFY[cta.align]);
+  }
+  if (typeof cta.background === "string" && COLOR_RE.test(cta.background.trim())) {
+    host.style.setProperty("--veo-cta-bg", cta.background.trim());
+  }
+  if (typeof cta.color === "string" && COLOR_RE.test(cta.color.trim())) {
+    host.style.setProperty("--veo-cta-color", cta.color.trim());
+  }
+  if (typeof cta.fontSize === "number" && Number.isFinite(cta.fontSize)) {
+    host.style.setProperty("--veo-cta-size", `${clamp(cta.fontSize, 10, 24)}px`);
+  }
+  if (typeof cta.radius === "number" && Number.isFinite(cta.radius)) {
+    host.style.setProperty("--veo-cta-radius", `${clamp(cta.radius, 0, 48)}px`);
   }
 }
 function applyElementVars(host, prefix, raw) {
@@ -785,7 +810,7 @@ var init_styles = __esm({
     init_constants2();
     GUIDE_STYLES = `
 :host {
-  --veo-primary: #4f46e5;
+  --veo-primary: #FF5B35;
   --veo-text: #1f2937;
   --veo-text-secondary: #4b5563;
   --veo-bg: #ffffff;
@@ -903,9 +928,10 @@ var init_styles = __esm({
   display: flex; gap: 8px; justify-content: var(--veo-actions-justify);
 }
 .veo-guide-cta {
-  background: var(--veo-primary); color: #fff; border: none;
-  padding: 9px 18px; border-radius: 8px;
-  font-size: 14px; font-weight: 500; cursor: pointer;
+  background: var(--veo-cta-bg, var(--veo-primary));
+  color: var(--veo-cta-color, #fff); border: none;
+  padding: 9px 18px; border-radius: var(--veo-cta-radius, 8px);
+  font-size: var(--veo-cta-size, 14px); font-weight: 500; cursor: pointer;
   transition: opacity 120ms ease;
 }
 .veo-guide-cta:hover { opacity: 0.9; }
@@ -1209,7 +1235,7 @@ function mountCustomFrame(doc, step, context, opts) {
   const iframe = doc.createElement("iframe");
   iframe.className = "veo-custom-frame";
   iframe.setAttribute("sandbox", "allow-scripts");
-  iframe.setAttribute("title", context.guide.guideName || "Veo");
+  iframe.setAttribute("title", context.guide.guideName || "OnUser");
   iframe.style.width = opts.width;
   const hasFixedHeight = opts.fixedHeight !== void 0 && opts.fixedHeight !== null;
   if (hasFixedHeight) iframe.style.height = toCssSize(opts.fixedHeight);
@@ -2329,7 +2355,7 @@ function injectBuilderPanel(opts) {
   header.className = "veo-panel-header";
   const title = document.createElement("span");
   title.className = "veo-panel-title";
-  title.textContent = "Veo \xB7 Editor";
+  title.textContent = "OnUser \xB7 Editor";
   const actions = document.createElement("div");
   actions.className = "veo-panel-actions";
   const popout = document.createElement("button");
@@ -2471,7 +2497,7 @@ var init_builder_panel = __esm({
   flex: 0 0 auto;
   display: flex; align-items: center; justify-content: space-between;
   padding: 8px 10px 8px 12px;
-  background: #0f172a; color: #fff;
+  background: #1b1714; color: #f7f1eb;
   font-size: 13px; font-weight: 600;
   cursor: grab;
 }