veo-sdk 0.6.0 → 0.6.2

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-export { P as PreviewGuideInput, a as PreviewHandle, b as PreviewResult, c as closeGuidePreview, p as previewGuide } from './guide-preview-DylsEhrg.cjs';
+export { P as PreviewGuideInput, a as PreviewHandle, b as PreviewResult, c as closeGuidePreview, p as previewGuide } from './guide-preview-DEFhfA4o.cjs';
 
 /**
  * Configuración de la autocaptura de interacciones del DOM.
@@ -49,6 +49,18 @@ interface VeoConfig {
      * tooltips. Default: `false`.
      */
     guides?: boolean;
+    /**
+     * Detectar el tema visual de la app (colores base en claro/oscuro y fuentes)
+     * para que el design system de OnUser arranque con la marca del cliente.
+     * Solo viajan colores y nombres de fuentes, como mucho una vez al día por
+     * navegador. Default: `true`; `false` lo deshabilita.
+     */
+    detectTheme?: boolean;
+    /**
+     * URL del bundle del detector de tema (`veo-theme.js`). Solo aplica al build
+     * IIFE; si se omite, se deriva del `<script>` que cargó `veo.js`.
+     */
+    themeUrl?: string;
     /**
      * URL del bundle del builder (`veo-builder.js`). Solo se carga cuando la
      * página trae `?veoBuilder=<token>` (modo edición desde el dashboard). Si

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export { P as PreviewGuideInput, a as PreviewHandle, b as PreviewResult, c as closeGuidePreview, p as previewGuide } from './guide-preview-DylsEhrg.js';
+export { P as PreviewGuideInput, a as PreviewHandle, b as PreviewResult, c as closeGuidePreview, p as previewGuide } from './guide-preview-DEFhfA4o.js';
 
 /**
  * Configuración de la autocaptura de interacciones del DOM.
@@ -49,6 +49,18 @@ interface VeoConfig {
      * tooltips. Default: `false`.
      */
     guides?: boolean;
+    /**
+     * Detectar el tema visual de la app (colores base en claro/oscuro y fuentes)
+     * para que el design system de OnUser arranque con la marca del cliente.
+     * Solo viajan colores y nombres de fuentes, como mucho una vez al día por
+     * navegador. Default: `true`; `false` lo deshabilita.
+     */
+    detectTheme?: boolean;
+    /**
+     * URL del bundle del detector de tema (`veo-theme.js`). Solo aplica al build
+     * IIFE; si se omite, se deriva del `<script>` que cargó `veo.js`.
+     */
+    themeUrl?: string;
     /**
      * URL del bundle del builder (`veo-builder.js`). Solo se carga cuando la
      * página trae `?veoBuilder=<token>` (modo edición desde el dashboard). Si

package/dist/index.mjs

@@ -1,7 +1,7 @@
-import { definePlugin, guidesPlugin, runPreviewMode } from './chunk-GMXQMZ4X.mjs';
-export { definePlugin, guidesPlugin } from './chunk-GMXQMZ4X.mjs';
-import { hasWindow, hasDocument, uuidv7, DEFAULT_AUTOCAPTURE_CONFIG, MAX_ANCESTORS, hasLocalStorage, hasNavigatorSendBeacon, ALWAYS_BLOCK_SELECTORS, buildSelectorPath, resolveBuilderToken, filterHumanClasses, PRIORITY_ATTRIBUTES, SENSITIVE_ATTRIBUTES, getPreviewToken, isBuilderMode, previewGuide, closeGuidePreview } from './chunk-O6USA4TU.mjs';
-export { closeGuidePreview, previewGuide } from './chunk-O6USA4TU.mjs';
+import { definePlugin, guidesPlugin, runPreviewMode } from './chunk-L3QQJLDJ.mjs';
+export { definePlugin, guidesPlugin } from './chunk-L3QQJLDJ.mjs';
+import { hasWindow, hasDocument, uuidv7, DEFAULT_AUTOCAPTURE_CONFIG, MAX_ANCESTORS, hasLocalStorage, hasNavigatorSendBeacon, isBuilderMode, ALWAYS_BLOCK_SELECTORS, buildSelectorPath, resolveBuilderToken, filterHumanClasses, PRIORITY_ATTRIBUTES, SENSITIVE_ATTRIBUTES, getPreviewToken, previewGuide, closeGuidePreview } from './chunk-ZILDR4YE.mjs';
+export { closeGuidePreview, previewGuide } from './chunk-ZILDR4YE.mjs';
 import './chunk-PTG3BTJE.mjs';
 
 // src/contract/v1.ts
@@ -291,6 +291,118 @@ function spaRouterPlugin() {
   });
 }
 
+// src/plugins/theme-detect/index.ts
+var STORAGE_PREFIX = "veo_theme_";
+var RESEND_AFTER_MS = 24 * 60 * 60 * 1e3;
+var SETTLE_MS = 4e3;
+var MAX_RUNS_PER_PAGE = 4;
+function readState(key) {
+  try {
+    const raw = localStorage.getItem(key);
+    const parsed = raw ? JSON.parse(raw) : null;
+    return parsed && typeof parsed === "object" ? parsed : {};
+  } catch {
+    return {};
+  }
+}
+function writeState(key, state) {
+  try {
+    localStorage.setItem(key, JSON.stringify(state));
+  } catch {
+  }
+}
+function guessMode(doc, prefersDark) {
+  const hints = [
+    doc.documentElement.className,
+    doc.documentElement.dataset.theme,
+    doc.documentElement.dataset.mode,
+    doc.body?.className
+  ].join(" ").toLowerCase();
+  if (/\bdark\b/.test(hints)) return "dark";
+  if (/\blight\b/.test(hints)) return "light";
+  return prefersDark ? "dark" : "light";
+}
+function isFresh(state, mode, now) {
+  const last = state[mode];
+  return last !== void 0 && now - last.at < RESEND_AFTER_MS;
+}
+function shouldSendSnapshot(state, mode, hash, now) {
+  const last = state[mode];
+  return !last || last.hash !== hash || now - last.at >= RESEND_AFTER_MS;
+}
+function themeDetectPlugin(config) {
+  const storageKey = `${STORAGE_PREFIX}${config.apiKey.slice(-16) || "default"}`;
+  let observer = null;
+  let timer = null;
+  let destroyed = false;
+  let runs = 0;
+  const run = async () => {
+    if (destroyed || runs >= MAX_RUNS_PER_PAGE) return;
+    const prefersDark = typeof window.matchMedia === "function" && window.matchMedia("(prefers-color-scheme: dark)").matches;
+    const guess = guessMode(document, prefersDark);
+    if (isFresh(readState(storageKey), guess, Date.now())) return;
+    runs++;
+    try {
+      const detector = await config.loadDetector();
+      if (!detector || destroyed) return;
+      const snapshot = detector.detectTheme();
+      if (!snapshot) return;
+      const hash = detector.snapshotHash(snapshot);
+      const state = readState(storageKey);
+      const now = Date.now();
+      const mark = () => {
+        const record = { hash, at: Date.now() };
+        state[snapshot.mode] = record;
+        state[guess] = state[guess] && guess !== snapshot.mode ? state[guess] : record;
+        writeState(storageKey, state);
+      };
+      if (!shouldSendSnapshot(state, snapshot.mode, hash, now)) {
+        mark();
+        return;
+      }
+      if (config.debug) console.log("[veo] theme snapshot", snapshot);
+      const res = await fetch(`${config.apiUrl}/v1/workspaces/theme-snapshot`, {
+        method: "POST",
+        headers: { "X-Api-Key": config.apiKey, "Content-Type": "application/json" },
+        body: JSON.stringify(snapshot),
+        credentials: "omit"
+      });
+      if (res.ok) mark();
+    } catch (err) {
+      if (config.debug) console.warn("[veo] theme detect failed", err);
+    }
+  };
+  const schedule = (delayMs) => {
+    if (timer) clearTimeout(timer);
+    timer = setTimeout(() => {
+      timer = null;
+      const idle = window.requestIdleCallback;
+      if (typeof idle === "function") idle(() => void run());
+      else void run();
+    }, delayMs);
+  };
+  return {
+    name: "theme-detect",
+    install() {
+      if (!hasWindow() || !hasDocument()) return;
+      if (document.readyState === "complete") schedule(SETTLE_MS);
+      else window.addEventListener("load", () => schedule(SETTLE_MS), { once: true });
+      if (typeof MutationObserver === "function") {
+        observer = new MutationObserver(() => schedule(1500));
+        observer.observe(document.documentElement, {
+          attributes: true,
+          attributeFilter: ["class", "data-theme", "data-mode"]
+        });
+      }
+    },
+    destroy() {
+      destroyed = true;
+      observer?.disconnect();
+      if (timer) clearTimeout(timer);
+    }
+  };
+}
+
 // src/core/queue.ts
 var RETRY_MAX_DELAY_MS = 3e4;
 var Queue = class {
@@ -437,26 +549,26 @@ var Session = class {
 };
 
 // src/core/storage.ts
-var STORAGE_PREFIX = "veo:";
+var STORAGE_PREFIX2 = "veo:";
 var ONE_YEAR_MS = 365 * 24 * 60 * 60 * 1e3;
 var LocalStorageAdapter = class {
   get(key) {
-    return localStorage.getItem(STORAGE_PREFIX + key);
+    return localStorage.getItem(STORAGE_PREFIX2 + key);
   }
   set(key, value) {
     try {
-      localStorage.setItem(STORAGE_PREFIX + key, value);
+      localStorage.setItem(STORAGE_PREFIX2 + key, value);
     } catch {
     }
   }
   remove(key) {
-    localStorage.removeItem(STORAGE_PREFIX + key);
+    localStorage.removeItem(STORAGE_PREFIX2 + key);
   }
   clear() {
     const toRemove = [];
     for (let i = 0; i < localStorage.length; i++) {
       const key = localStorage.key(i);
-      if (key?.startsWith(STORAGE_PREFIX)) toRemove.push(key);
+      if (key?.startsWith(STORAGE_PREFIX2)) toRemove.push(key);
     }
     for (const key of toRemove) localStorage.removeItem(key);
   }
@@ -467,7 +579,7 @@ function readCookies() {
 }
 var CookieAdapter = class {
   get(key) {
-    const name = `${STORAGE_PREFIX}${key}=`;
+    const name = `${STORAGE_PREFIX2}${key}=`;
     for (const cookie of readCookies()) {
       if (cookie.startsWith(name)) {
         return decodeURIComponent(cookie.slice(name.length));
@@ -478,19 +590,19 @@ var CookieAdapter = class {
   set(key, value, options) {
     const maxAgeSec = Math.floor((options?.ttlMs ?? ONE_YEAR_MS) / 1e3);
     const secure = typeof location !== "undefined" && location.protocol === "https:" ? "; Secure" : "";
-    document.cookie = `${STORAGE_PREFIX}${key}=${encodeURIComponent(
+    document.cookie = `${STORAGE_PREFIX2}${key}=${encodeURIComponent(
       value
     )}; Path=/; Max-Age=${maxAgeSec}; SameSite=Lax${secure}`;
   }
   remove(key) {
-    document.cookie = `${STORAGE_PREFIX}${key}=; Path=/; Max-Age=0; SameSite=Lax`;
+    document.cookie = `${STORAGE_PREFIX2}${key}=; Path=/; Max-Age=0; SameSite=Lax`;
   }
   clear() {
     for (const cookie of readCookies()) {
       const eq = cookie.indexOf("=");
       const name = eq === -1 ? cookie : cookie.slice(0, eq);
-      if (name.startsWith(STORAGE_PREFIX)) {
-        this.remove(name.slice(STORAGE_PREFIX.length));
+      if (name.startsWith(STORAGE_PREFIX2)) {
+        this.remove(name.slice(STORAGE_PREFIX2.length));
       }
     }
   }
@@ -779,13 +891,23 @@ var Client = class {
 };
 
 // src/core/setup.ts
-function setupClient(config, onGuides, loadBuilder) {
+function setupClient(config, onGuides, loadBuilder, loadThemeDetector) {
   const client = new Client(config);
   client.use(spaRouterPlugin());
   if (config.autocapture !== false) {
     const autocaptureConfig = typeof config.autocapture === "object" ? config.autocapture : {};
     client.use(autocapturePlugin(autocaptureConfig));
   }
+  if (config.detectTheme !== false && loadThemeDetector && !isBuilderMode()) {
+    client.use(
+      themeDetectPlugin({
+        apiUrl: resolveApiUrl(config),
+        apiKey: config.apiKey,
+        loadDetector: loadThemeDetector,
+        ...config.debug !== void 0 ? { debug: config.debug } : {}
+      })
+    );
+  }
   onGuides(client);
   if (typeof window !== "undefined") {
     const stub = window.veo;
@@ -844,7 +966,10 @@ function init(config) {
     // Fallback de carga del builder para bundlers: `import()` dinámico → el bundler
     // lo code-splitea (solo se descarga en modo builder). Así el consumidor por
     // bundler NO necesita copiar `veo-builder.js` ni setear `builderUrl`.
-    () => import('./builder-3QPHB2VJ.mjs').then((m) => m.initBuilderMode())
+    () => import('./builder-ENKEIVF2.mjs').then((m) => m.initBuilderMode()),
+    // Detector de tema: también por `import()` dinámico → chunk aparte que el
+    // bundler solo descarga cuando toca detectar (como mucho una vez al día).
+    () => import('./detect-theme-X4K3TLUL.mjs')
   );
 }