veo-sdk 0.1.0 → 0.2.0

package/dist/index.cjs

@@ -2,11 +2,6 @@
 
 var dom = require('@floating-ui/dom');
 
-// src/contract/v1.ts
-var SDK_VERSION = "0.0.1";
-var DEFAULT_FLUSH_INTERVAL_MS = 5e3;
-var DEFAULT_FLUSH_BATCH_SIZE = 20;
-
 // src/utils/safe-env.ts
 function hasWindow() {
   return typeof window !== "undefined";
@@ -29,846 +24,986 @@ function hasNavigatorSendBeacon() {
   return typeof navigator !== "undefined" && typeof navigator.sendBeacon === "function";
 }
 
-// src/utils/uuid.ts
-function uuidv7() {
-  const timestamp = Date.now();
-  const timeHex = timestamp.toString(16).padStart(12, "0");
-  const random = new Uint8Array(10);
-  if (typeof crypto !== "undefined" && typeof crypto.getRandomValues === "function") {
-    crypto.getRandomValues(random);
-  } else {
-    for (let i = 0; i < random.length; i++) {
-      random[i] = Math.floor(Math.random() * 256);
-    }
+// src/core/builder-loader.ts
+var BUILDER_TOKEN_PARAM = "veoBuilder";
+function isBuilderMode() {
+  if (!hasWindow()) return false;
+  try {
+    return new URLSearchParams(window.location.search).has(BUILDER_TOKEN_PARAM);
+  } catch {
+    return false;
   }
-  random[0] = (random[0] ?? 0) & 15 | 112;
-  random[2] = (random[2] ?? 0) & 63 | 128;
-  const hex = Array.from(random, (b) => b.toString(16).padStart(2, "0")).join("");
-  return [
-    timeHex.slice(0, 8),
-    timeHex.slice(8, 12),
-    hex.slice(0, 4),
-    hex.slice(4, 8),
-    hex.slice(8, 20)
-  ].join("-");
 }
-
-// src/core/queue.ts
-var RETRY_MAX_DELAY_MS = 3e4;
-var Queue = class {
-  constructor(config) {
-    this.config = config;
-    this.buffer = [];
-    this.timer = null;
-    this.flushing = false;
-    this.retryCount = 0;
-    this.retryTimer = null;
-    this.startTimer();
-  }
-  /** Encola un evento; dispara flush si se alcanza `batchSize`. */
-  add(item) {
-    this.buffer.push(item);
-    if (this.buffer.length >= this.config.batchSize) {
-      void this.flush();
-    }
+function maybeLoadBuilder(opts) {
+  if (!hasWindow() || !hasDocument()) return;
+  let params;
+  try {
+    params = new URLSearchParams(window.location.search);
+  } catch {
+    return;
   }
-  /** Flush manual vía `fetch`. Resuelve cuando termina (los retries son diferidos). */
-  async flush() {
-    if (this.flushing || this.buffer.length === 0) return;
-    this.flushing = true;
-    const batch = this.buffer.splice(0, this.buffer.length);
-    try {
-      await this.config.transport.send("/v1/events", { events: batch });
-      this.retryCount = 0;
-    } catch (error) {
-      this.buffer.unshift(...batch);
-      this.scheduleRetry();
-      this.config.onError?.(error);
-    } finally {
-      this.flushing = false;
-    }
+  if (!params.has(BUILDER_TOKEN_PARAM)) return;
+  if (opts.apiKey && opts.apiUrl) {
+    window.__veoBuilder = {
+      apiKey: opts.apiKey,
+      apiUrl: opts.apiUrl
+    };
   }
-  /** Flush síncrono vía `sendBeacon`, para `pagehide`/`visibilitychange`. */
-  flushBeacon() {
-    if (this.buffer.length === 0) return;
-    const batch = this.buffer.splice(0, this.buffer.length);
-    const success = this.config.transport.sendBeacon("/v1/events", { events: batch });
-    if (!success) {
-      this.buffer.unshift(...batch);
+  if (window.veoBuilder) return;
+  const url = opts.builderUrl ?? deriveBuilderUrl();
+  if (!url) {
+    if (opts.debug) {
+      console.warn("[veo] builder mode pedido pero no pude resolver la URL de veo-builder.js");
     }
+    return;
   }
-  /** Detiene timers internos. Llamar al destruir el cliente. */
-  destroy() {
-    if (this.timer) clearInterval(this.timer);
-    if (this.retryTimer) clearTimeout(this.retryTimer);
-    this.timer = null;
-    this.retryTimer = null;
-  }
-  startTimer() {
-    this.timer = setInterval(() => {
-      void this.flush();
-    }, this.config.flushIntervalMs);
+  if (document.querySelector(`script[src="${url}"]`)) return;
+  const script = document.createElement("script");
+  script.src = url;
+  script.async = true;
+  if (opts.debug) {
+    script.addEventListener("error", () => console.error("[veo] no pude cargar", url));
   }
-  scheduleRetry() {
-    const maxRetries = this.config.maxRetries ?? 3;
-    if (this.retryCount >= maxRetries) {
-      this.retryCount = 0;
-      return;
+  document.head.appendChild(script);
+}
+function deriveBuilderUrl() {
+  const scripts = document.querySelectorAll("script[src]");
+  for (const script of Array.from(scripts)) {
+    if (/\bveo(\.min)?\.js(\?.*)?$/.test(script.src)) {
+      return script.src.replace(/\bveo(\.min)?\.js/, "veo-builder$1.js");
     }
-    this.retryCount++;
-    const delayMs = Math.min(1e3 * 2 ** (this.retryCount - 1), RETRY_MAX_DELAY_MS);
-    if (this.retryTimer) clearTimeout(this.retryTimer);
-    this.retryTimer = setTimeout(() => {
-      void this.flush();
-    }, delayMs);
   }
-};
+  return null;
+}
 
-// src/core/session.ts
-var ANONYMOUS_ID_KEY = "anonymous_user_id";
-var END_USER_ID_KEY = "end_user_id";
-var SESSION_ID_KEY = "session_id";
-var SESSION_LAST_ACTIVE_KEY = "session_last_active";
-var SESSION_TIMEOUT_MS = 30 * 60 * 1e3;
-var Session = class {
-  constructor(storage) {
-    this.storage = storage;
-    this._endUserId = null;
-    this._anonymousId = this.loadOrCreateAnonymousId();
-    this._sessionId = this.loadOrCreateSession();
-    this._endUserId = this.storage.get(END_USER_ID_KEY);
-  }
-  get anonymousId() {
-    return this._anonymousId;
-  }
-  get sessionId() {
-    return this._sessionId;
-  }
-  get endUserId() {
-    return this._endUserId;
-  }
-  /** ID a usar como visitor en eventos (end_user_id si está identificado, si no anonymous). */
-  get effectiveUserId() {
-    return this._endUserId ?? this._anonymousId;
-  }
-  setEndUserId(id) {
-    this._endUserId = id;
-    this.storage.set(END_USER_ID_KEY, id);
-  }
-  /** Renueva el timestamp de actividad. Si pasaron > 30 min, genera nueva sesión. */
-  touch() {
-    const lastActive = this.storage.get(SESSION_LAST_ACTIVE_KEY);
-    const now = Date.now();
-    if (lastActive && now - Number.parseInt(lastActive, 10) > SESSION_TIMEOUT_MS) {
-      this._sessionId = uuidv7();
-      this.storage.set(SESSION_ID_KEY, this._sessionId);
-    }
-    this.storage.set(SESSION_LAST_ACTIVE_KEY, String(now));
-  }
-  /** Limpia la identidad (reset) pero conserva el anonymous_id. */
-  reset() {
-    this._endUserId = null;
-    this.storage.remove(END_USER_ID_KEY);
-    this._sessionId = uuidv7();
-    this.storage.set(SESSION_ID_KEY, this._sessionId);
-    this.storage.set(SESSION_LAST_ACTIVE_KEY, String(Date.now()));
-  }
-  loadOrCreateAnonymousId() {
-    let id = this.storage.get(ANONYMOUS_ID_KEY);
-    if (!id) {
-      id = uuidv7();
-      this.storage.set(ANONYMOUS_ID_KEY, id);
-    }
-    return id;
-  }
-  loadOrCreateSession() {
-    const existing = this.storage.get(SESSION_ID_KEY);
-    const lastActive = this.storage.get(SESSION_LAST_ACTIVE_KEY);
-    if (existing && lastActive) {
-      const elapsed = Date.now() - Number.parseInt(lastActive, 10);
-      if (elapsed < SESSION_TIMEOUT_MS) {
-        return existing;
-      }
-    }
-    const newId = uuidv7();
-    this.storage.set(SESSION_ID_KEY, newId);
-    this.storage.set(SESSION_LAST_ACTIVE_KEY, String(Date.now()));
-    return newId;
+// src/core/preview-loader.ts
+var PREVIEW_TOKEN_PARAM = "veoPreview";
+function getPreviewToken() {
+  if (!hasWindow()) return null;
+  try {
+    const value = new URLSearchParams(window.location.search).get(PREVIEW_TOKEN_PARAM);
+    return value ? value : null;
+  } catch {
+    return null;
   }
-};
+}
 
-// src/core/storage.ts
-var STORAGE_PREFIX = "veo:";
-var ONE_YEAR_MS = 365 * 24 * 60 * 60 * 1e3;
-var LocalStorageAdapter = class {
-  get(key) {
-    return localStorage.getItem(STORAGE_PREFIX + key);
-  }
-  set(key, value) {
-    try {
-      localStorage.setItem(STORAGE_PREFIX + key, value);
-    } catch {
-    }
-  }
-  remove(key) {
-    localStorage.removeItem(STORAGE_PREFIX + 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);
-    }
-    for (const key of toRemove) localStorage.removeItem(key);
-  }
-};
-function readCookies() {
-  const raw = document.cookie;
-  return raw === "" ? [] : raw.split("; ");
+// src/plugins/plugin.ts
+function definePlugin(plugin) {
+  return plugin;
 }
-var CookieAdapter = class {
-  get(key) {
-    const name = `${STORAGE_PREFIX}${key}=`;
-    for (const cookie of readCookies()) {
-      if (cookie.startsWith(name)) {
-        return decodeURIComponent(cookie.slice(name.length));
-      }
-    }
-    return null;
-  }
-  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(
-      value
-    )}; Path=/; Max-Age=${maxAgeSec}; SameSite=Lax${secure}`;
-  }
-  remove(key) {
-    document.cookie = `${STORAGE_PREFIX}${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));
-      }
-    }
-  }
+
+// src/plugins/autocapture/constants.ts
+var DEFAULT_AUTOCAPTURE_CONFIG = {
+  enabled: true,
+  captureClicks: true,
+  captureSubmits: true,
+  captureChanges: true,
+  maskAllInputs: true,
+  maskAllText: false,
+  throttleMs: 100,
+  maxTextLength: 200,
+  captureElementMetadata: true,
+  captureAncestors: 5
 };
-var MemoryAdapter = class {
-  constructor() {
-    this.store = /* @__PURE__ */ new Map();
-  }
-  get(key) {
-    return this.store.get(key) ?? null;
-  }
-  set(key, value) {
-    this.store.set(key, value);
+var MAX_ANCESTORS = 10;
+var ALWAYS_BLOCK_SELECTORS = [
+  "[data-veo-ignore]",
+  ".veo-ignore",
+  // Inputs sensibles
+  'input[type="password"]',
+  'input[type="email"]',
+  'input[type="tel"]',
+  'input[type="hidden"]',
+  // Datos de tarjeta
+  '[autocomplete="cc-number"]',
+  '[autocomplete="cc-csc"]',
+  '[autocomplete="cc-exp"]',
+  '[autocomplete="cc-name"]',
+  // Otros campos sensibles típicos
+  '[name*="password" i]',
+  '[name*="ssn" i]',
+  '[name*="credit" i]',
+  '[name*="card" i]',
+  '[id*="password" i]',
+  '[id*="ssn" i]'
+];
+var SENSITIVE_ATTRIBUTES = ["value", "data-credit-card", "data-ssn", "data-password"];
+var PRIORITY_ATTRIBUTES = [
+  "id",
+  "name",
+  "type",
+  "role",
+  "href",
+  "data-action",
+  "data-veo-tag",
+  "data-testid",
+  "aria-label",
+  "aria-labelledby"
+];
+var HASHED_CLASS_PATTERNS = [
+  /^css-[a-z0-9]{4,}$/i,
+  // emotion, styled-components nuevas
+  /^_[a-z0-9]+_[a-z0-9]{4,}_\d+$/,
+  // CSS Modules con hash
+  /^[a-z]{2,4}-[a-z0-9]{6,}$/i,
+  // Tailwind JIT (a veces)
+  /^[a-f0-9]{6,}$/i,
+  // hashes hex puros
+  /^sc-[a-z0-9]+$/i
+  // styled-components legacy
+];
+
+// src/plugins/autocapture/pii-guard.ts
+function isElementBlocked(element, extraBlockSelectors = []) {
+  const allBlockers = [...ALWAYS_BLOCK_SELECTORS, ...extraBlockSelectors];
+  let current = element;
+  while (current && current !== document.documentElement) {
+    for (const selector of allBlockers) {
+      try {
+        if (current.matches(selector)) return true;
+      } catch {
+      }
+    }
+    current = current.parentElement;
   }
-  remove(key) {
-    this.store.delete(key);
+  return false;
+}
+function isSensitiveAttribute(attrName) {
+  const lower = attrName.toLowerCase();
+  return SENSITIVE_ATTRIBUTES.includes(lower) || /password|secret|token|ssn|credit/i.test(attrName);
+}
+function safeGetText(element, maxLength, mask) {
+  if (mask) return "";
+  const tagName = element.tagName.toLowerCase();
+  if (tagName === "input" || tagName === "textarea") return "";
+  const raw = (element instanceof HTMLElement ? element.innerText : "") || element.textContent || "";
+  const trimmed = raw.trim().replace(/\s+/g, " ");
+  return trimmed.length > maxLength ? `${trimmed.slice(0, maxLength)}\u2026` : trimmed;
+}
+
+// src/plugins/autocapture/selector-builder.ts
+function isHashedClass(className) {
+  return HASHED_CLASS_PATTERNS.some((pattern) => pattern.test(className));
+}
+function filterHumanClasses(element) {
+  return Array.from(element.classList).filter((c) => !isHashedClass(c) && c.length < 64);
+}
+var STABLE_ATTRIBUTES = [
+  "data-testid",
+  "data-test",
+  "data-cy",
+  "name",
+  "aria-label",
+  "placeholder",
+  "alt",
+  "title",
+  // `href` identifica muy bien a los links (`<a>`), un target frecuente de
+  // autocapture; va después de los atributos semánticos pero antes de los
+  // genéricos. Valores largos (URLs absolutas con query) se descartan por
+  // MAX_ATTR_VALUE_LENGTH.
+  "href",
+  "role",
+  "type"
+];
+var MAX_ATTR_VALUE_LENGTH = 100;
+function cssEscape(value) {
+  if (typeof CSS !== "undefined" && typeof CSS.escape === "function") {
+    return CSS.escape(value);
   }
-  clear() {
-    this.store.clear();
+  return value.replace(/[!"#$%&'()*+,./:;<=>?@[\\\]^`{|}~]/g, "\\$&");
+}
+function escapeAttrValue(value) {
+  return value.replace(/[\\"]/g, "\\$&");
+}
+function stableAttributeSelector(element, tag) {
+  for (const attr of STABLE_ATTRIBUTES) {
+    const value = element.getAttribute(attr);
+    if (value && value.length > 0 && value.length <= MAX_ATTR_VALUE_LENGTH) {
+      return `${tag}[${attr}="${escapeAttrValue(value)}"]`;
+    }
   }
-};
-function createStorage(preferred = "localStorage") {
-  if (preferred === "localStorage" && hasLocalStorage()) return new LocalStorageAdapter();
-  if (preferred === "cookie" && hasDocument()) return new CookieAdapter();
-  if (preferred === "memory") return new MemoryAdapter();
-  if (hasLocalStorage()) return new LocalStorageAdapter();
-  if (hasDocument()) return new CookieAdapter();
-  return new MemoryAdapter();
+  return null;
+}
+function buildElementSelector(element) {
+  const tag = element.tagName.toLowerCase();
+  const veoTag = element.getAttribute("data-veo-tag");
+  if (veoTag) {
+    return `${tag}[data-veo-tag="${escapeAttrValue(veoTag)}"]`;
+  }
+  if (element.id) {
+    const classes2 = filterHumanClasses(element);
+    const classPart2 = classes2.length > 0 ? `.${classes2.map(cssEscape).join(".")}` : "";
+    return `${tag}#${cssEscape(element.id)}${classPart2}`;
+  }
+  const attrSelector = stableAttributeSelector(element, tag);
+  if (attrSelector) return attrSelector;
+  const classes = filterHumanClasses(element);
+  const classPart = classes.length > 0 ? `.${classes.map(cssEscape).join(".")}` : "";
+  return `${tag}${classPart}`;
+}
+function buildSelectorPath(element, maxAncestors = 5) {
+  const parts = [];
+  let current = element;
+  let depth = 0;
+  while (current && current !== document.documentElement && depth <= maxAncestors) {
+    parts.unshift(buildElementSelector(current));
+    current = current.parentElement;
+    depth++;
+  }
+  return parts.join(" > ");
 }
 
-// src/core/transport.ts
-var TransportError = class extends Error {
-  constructor(message, statusCode) {
-    super(message);
-    this.statusCode = statusCode;
-    this.name = "TransportError";
+// src/plugins/autocapture/element-serializer.ts
+function extractPriorityAttributes(element) {
+  const result = {};
+  for (const attrName of PRIORITY_ATTRIBUTES) {
+    const value = element.getAttribute(attrName);
+    if (value !== null && !isSensitiveAttribute(attrName) && value.length < 256) {
+      result[attrName] = value;
+    }
+  }
+  return result;
+}
+function serializeElement(element, config) {
+  const rect = element.getBoundingClientRect();
+  return {
+    tag: element.tagName.toLowerCase(),
+    id: element.id || null,
+    classes: filterHumanClasses(element),
+    text: safeGetText(element, config.maxTextLength, config.maskAllText),
+    attributes: config.captureElementMetadata ? extractPriorityAttributes(element) : {},
+    position: {
+      x: Math.round(rect.left + window.scrollX),
+      y: Math.round(rect.top + window.scrollY),
+      w: Math.round(rect.width),
+      h: Math.round(rect.height)
+    }
+  };
+}
+function serializeAncestors(element, maxDepth) {
+  const ancestors = [];
+  let current = element.parentElement;
+  let depth = 0;
+  while (current && current !== document.documentElement && depth < maxDepth) {
+    ancestors.push({
+      tag: current.tagName.toLowerCase(),
+      id: current.id || null,
+      classes: filterHumanClasses(current),
+      veoTag: current.getAttribute("data-veo-tag") || null
+    });
+    current = current.parentElement;
+    depth++;
+  }
+  return ancestors;
+}
+function buildAutocapturePayload(eventType, element, config) {
+  return {
+    $event_type: eventType,
+    $element: serializeElement(element, config),
+    $ancestors: serializeAncestors(element, config.captureAncestors),
+    $selector_path: buildSelectorPath(element, config.captureAncestors),
+    $page_url: window.location.href,
+    $page_path: window.location.pathname
+  };
+}
+
+// src/plugins/autocapture/throttle.ts
+var ElementThrottle = class {
+  constructor(windowMs) {
+    this.windowMs = windowMs;
+    this.lastFired = /* @__PURE__ */ new WeakMap();
+  }
+  /** Devuelve true si el elemento puede emitir ahora (y registra el disparo). */
+  shouldFire(element) {
+    const now = Date.now();
+    const last = this.lastFired.get(element) ?? 0;
+    if (now - last < this.windowMs) return false;
+    this.lastFired.set(element, now);
+    return true;
   }
 };
-var Transport = class {
-  constructor(config) {
-    this.config = config;
+
+// src/plugins/autocapture/dom-listener.ts
+var DomListener = class {
+  constructor(client, config) {
+    this.client = client;
+    this.cleanups = [];
+    const d = DEFAULT_AUTOCAPTURE_CONFIG;
+    this.config = {
+      enabled: config.enabled ?? d.enabled,
+      captureClicks: config.captureClicks ?? d.captureClicks,
+      captureSubmits: config.captureSubmits ?? d.captureSubmits,
+      captureChanges: config.captureChanges ?? d.captureChanges,
+      maskAllInputs: config.maskAllInputs ?? d.maskAllInputs,
+      maskAllText: config.maskAllText ?? d.maskAllText,
+      blockSelectors: config.blockSelectors ?? [],
+      throttleMs: config.throttleMs ?? d.throttleMs,
+      maxTextLength: config.maxTextLength ?? d.maxTextLength,
+      captureElementMetadata: config.captureElementMetadata ?? d.captureElementMetadata,
+      captureAncestors: Math.min(config.captureAncestors ?? d.captureAncestors, MAX_ANCESTORS)
+    };
+    this.throttle = new ElementThrottle(this.config.throttleMs);
   }
-  /** Envío normal con `fetch`. Lanza `TransportError` si la respuesta no es OK. */
-  async send(path, body) {
-    const url = `${this.config.apiUrl}${path}`;
-    const controller = new AbortController();
-    const timeoutId = setTimeout(() => controller.abort(), this.config.timeoutMs ?? 1e4);
-    try {
-      const response = await fetch(url, {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json",
-          "X-Api-Key": this.config.apiKey,
-          "X-Sdk-Version": this.config.sdkVersion
-        },
-        body: JSON.stringify(body),
-        keepalive: true,
-        signal: controller.signal
-      });
-      if (!response.ok) {
-        throw new TransportError(`HTTP ${response.status}`, response.status);
+  install() {
+    if (!hasDocument() || !this.config.enabled) return;
+    if (this.config.captureClicks) this.attach("click", (e) => this.handleClick(e));
+    if (this.config.captureSubmits) this.attach("submit", (e) => this.handleSubmit(e), true);
+    if (this.config.captureChanges) this.attach("change", (e) => this.handleChange(e), true);
+  }
+  destroy() {
+    for (const cleanup of this.cleanups) cleanup();
+    this.cleanups = [];
+  }
+  attach(eventName, handler, useCapture = false) {
+    const listener = (e) => {
+      if (!e.isTrusted) return;
+      try {
+        handler(e);
+      } catch {
       }
-      return await response.json();
-    } finally {
-      clearTimeout(timeoutId);
+    };
+    document.addEventListener(eventName, listener, useCapture);
+    this.cleanups.push(() => document.removeEventListener(eventName, listener, useCapture));
+  }
+  handleClick(event) {
+    const target = event.target;
+    if (!(target instanceof Element)) return;
+    const meaningful = this.findMeaningfulAncestor(target);
+    if (!meaningful) return;
+    if (isElementBlocked(meaningful, this.config.blockSelectors)) return;
+    if (!this.throttle.shouldFire(meaningful)) return;
+    this.emit("click", meaningful);
+  }
+  handleSubmit(event) {
+    const target = event.target;
+    if (!(target instanceof Element) || target.tagName.toLowerCase() !== "form") return;
+    if (isElementBlocked(target, this.config.blockSelectors)) return;
+    if (!this.throttle.shouldFire(target)) return;
+    this.emit("submit", target);
+  }
+  handleChange(event) {
+    const target = event.target;
+    if (!(target instanceof Element)) return;
+    const tag = target.tagName.toLowerCase();
+    if (tag !== "select" && tag !== "input" && tag !== "textarea") return;
+    if (target instanceof HTMLInputElement && target.type !== "checkbox" && target.type !== "radio") {
+      return;
+    }
+    if (isElementBlocked(target, this.config.blockSelectors)) return;
+    if (!this.throttle.shouldFire(target)) return;
+    this.emit("change", target);
+  }
+  /** Busca hacia arriba un ancestro "interactivo". Devuelve null si no hay ninguno. */
+  findMeaningfulAncestor(element) {
+    let current = element;
+    let depth = 0;
+    while (current && current !== document.documentElement && depth < 5) {
+      const tag = current.tagName.toLowerCase();
+      const isInteractive = tag === "button" || tag === "a" || tag === "input" || tag === "select" || tag === "textarea" || current.hasAttribute("data-veo-tag") || current.hasAttribute("role") || current.hasAttribute("onclick") || current instanceof HTMLElement && current.style.cursor === "pointer";
+      if (isInteractive) return current;
+      current = current.parentElement;
+      depth++;
+    }
+    return null;
+  }
+  emit(eventType, element) {
+    const payload = buildAutocapturePayload(eventType, element, this.config);
+    this.client.track("$autocapture", payload);
+  }
+};
+
+// src/plugins/autocapture/index.ts
+function autocapturePlugin(config = {}) {
+  let listener = null;
+  return definePlugin({
+    name: "autocapture",
+    install(client) {
+      listener = new DomListener(client, config);
+      listener.install();
+    },
+    destroy() {
+      listener?.destroy();
+      listener = null;
+    }
+  });
+}
+
+// src/plugins/spa-router.ts
+function spaRouterPlugin() {
+  return definePlugin({
+    name: "spa-router",
+    install(client) {
+      if (!hasWindow()) return;
+      client.pageview();
+      const fire = () => {
+        queueMicrotask(() => client.pageview());
+      };
+      const origPushState = window.history.pushState;
+      const origReplaceState = window.history.replaceState;
+      window.history.pushState = function(...args) {
+        origPushState.apply(this, args);
+        fire();
+      };
+      window.history.replaceState = function(...args) {
+        origReplaceState.apply(this, args);
+        fire();
+      };
+      window.addEventListener("popstate", fire);
+      window.addEventListener("hashchange", fire);
+    }
+  });
+}
+
+// src/contract/v1.ts
+var SDK_VERSION = "0.0.1";
+var DEFAULT_FLUSH_INTERVAL_MS = 5e3;
+var DEFAULT_FLUSH_BATCH_SIZE = 20;
+
+// src/utils/uuid.ts
+function uuidv7() {
+  const timestamp = Date.now();
+  const timeHex = timestamp.toString(16).padStart(12, "0");
+  const random = new Uint8Array(10);
+  if (typeof crypto !== "undefined" && typeof crypto.getRandomValues === "function") {
+    crypto.getRandomValues(random);
+  } else {
+    for (let i = 0; i < random.length; i++) {
+      random[i] = Math.floor(Math.random() * 256);
     }
   }
-  /**
-   * Envío con `navigator.sendBeacon`. Fire-and-forget, pensado para `pagehide`.
-   * Como sendBeacon no admite headers, la API key viaja por query string.
-   */
-  sendBeacon(path, body) {
-    if (!hasNavigatorSendBeacon()) return false;
-    const url = new URL(`${this.config.apiUrl}${path}`);
-    url.searchParams.set("key", this.config.apiKey);
-    url.searchParams.set("v", this.config.sdkVersion);
-    const blob = new Blob([JSON.stringify(body)], { type: "application/json" });
-    return navigator.sendBeacon(url.toString(), blob);
-  }
-};
-
-// src/core/client.ts
-var ORGANIZATION_ID_KEY = "organization_id";
-var END_USER_ID_KEY2 = "end_user_id";
-var IDENTIFY_SIG_KEY = "identify_signature";
-function stableStringify(value) {
-  if (value === null || typeof value !== "object") return JSON.stringify(value) ?? "null";
-  if (Array.isArray(value)) return `[${value.map(stableStringify).join(",")}]`;
-  const entries = Object.keys(value).sort().map((k) => `${JSON.stringify(k)}:${stableStringify(value[k])}`);
-  return `{${entries.join(",")}}`;
+  random[0] = (random[0] ?? 0) & 15 | 112;
+  random[2] = (random[2] ?? 0) & 63 | 128;
+  const hex = Array.from(random, (b) => b.toString(16).padStart(2, "0")).join("");
+  return [
+    timeHex.slice(0, 8),
+    timeHex.slice(8, 12),
+    hex.slice(0, 4),
+    hex.slice(4, 8),
+    hex.slice(8, 20)
+  ].join("-");
 }
-var Client = class {
+
+// src/core/queue.ts
+var RETRY_MAX_DELAY_MS = 3e4;
+var Queue = class {
   constructor(config) {
     this.config = config;
-    this.plugins = [];
-    this.currentOrganizationId = null;
-    this.listeners = {
-      pageview: /* @__PURE__ */ new Set(),
-      identify: /* @__PURE__ */ new Set()
-    };
-    if (!config.apiKey) throw new Error("apiKey is required");
-    if (!config.apiUrl) throw new Error("apiUrl is required");
-    this.storage = createStorage(config.storage ?? "localStorage");
-    this.session = new Session(this.storage);
-    this.transport = new Transport({
-      apiKey: config.apiKey,
-      apiUrl: config.apiUrl.replace(/\/$/, ""),
-      sdkVersion: SDK_VERSION
-    });
-    this.queue = new Queue({
-      transport: this.transport,
-      flushIntervalMs: config.flushInterval ?? DEFAULT_FLUSH_INTERVAL_MS,
-      batchSize: config.flushBatchSize ?? DEFAULT_FLUSH_BATCH_SIZE,
-      onError: (err) => {
-        if (config.debug) console.error("[veo] flush error:", err);
-      }
-    });
-    const persistedUserId = this.storage.get(END_USER_ID_KEY2);
-    if (persistedUserId) this.session.setEndUserId(persistedUserId);
-    const persistedOrgId = this.storage.get(ORGANIZATION_ID_KEY);
-    if (persistedOrgId) this.currentOrganizationId = persistedOrgId;
-    this.setupUnloadHandlers();
-    if (config.debug) {
-      console.log("[veo] initialized", {
-        anonymousId: this.session.anonymousId,
-        sessionId: this.session.sessionId,
-        endUserId: this.session.endUserId
-      });
+    this.buffer = [];
+    this.timer = null;
+    this.flushing = false;
+    this.retryCount = 0;
+    this.retryTimer = null;
+    this.startTimer();
+  }
+  /** Encola un evento; dispara flush si se alcanza `batchSize`. */
+  add(item) {
+    this.buffer.push(item);
+    if (this.buffer.length >= this.config.batchSize) {
+      void this.flush();
     }
   }
-  identify(payload) {
-    const { visitor, organization } = payload;
-    const signature = stableStringify({
-      id: visitor.id,
-      traits: visitor.traits ?? {},
-      org: organization ? { id: organization.id, attributes: organization.attributes ?? {} } : null
-    });
-    if (this.session.endUserId === visitor.id && this.storage.get(IDENTIFY_SIG_KEY) === signature) {
-      if (this.config.debug) console.debug("[veo] identify: sin cambios, omitido");
-      return;
+  /** Flush manual vía `fetch`. Resuelve cuando termina (los retries son diferidos). */
+  async flush() {
+    if (this.flushing || this.buffer.length === 0) return;
+    this.flushing = true;
+    const batch = this.buffer.splice(0, this.buffer.length);
+    try {
+      await this.config.transport.send("/v1/events", { events: batch });
+      this.retryCount = 0;
+    } catch (error) {
+      this.buffer.unshift(...batch);
+      this.scheduleRetry();
+      this.config.onError?.(error);
+    } finally {
+      this.flushing = false;
     }
-    const previousAnonymousId = this.session.endUserId === null ? this.session.anonymousId : void 0;
-    this.session.setEndUserId(visitor.id);
-    if (organization) {
-      this.currentOrganizationId = organization.id;
-      this.storage.set(ORGANIZATION_ID_KEY, organization.id);
+  }
+  /** Flush síncrono vía `sendBeacon`, para `pagehide`/`visibilitychange`. */
+  flushBeacon() {
+    if (this.buffer.length === 0) return;
+    const batch = this.buffer.splice(0, this.buffer.length);
+    const success = this.config.transport.sendBeacon("/v1/events", { events: batch });
+    if (!success) {
+      this.buffer.unshift(...batch);
     }
-    const endUser = {
-      id: visitor.id,
-      traits: visitor.traits ?? {},
-      ...previousAnonymousId !== void 0 ? { anonymousId: previousAnonymousId } : {}
-    };
-    const body = {
-      endUser,
-      ...organization ? { organization: { id: organization.id, attributes: organization.attributes ?? {} } } : {}
-    };
-    void this.transport.send("/v1/identify", body).catch((err) => {
-      if (this.config.debug) console.error("[veo] identify failed:", err);
-    });
-    this.enqueue({
-      actionType: "identify",
-      actionProperties: {
-        traits: visitor.traits,
-        organizationAttributes: organization?.attributes
-      }
-    });
-    this.storage.set(IDENTIFY_SIG_KEY, signature);
-    this.emit("identify", { endUserId: visitor.id, sessionId: this.session.sessionId });
   }
-  track(name, properties) {
-    if (!name || typeof name !== "string") {
-      if (this.config.debug) console.error("[veo] track: name is required");
+  /** Detiene timers internos. Llamar al destruir el cliente. */
+  destroy() {
+    if (this.timer) clearInterval(this.timer);
+    if (this.retryTimer) clearTimeout(this.retryTimer);
+    this.timer = null;
+    this.retryTimer = null;
+  }
+  startTimer() {
+    this.timer = setInterval(() => {
+      void this.flush();
+    }, this.config.flushIntervalMs);
+  }
+  scheduleRetry() {
+    const maxRetries = this.config.maxRetries ?? 3;
+    if (this.retryCount >= maxRetries) {
+      this.retryCount = 0;
       return;
     }
-    this.enqueue({
-      actionType: "track",
-      actionName: name,
-      ...properties !== void 0 ? { actionProperties: properties } : {}
-    });
+    this.retryCount++;
+    const delayMs = Math.min(1e3 * 2 ** (this.retryCount - 1), RETRY_MAX_DELAY_MS);
+    if (this.retryTimer) clearTimeout(this.retryTimer);
+    this.retryTimer = setTimeout(() => {
+      void this.flush();
+    }, delayMs);
   }
-  pageview(path) {
-    if (!hasDocument()) return;
-    const url = window.location.href;
-    const pagePath = path ?? window.location.pathname;
-    this.enqueue({
-      actionType: "pageview",
-      pageUrl: url,
-      pagePath,
-      pageTitle: document.title,
-      pageReferrer: document.referrer
-    });
-    this.emit("pageview", {
-      url,
-      path: pagePath,
-      sessionId: this.session.sessionId,
-      endUserId: this.session.endUserId
-    });
+};
+
+// src/core/session.ts
+var ANONYMOUS_ID_KEY = "anonymous_user_id";
+var END_USER_ID_KEY = "end_user_id";
+var SESSION_ID_KEY = "session_id";
+var SESSION_LAST_ACTIVE_KEY = "session_last_active";
+var SESSION_TIMEOUT_MS = 30 * 60 * 1e3;
+var Session = class {
+  constructor(storage) {
+    this.storage = storage;
+    this._endUserId = null;
+    this._anonymousId = this.loadOrCreateAnonymousId();
+    this._sessionId = this.loadOrCreateSession();
+    this._endUserId = this.storage.get(END_USER_ID_KEY);
   }
-  reset() {
-    this.session.reset();
-    this.currentOrganizationId = null;
-    this.storage.remove(ORGANIZATION_ID_KEY);
-    this.storage.remove(END_USER_ID_KEY2);
-    this.storage.remove(IDENTIFY_SIG_KEY);
+  get anonymousId() {
+    return this._anonymousId;
   }
-  flush() {
-    return this.queue.flush();
+  get sessionId() {
+    return this._sessionId;
   }
-  use(plugin) {
-    this.plugins.push(plugin);
-    plugin.install(this);
-    return this;
+  get endUserId() {
+    return this._endUserId;
   }
-  getEndUserId() {
-    return this.session.endUserId;
+  /** ID a usar como visitor en eventos (end_user_id si está identificado, si no anonymous). */
+  get effectiveUserId() {
+    return this._endUserId ?? this._anonymousId;
+  }
+  setEndUserId(id) {
+    this._endUserId = id;
+    this.storage.set(END_USER_ID_KEY, id);
+  }
+  /** Renueva el timestamp de actividad. Si pasaron > 30 min, genera nueva sesión. */
+  touch() {
+    const lastActive = this.storage.get(SESSION_LAST_ACTIVE_KEY);
+    const now = Date.now();
+    if (lastActive && now - Number.parseInt(lastActive, 10) > SESSION_TIMEOUT_MS) {
+      this._sessionId = uuidv7();
+      this.storage.set(SESSION_ID_KEY, this._sessionId);
+    }
+    this.storage.set(SESSION_LAST_ACTIVE_KEY, String(now));
   }
-  getSessionId() {
-    return this.session.sessionId;
+  /** Limpia la identidad (reset) pero conserva el anonymous_id. */
+  reset() {
+    this._endUserId = null;
+    this.storage.remove(END_USER_ID_KEY);
+    this._sessionId = uuidv7();
+    this.storage.set(SESSION_ID_KEY, this._sessionId);
+    this.storage.set(SESSION_LAST_ACTIVE_KEY, String(Date.now()));
   }
-  /**
-   * Suscribe `listener` a `event`. Devuelve una función para desuscribir.
-   * Los errores en listeners se logean en debug mode pero NO se propagan
-   * (un plugin no debe poder romper a otro).
-   */
-  on(event, listener) {
-    this.listeners[event].add(listener);
-    return () => {
-      this.listeners[event].delete(listener);
-    };
+  loadOrCreateAnonymousId() {
+    let id = this.storage.get(ANONYMOUS_ID_KEY);
+    if (!id) {
+      id = uuidv7();
+      this.storage.set(ANONYMOUS_ID_KEY, id);
+    }
+    return id;
   }
-  emit(event, payload) {
-    for (const listener of this.listeners[event]) {
-      try {
-        listener(payload);
-      } catch (err) {
-        if (this.config.debug) console.error(`[veo] listener for '${event}' failed:`, err);
+  loadOrCreateSession() {
+    const existing = this.storage.get(SESSION_ID_KEY);
+    const lastActive = this.storage.get(SESSION_LAST_ACTIVE_KEY);
+    if (existing && lastActive) {
+      const elapsed = Date.now() - Number.parseInt(lastActive, 10);
+      if (elapsed < SESSION_TIMEOUT_MS) {
+        return existing;
       }
     }
+    const newId = uuidv7();
+    this.storage.set(SESSION_ID_KEY, newId);
+    this.storage.set(SESSION_LAST_ACTIVE_KEY, String(Date.now()));
+    return newId;
   }
-  /**
-   * Construye el evento completo y lo agrega a la queue. Omite los campos
-   * opcionales no definidos (exigido por `exactOptionalPropertyTypes`).
-   * @internal
-   */
-  enqueue(input) {
-    this.session.touch();
-    const organizationId = this.currentOrganizationId ?? void 0;
-    const pageUrl = input.pageUrl ?? (hasWindow() ? window.location.href : void 0);
-    const pagePath = input.pagePath ?? (hasWindow() ? window.location.pathname : void 0);
-    const pageTitle = input.pageTitle ?? (hasDocument() ? document.title : void 0);
-    const pageReferrer = input.pageReferrer ?? (hasDocument() ? document.referrer : void 0);
-    const event = {
-      actionId: uuidv7(),
-      endUserId: this.session.effectiveUserId,
-      sessionId: this.session.sessionId,
-      actionType: input.actionType,
-      occurredAt: (/* @__PURE__ */ new Date()).toISOString(),
-      ...organizationId !== void 0 ? { organizationId } : {},
-      ...input.actionName !== void 0 ? { actionName: input.actionName } : {},
-      ...pageUrl !== void 0 ? { pageUrl } : {},
-      ...pagePath !== void 0 ? { pagePath } : {},
-      ...pageTitle !== void 0 ? { pageTitle } : {},
-      ...pageReferrer !== void 0 ? { pageReferrer } : {},
-      ...input.actionProperties !== void 0 ? { actionProperties: input.actionProperties } : {}
-    };
-    this.queue.add(event);
+};
+
+// src/core/storage.ts
+var STORAGE_PREFIX = "veo:";
+var ONE_YEAR_MS = 365 * 24 * 60 * 60 * 1e3;
+var LocalStorageAdapter = class {
+  get(key) {
+    return localStorage.getItem(STORAGE_PREFIX + key);
   }
-  setupUnloadHandlers() {
-    if (!hasWindow()) return;
-    window.addEventListener("pagehide", () => this.queue.flushBeacon());
-    window.addEventListener("visibilitychange", () => {
-      if (document.visibilityState === "hidden") {
-        this.queue.flushBeacon();
-      }
-    });
+  set(key, value) {
+    try {
+      localStorage.setItem(STORAGE_PREFIX + key, value);
+    } catch {
+    }
+  }
+  remove(key) {
+    localStorage.removeItem(STORAGE_PREFIX + 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);
+    }
+    for (const key of toRemove) localStorage.removeItem(key);
   }
 };
-
-// src/plugins/plugin.ts
-function definePlugin(plugin) {
-  return plugin;
+function readCookies() {
+  const raw = document.cookie;
+  return raw === "" ? [] : raw.split("; ");
 }
-
-// src/plugins/autocapture/constants.ts
-var DEFAULT_AUTOCAPTURE_CONFIG = {
-  enabled: true,
-  captureClicks: true,
-  captureSubmits: true,
-  captureChanges: true,
-  maskAllInputs: true,
-  maskAllText: false,
-  throttleMs: 100,
-  maxTextLength: 200,
-  captureElementMetadata: true,
-  captureAncestors: 5
-};
-var MAX_ANCESTORS = 10;
-var ALWAYS_BLOCK_SELECTORS = [
-  "[data-veo-ignore]",
-  ".veo-ignore",
-  // Inputs sensibles
-  'input[type="password"]',
-  'input[type="email"]',
-  'input[type="tel"]',
-  'input[type="hidden"]',
-  // Datos de tarjeta
-  '[autocomplete="cc-number"]',
-  '[autocomplete="cc-csc"]',
-  '[autocomplete="cc-exp"]',
-  '[autocomplete="cc-name"]',
-  // Otros campos sensibles típicos
-  '[name*="password" i]',
-  '[name*="ssn" i]',
-  '[name*="credit" i]',
-  '[name*="card" i]',
-  '[id*="password" i]',
-  '[id*="ssn" i]'
-];
-var SENSITIVE_ATTRIBUTES = ["value", "data-credit-card", "data-ssn", "data-password"];
-var PRIORITY_ATTRIBUTES = [
-  "id",
-  "name",
-  "type",
-  "role",
-  "href",
-  "data-action",
-  "data-veo-tag",
-  "data-testid",
-  "aria-label",
-  "aria-labelledby"
-];
-var HASHED_CLASS_PATTERNS = [
-  /^css-[a-z0-9]{4,}$/i,
-  // emotion, styled-components nuevas
-  /^_[a-z0-9]+_[a-z0-9]{4,}_\d+$/,
-  // CSS Modules con hash
-  /^[a-z]{2,4}-[a-z0-9]{6,}$/i,
-  // Tailwind JIT (a veces)
-  /^[a-f0-9]{6,}$/i,
-  // hashes hex puros
-  /^sc-[a-z0-9]+$/i
-  // styled-components legacy
-];
-
-// src/plugins/autocapture/pii-guard.ts
-function isElementBlocked(element, extraBlockSelectors = []) {
-  const allBlockers = [...ALWAYS_BLOCK_SELECTORS, ...extraBlockSelectors];
-  let current = element;
-  while (current && current !== document.documentElement) {
-    for (const selector of allBlockers) {
-      try {
-        if (current.matches(selector)) return true;
-      } catch {
+var CookieAdapter = class {
+  get(key) {
+    const name = `${STORAGE_PREFIX}${key}=`;
+    for (const cookie of readCookies()) {
+      if (cookie.startsWith(name)) {
+        return decodeURIComponent(cookie.slice(name.length));
       }
     }
-    current = current.parentElement;
+    return null;
   }
-  return false;
-}
-function isSensitiveAttribute(attrName) {
-  const lower = attrName.toLowerCase();
-  return SENSITIVE_ATTRIBUTES.includes(lower) || /password|secret|token|ssn|credit/i.test(attrName);
-}
-function safeGetText(element, maxLength, mask) {
-  if (mask) return "";
-  const tagName = element.tagName.toLowerCase();
-  if (tagName === "input" || tagName === "textarea") return "";
-  const raw = (element instanceof HTMLElement ? element.innerText : "") || element.textContent || "";
-  const trimmed = raw.trim().replace(/\s+/g, " ");
-  return trimmed.length > maxLength ? `${trimmed.slice(0, maxLength)}\u2026` : trimmed;
-}
-
-// src/plugins/autocapture/selector-builder.ts
-function isHashedClass(className) {
-  return HASHED_CLASS_PATTERNS.some((pattern) => pattern.test(className));
-}
-function filterHumanClasses(element) {
-  return Array.from(element.classList).filter((c) => !isHashedClass(c) && c.length < 64);
-}
-var STABLE_ATTRIBUTES = [
-  "data-testid",
-  "data-test",
-  "data-cy",
-  "name",
-  "aria-label",
-  "placeholder",
-  "alt",
-  "title",
-  // `href` identifica muy bien a los links (`<a>`), un target frecuente de
-  // autocapture; va después de los atributos semánticos pero antes de los
-  // genéricos. Valores largos (URLs absolutas con query) se descartan por
-  // MAX_ATTR_VALUE_LENGTH.
-  "href",
-  "role",
-  "type"
-];
-var MAX_ATTR_VALUE_LENGTH = 100;
-function cssEscape(value) {
-  if (typeof CSS !== "undefined" && typeof CSS.escape === "function") {
-    return CSS.escape(value);
+  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(
+      value
+    )}; Path=/; Max-Age=${maxAgeSec}; SameSite=Lax${secure}`;
   }
-  return value.replace(/[!"#$%&'()*+,./:;<=>?@[\\\]^`{|}~]/g, "\\$&");
-}
-function escapeAttrValue(value) {
-  return value.replace(/[\\"]/g, "\\$&");
-}
-function stableAttributeSelector(element, tag) {
-  for (const attr of STABLE_ATTRIBUTES) {
-    const value = element.getAttribute(attr);
-    if (value && value.length > 0 && value.length <= MAX_ATTR_VALUE_LENGTH) {
-      return `${tag}[${attr}="${escapeAttrValue(value)}"]`;
+  remove(key) {
+    document.cookie = `${STORAGE_PREFIX}${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));
+      }
     }
   }
-  return null;
-}
-function buildElementSelector(element) {
-  const tag = element.tagName.toLowerCase();
-  const veoTag = element.getAttribute("data-veo-tag");
-  if (veoTag) {
-    return `${tag}[data-veo-tag="${escapeAttrValue(veoTag)}"]`;
+};
+var MemoryAdapter = class {
+  constructor() {
+    this.store = /* @__PURE__ */ new Map();
   }
-  if (element.id) {
-    const classes2 = filterHumanClasses(element);
-    const classPart2 = classes2.length > 0 ? `.${classes2.map(cssEscape).join(".")}` : "";
-    return `${tag}#${cssEscape(element.id)}${classPart2}`;
+  get(key) {
+    return this.store.get(key) ?? null;
   }
-  const attrSelector = stableAttributeSelector(element, tag);
-  if (attrSelector) return attrSelector;
-  const classes = filterHumanClasses(element);
-  const classPart = classes.length > 0 ? `.${classes.map(cssEscape).join(".")}` : "";
-  return `${tag}${classPart}`;
-}
-function buildSelectorPath(element, maxAncestors = 5) {
-  const parts = [];
-  let current = element;
-  let depth = 0;
-  while (current && current !== document.documentElement && depth <= maxAncestors) {
-    parts.unshift(buildElementSelector(current));
-    current = current.parentElement;
-    depth++;
+  set(key, value) {
+    this.store.set(key, value);
   }
-  return parts.join(" > ");
+  remove(key) {
+    this.store.delete(key);
+  }
+  clear() {
+    this.store.clear();
+  }
+};
+function createStorage(preferred = "localStorage") {
+  if (preferred === "localStorage" && hasLocalStorage()) return new LocalStorageAdapter();
+  if (preferred === "cookie" && hasDocument()) return new CookieAdapter();
+  if (preferred === "memory") return new MemoryAdapter();
+  if (hasLocalStorage()) return new LocalStorageAdapter();
+  if (hasDocument()) return new CookieAdapter();
+  return new MemoryAdapter();
 }
 
-// src/plugins/autocapture/element-serializer.ts
-function extractPriorityAttributes(element) {
-  const result = {};
-  for (const attrName of PRIORITY_ATTRIBUTES) {
-    const value = element.getAttribute(attrName);
-    if (value !== null && !isSensitiveAttribute(attrName) && value.length < 256) {
-      result[attrName] = value;
+// src/core/transport.ts
+var TransportError = class extends Error {
+  constructor(message, statusCode) {
+    super(message);
+    this.statusCode = statusCode;
+    this.name = "TransportError";
+  }
+};
+var Transport = class {
+  constructor(config) {
+    this.config = config;
+  }
+  /** Envío normal con `fetch`. Lanza `TransportError` si la respuesta no es OK. */
+  async send(path, body) {
+    const url = `${this.config.apiUrl}${path}`;
+    const controller = new AbortController();
+    const timeoutMs = this.config.timeoutMs ?? 1e4;
+    const timeoutId = setTimeout(
+      () => controller.abort(new DOMException(`Veo request timeout (${timeoutMs}ms)`, "TimeoutError")),
+      timeoutMs
+    );
+    try {
+      const response = await fetch(url, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "X-Api-Key": this.config.apiKey,
+          "X-Sdk-Version": this.config.sdkVersion
+        },
+        body: JSON.stringify(body),
+        // NO usar `keepalive: true` en los flushes normales: tiene límites
+        // estrictos del navegador (cuota de requests/64KB) y produce abortos
+        // espurios cuando hay varios envíos seguidos. El envío fiable al cerrar
+        // la página ya lo cubre `sendBeacon()` (ver Queue.flushBeacon).
+        signal: controller.signal
+      });
+      if (!response.ok) {
+        throw new TransportError(`HTTP ${response.status}`, response.status);
+      }
+      return await response.json();
+    } finally {
+      clearTimeout(timeoutId);
     }
   }
-  return result;
+  /**
+   * Envío con `navigator.sendBeacon`. Fire-and-forget, pensado para `pagehide`.
+   * Como sendBeacon no admite headers, la API key viaja por query string.
+   */
+  sendBeacon(path, body) {
+    if (!hasNavigatorSendBeacon()) return false;
+    const url = new URL(`${this.config.apiUrl}${path}`);
+    url.searchParams.set("key", this.config.apiKey);
+    url.searchParams.set("v", this.config.sdkVersion);
+    const blob = new Blob([JSON.stringify(body)], { type: "application/json" });
+    return navigator.sendBeacon(url.toString(), blob);
+  }
+};
+
+// src/core/client.ts
+var ORGANIZATION_ID_KEY = "organization_id";
+var END_USER_ID_KEY2 = "end_user_id";
+var IDENTIFY_SIG_KEY = "identify_signature";
+function stableStringify(value) {
+  if (value === null || typeof value !== "object") return JSON.stringify(value) ?? "null";
+  if (Array.isArray(value)) return `[${value.map(stableStringify).join(",")}]`;
+  const entries = Object.keys(value).sort().map((k) => `${JSON.stringify(k)}:${stableStringify(value[k])}`);
+  return `{${entries.join(",")}}`;
 }
-function serializeElement(element, config) {
-  const rect = element.getBoundingClientRect();
-  return {
-    tag: element.tagName.toLowerCase(),
-    id: element.id || null,
-    classes: filterHumanClasses(element),
-    text: safeGetText(element, config.maxTextLength, config.maskAllText),
-    attributes: config.captureElementMetadata ? extractPriorityAttributes(element) : {},
-    position: {
-      x: Math.round(rect.left + window.scrollX),
-      y: Math.round(rect.top + window.scrollY),
-      w: Math.round(rect.width),
-      h: Math.round(rect.height)
+var Client = class {
+  constructor(config) {
+    this.config = config;
+    this.plugins = [];
+    this.currentOrganizationId = null;
+    this.listeners = {
+      pageview: /* @__PURE__ */ new Set(),
+      identify: /* @__PURE__ */ new Set()
+    };
+    if (!config.apiKey) throw new Error("apiKey is required");
+    if (!config.apiUrl) throw new Error("apiUrl is required");
+    this.storage = createStorage(config.storage ?? "localStorage");
+    this.session = new Session(this.storage);
+    this.transport = new Transport({
+      apiKey: config.apiKey,
+      apiUrl: config.apiUrl.replace(/\/$/, ""),
+      sdkVersion: SDK_VERSION
+    });
+    this.queue = new Queue({
+      transport: this.transport,
+      flushIntervalMs: config.flushInterval ?? DEFAULT_FLUSH_INTERVAL_MS,
+      batchSize: config.flushBatchSize ?? DEFAULT_FLUSH_BATCH_SIZE,
+      onError: (err) => {
+        if (config.debug) console.error("[veo] flush error:", err);
+      }
+    });
+    const persistedUserId = this.storage.get(END_USER_ID_KEY2);
+    if (persistedUserId) this.session.setEndUserId(persistedUserId);
+    const persistedOrgId = this.storage.get(ORGANIZATION_ID_KEY);
+    if (persistedOrgId) this.currentOrganizationId = persistedOrgId;
+    this.setupUnloadHandlers();
+    if (config.debug) {
+      console.log("[veo] initialized", {
+        anonymousId: this.session.anonymousId,
+        sessionId: this.session.sessionId,
+        endUserId: this.session.endUserId
+      });
     }
-  };
-}
-function serializeAncestors(element, maxDepth) {
-  const ancestors = [];
-  let current = element.parentElement;
-  let depth = 0;
-  while (current && current !== document.documentElement && depth < maxDepth) {
-    ancestors.push({
-      tag: current.tagName.toLowerCase(),
-      id: current.id || null,
-      classes: filterHumanClasses(current),
-      veoTag: current.getAttribute("data-veo-tag") || null
+  }
+  identify(payload) {
+    const { visitor, organization } = payload;
+    const signature = stableStringify({
+      id: visitor.id,
+      traits: visitor.traits ?? {},
+      org: organization ? { id: organization.id, attributes: organization.attributes ?? {} } : null
     });
-    current = current.parentElement;
-    depth++;
+    if (this.session.endUserId === visitor.id && this.storage.get(IDENTIFY_SIG_KEY) === signature) {
+      if (this.config.debug) console.debug("[veo] identify: sin cambios, omitido");
+      return;
+    }
+    const previousAnonymousId = this.session.endUserId === null ? this.session.anonymousId : void 0;
+    this.session.setEndUserId(visitor.id);
+    if (organization) {
+      this.currentOrganizationId = organization.id;
+      this.storage.set(ORGANIZATION_ID_KEY, organization.id);
+    }
+    const endUser = {
+      id: visitor.id,
+      traits: visitor.traits ?? {},
+      ...previousAnonymousId !== void 0 ? { anonymousId: previousAnonymousId } : {}
+    };
+    const body = {
+      endUser,
+      ...organization ? { organization: { id: organization.id, attributes: organization.attributes ?? {} } } : {}
+    };
+    void this.transport.send("/v1/identify", body).catch((err) => {
+      if (this.config.debug) console.error("[veo] identify failed:", err);
+    });
+    this.enqueue({
+      actionType: "identify",
+      actionProperties: {
+        traits: visitor.traits,
+        organizationAttributes: organization?.attributes
+      }
+    });
+    this.storage.set(IDENTIFY_SIG_KEY, signature);
+    this.emit("identify", { endUserId: visitor.id, sessionId: this.session.sessionId });
   }
-  return ancestors;
-}
-function buildAutocapturePayload(eventType, element, config) {
-  return {
-    $event_type: eventType,
-    $element: serializeElement(element, config),
-    $ancestors: serializeAncestors(element, config.captureAncestors),
-    $selector_path: buildSelectorPath(element, config.captureAncestors),
-    $page_url: window.location.href,
-    $page_path: window.location.pathname
-  };
-}
-
-// src/plugins/autocapture/throttle.ts
-var ElementThrottle = class {
-  constructor(windowMs) {
-    this.windowMs = windowMs;
-    this.lastFired = /* @__PURE__ */ new WeakMap();
+  track(name, properties) {
+    if (!name || typeof name !== "string") {
+      if (this.config.debug) console.error("[veo] track: name is required");
+      return;
+    }
+    this.enqueue({
+      actionType: "track",
+      actionName: name,
+      ...properties !== void 0 ? { actionProperties: properties } : {}
+    });
+  }
+  pageview(path) {
+    if (!hasDocument()) return;
+    const url = window.location.href;
+    const pagePath = path ?? window.location.pathname;
+    this.enqueue({
+      actionType: "pageview",
+      pageUrl: url,
+      pagePath,
+      pageTitle: document.title,
+      pageReferrer: document.referrer
+    });
+    this.emit("pageview", {
+      url,
+      path: pagePath,
+      sessionId: this.session.sessionId,
+      endUserId: this.session.endUserId
+    });
   }
-  /** Devuelve true si el elemento puede emitir ahora (y registra el disparo). */
-  shouldFire(element) {
-    const now = Date.now();
-    const last = this.lastFired.get(element) ?? 0;
-    if (now - last < this.windowMs) return false;
-    this.lastFired.set(element, now);
-    return true;
+  reset() {
+    this.session.reset();
+    this.currentOrganizationId = null;
+    this.storage.remove(ORGANIZATION_ID_KEY);
+    this.storage.remove(END_USER_ID_KEY2);
+    this.storage.remove(IDENTIFY_SIG_KEY);
   }
-};
-
-// src/plugins/autocapture/dom-listener.ts
-var DomListener = class {
-  constructor(client, config) {
-    this.client = client;
-    this.cleanups = [];
-    const d = DEFAULT_AUTOCAPTURE_CONFIG;
-    this.config = {
-      enabled: config.enabled ?? d.enabled,
-      captureClicks: config.captureClicks ?? d.captureClicks,
-      captureSubmits: config.captureSubmits ?? d.captureSubmits,
-      captureChanges: config.captureChanges ?? d.captureChanges,
-      maskAllInputs: config.maskAllInputs ?? d.maskAllInputs,
-      maskAllText: config.maskAllText ?? d.maskAllText,
-      blockSelectors: config.blockSelectors ?? [],
-      throttleMs: config.throttleMs ?? d.throttleMs,
-      maxTextLength: config.maxTextLength ?? d.maxTextLength,
-      captureElementMetadata: config.captureElementMetadata ?? d.captureElementMetadata,
-      captureAncestors: Math.min(config.captureAncestors ?? d.captureAncestors, MAX_ANCESTORS)
-    };
-    this.throttle = new ElementThrottle(this.config.throttleMs);
+  flush() {
+    return this.queue.flush();
   }
-  install() {
-    if (!hasDocument() || !this.config.enabled) return;
-    if (this.config.captureClicks) this.attach("click", (e) => this.handleClick(e));
-    if (this.config.captureSubmits) this.attach("submit", (e) => this.handleSubmit(e), true);
-    if (this.config.captureChanges) this.attach("change", (e) => this.handleChange(e), true);
+  use(plugin) {
+    this.plugins.push(plugin);
+    plugin.install(this);
+    return this;
   }
-  destroy() {
-    for (const cleanup of this.cleanups) cleanup();
-    this.cleanups = [];
+  getEndUserId() {
+    return this.session.endUserId;
   }
-  attach(eventName, handler, useCapture = false) {
-    const listener = (e) => {
-      if (!e.isTrusted) return;
-      try {
-        handler(e);
-      } catch {
-      }
-    };
-    document.addEventListener(eventName, listener, useCapture);
-    this.cleanups.push(() => document.removeEventListener(eventName, listener, useCapture));
+  getAnonymousId() {
+    return this.session.anonymousId;
   }
-  handleClick(event) {
-    const target = event.target;
-    if (!(target instanceof Element)) return;
-    const meaningful = this.findMeaningfulAncestor(target);
-    if (!meaningful) return;
-    if (isElementBlocked(meaningful, this.config.blockSelectors)) return;
-    if (!this.throttle.shouldFire(meaningful)) return;
-    this.emit("click", meaningful);
+  getSessionId() {
+    return this.session.sessionId;
   }
-  handleSubmit(event) {
-    const target = event.target;
-    if (!(target instanceof Element) || target.tagName.toLowerCase() !== "form") return;
-    if (isElementBlocked(target, this.config.blockSelectors)) return;
-    if (!this.throttle.shouldFire(target)) return;
-    this.emit("submit", target);
+  /**
+   * Suscribe `listener` a `event`. Devuelve una función para desuscribir.
+   * Los errores en listeners se logean en debug mode pero NO se propagan
+   * (un plugin no debe poder romper a otro).
+   */
+  on(event, listener) {
+    this.listeners[event].add(listener);
+    return () => {
+      this.listeners[event].delete(listener);
+    };
   }
-  handleChange(event) {
-    const target = event.target;
-    if (!(target instanceof Element)) return;
-    const tag = target.tagName.toLowerCase();
-    if (tag !== "select" && tag !== "input" && tag !== "textarea") return;
-    if (target instanceof HTMLInputElement && target.type !== "checkbox" && target.type !== "radio") {
-      return;
+  emit(event, payload) {
+    for (const listener of this.listeners[event]) {
+      try {
+        listener(payload);
+      } catch (err) {
+        if (this.config.debug) console.error(`[veo] listener for '${event}' failed:`, err);
+      }
     }
-    if (isElementBlocked(target, this.config.blockSelectors)) return;
-    if (!this.throttle.shouldFire(target)) return;
-    this.emit("change", target);
   }
-  /** Busca hacia arriba un ancestro "interactivo". Devuelve null si no hay ninguno. */
-  findMeaningfulAncestor(element) {
-    let current = element;
-    let depth = 0;
-    while (current && current !== document.documentElement && depth < 5) {
-      const tag = current.tagName.toLowerCase();
-      const isInteractive = tag === "button" || tag === "a" || tag === "input" || tag === "select" || tag === "textarea" || current.hasAttribute("data-veo-tag") || current.hasAttribute("role") || current.hasAttribute("onclick") || current instanceof HTMLElement && current.style.cursor === "pointer";
-      if (isInteractive) return current;
-      current = current.parentElement;
-      depth++;
-    }
-    return null;
+  /**
+   * Construye el evento completo y lo agrega a la queue. Omite los campos
+   * opcionales no definidos (exigido por `exactOptionalPropertyTypes`).
+   * @internal
+   */
+  enqueue(input) {
+    this.session.touch();
+    const organizationId = this.currentOrganizationId ?? void 0;
+    const pageUrl = input.pageUrl ?? (hasWindow() ? window.location.href : void 0);
+    const pagePath = input.pagePath ?? (hasWindow() ? window.location.pathname : void 0);
+    const pageTitle = input.pageTitle ?? (hasDocument() ? document.title : void 0);
+    const pageReferrer = input.pageReferrer ?? (hasDocument() ? document.referrer : void 0);
+    const event = {
+      actionId: uuidv7(),
+      endUserId: this.session.effectiveUserId,
+      sessionId: this.session.sessionId,
+      actionType: input.actionType,
+      occurredAt: (/* @__PURE__ */ new Date()).toISOString(),
+      ...organizationId !== void 0 ? { organizationId } : {},
+      ...input.actionName !== void 0 ? { actionName: input.actionName } : {},
+      ...pageUrl !== void 0 ? { pageUrl } : {},
+      ...pagePath !== void 0 ? { pagePath } : {},
+      ...pageTitle !== void 0 ? { pageTitle } : {},
+      ...pageReferrer !== void 0 ? { pageReferrer } : {},
+      ...input.actionProperties !== void 0 ? { actionProperties: input.actionProperties } : {}
+    };
+    this.queue.add(event);
   }
-  emit(eventType, element) {
-    const payload = buildAutocapturePayload(eventType, element, this.config);
-    this.client.track("$autocapture", payload);
+  setupUnloadHandlers() {
+    if (!hasWindow()) return;
+    window.addEventListener("pagehide", () => this.queue.flushBeacon());
+    window.addEventListener("visibilitychange", () => {
+      if (document.visibilityState === "hidden") {
+        this.queue.flushBeacon();
+      }
+    });
   }
 };
 
-// src/plugins/autocapture/index.ts
-function autocapturePlugin(config = {}) {
-  let listener = null;
-  return definePlugin({
-    name: "autocapture",
-    install(client) {
-      listener = new DomListener(client, config);
-      listener.install();
-    },
-    destroy() {
-      listener?.destroy();
-      listener = null;
+// src/core/setup.ts
+function setupClient(config, onGuides) {
+  const client = new Client(config);
+  client.use(spaRouterPlugin());
+  if (config.autocapture !== false) {
+    const autocaptureConfig = typeof config.autocapture === "object" ? config.autocapture : {};
+    client.use(autocapturePlugin(autocaptureConfig));
+  }
+  onGuides(client);
+  if (typeof window !== "undefined") {
+    const stub = window.veo;
+    const pending = stub?._q ?? [];
+    window.veo = client;
+    for (const entry of pending) {
+      const [method, args] = entry;
+      if (method === "init") continue;
+      const fn = client[method];
+      if (typeof fn === "function") {
+        try {
+          fn.apply(client, Array.from(args));
+        } catch (err) {
+          if (config.debug) console.error("[veo] drain error:", err);
+        }
+      }
     }
-  });
+    maybeLoadBuilder({
+      ...config.builderUrl !== void 0 ? { builderUrl: config.builderUrl } : {},
+      ...config.debug !== void 0 ? { debug: config.debug } : {},
+      ...config.apiKey !== void 0 ? { apiKey: config.apiKey } : {},
+      ...config.apiUrl !== void 0 ? { apiUrl: config.apiUrl } : {}
+    });
+  }
+  return client;
 }
 
 // src/plugins/guides/constants.ts
@@ -905,15 +1040,20 @@ var GuideFrequencyCache = class {
    * Decide si una guía debe filtrarse localmente antes de pintarla.
    *
    *   - `every_visit` / `always` → nunca filtra (siempre re-pinta).
-   *   - `once` → cualquier entry registrada filtra.
-   *   - `until_dismissed` → solo si `status === 'dismissed'`.
+   *   - `once` → cualquier entry registrada filtra (verla ya cuenta).
+   *   - `until_dismissed` → si fue descartada O COMPLETADA (responder un
+   *     form / terminar un walkthrough es más fuerte que descartar — sin
+   *     esto, una encuesta seguiría preguntando después de respondida).
    */
   shouldFilter(guideId, displayFrequency) {
     if (displayFrequency === "every_visit" || displayFrequency === "always") return false;
     const entry = this.cache.get(guideId);
     if (!entry) return false;
     if (displayFrequency === "once") return true;
-    if (displayFrequency === "until_dismissed") return entry.status === "dismissed";
+    if (displayFrequency === "until_dismissed") {
+      return entry.status === "dismissed" || entry.status === "completed";
+    }
+    if (displayFrequency === "until_answered") return entry.status === "completed";
     return false;
   }
   /**
@@ -1303,6 +1443,88 @@ function readCtaUrl(step) {
   return isSafeUrl(candidate) ? candidate : void 0;
 }
 
+// src/plugins/guides/guide-design.ts
+var DARK_THEME = {
+  "--veo-bg": "#1f2937",
+  "--veo-text": "#f9fafb",
+  "--veo-text-secondary": "#d1d5db",
+  "--veo-shadow": "0 20px 60px rgba(0, 0, 0, 0.55)"
+};
+var ALIGN_JUSTIFY = {
+  left: "flex-start",
+  center: "center",
+  right: "flex-end"
+};
+var SHADOW = {
+  none: "none",
+  soft: "0 4px 14px rgba(0, 0, 0, 0.10)",
+  medium: "0 8px 30px rgba(0, 0, 0, 0.18)",
+  strong: "0 24px 60px rgba(0, 0, 0, 0.32)"
+};
+var PRESET_POS = {
+  center: [0.5, 0.5],
+  top: [0.5, 0],
+  bottom: [0.5, 1],
+  left: [0, 0.5],
+  right: [1, 0.5],
+  "top-left": [0, 0],
+  "top-right": [1, 0],
+  "bottom-left": [0, 1],
+  "bottom-right": [1, 1]
+};
+var COLOR_RE = /^#[0-9a-f]{3,8}$|^(rgb|rgba|hsl|hsla)\([\d.,%/\sdeg]+\)$|^[a-z]{3,20}$/i;
+function clamp(n, min, max) {
+  return Math.min(max, Math.max(min, n));
+}
+function applyDesignVars(host, style) {
+  if (!style || typeof style !== "object") return;
+  const s = style;
+  if (typeof s.accentColor === "string" && COLOR_RE.test(s.accentColor.trim())) {
+    host.style.setProperty("--veo-primary", s.accentColor.trim());
+  }
+  if (s.theme === "dark") {
+    for (const [key, value] of Object.entries(DARK_THEME)) {
+      host.style.setProperty(key, value);
+    }
+  }
+  if (typeof s.radius === "number" && Number.isFinite(s.radius)) {
+    host.style.setProperty("--veo-radius", `${clamp(s.radius, 0, 48)}px`);
+  }
+  if (typeof s.width === "number" && Number.isFinite(s.width)) {
+    host.style.setProperty("--veo-width", `${clamp(s.width, 220, 720)}px`);
+  }
+  if (s.align === "left" || s.align === "center" || s.align === "right") {
+    host.style.setProperty("--veo-actions-justify", ALIGN_JUSTIFY[s.align]);
+  }
+  if (typeof s.padding === "number" && Number.isFinite(s.padding)) {
+    host.style.setProperty("--veo-pad", `${clamp(s.padding, 0, 64)}px`);
+  }
+  if (typeof s.margin === "number" && Number.isFinite(s.margin)) {
+    host.style.setProperty("--veo-margin", `${clamp(s.margin, 0, 64)}px`);
+  }
+  if (typeof s.borderWidth === "number" && Number.isFinite(s.borderWidth)) {
+    host.style.setProperty("--veo-border-width", `${clamp(s.borderWidth, 0, 16)}px`);
+  }
+  if (typeof s.borderColor === "string" && COLOR_RE.test(s.borderColor.trim())) {
+    host.style.setProperty("--veo-border-color", s.borderColor.trim());
+  }
+  if (typeof s.shadow === "string" && SHADOW[s.shadow]) {
+    host.style.setProperty("--veo-shadow", SHADOW[s.shadow]);
+  }
+  let px;
+  let py;
+  if (typeof s.posX === "number" && typeof s.posY === "number") {
+    px = clamp(s.posX, 0, 1);
+    py = clamp(s.posY, 0, 1);
+  } else if (typeof s.overlayPosition === "string" && PRESET_POS[s.overlayPosition]) {
+    [px, py] = PRESET_POS[s.overlayPosition];
+  }
+  if (px !== void 0 && py !== void 0) {
+    host.style.setProperty("--veo-pos-x", `${px * 100}%`);
+    host.style.setProperty("--veo-pos-y", `${py * 100}%`);
+  }
+}
+
 // src/plugins/guides/styles.ts
 var GUIDE_STYLES = `
 :host {
@@ -1312,6 +1534,8 @@ var GUIDE_STYLES = `
   --veo-bg: #ffffff;
   --veo-radius: 12px;
   --veo-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
+  --veo-width: 420px;
+  --veo-actions-justify: flex-end;
   all: initial;
 }
 * { box-sizing: border-box; font-family: -apple-system, system-ui, "Segoe UI", Roboto, sans-serif; }
@@ -1319,26 +1543,36 @@ var GUIDE_STYLES = `
 .veo-modal-overlay {
   position: fixed; inset: 0;
   background: rgba(15, 15, 30, 0.45);
-  display: flex; align-items: center; justify-content: center;
   z-index: ${GUIDE_Z_INDEX};
   animation: veo-fade-in 180ms ease-out;
 }
+/*
+ * Posici\xF3n libre/preset: --veo-pos-x/y son porcentajes (default 50% = centro).
+ * El truco translate(-pos) alinea la MISMA fracci\xF3n de la tarjeta con esa
+ * fracci\xF3n del overlay, as\xED la tarjeta nunca se sale (0% = pegada izquierda,
+ * 100% = pegada derecha, 50% = centrada) sea cual sea su ancho.
+ */
 .veo-modal-card {
+  position: absolute;
+  left: var(--veo-pos-x, 50%);
+  top: var(--veo-pos-y, 50%);
+  transform: translate(calc(var(--veo-pos-x, 50%) * -1), calc(var(--veo-pos-y, 50%) * -1));
   background: var(--veo-bg);
   border-radius: var(--veo-radius);
-  padding: 24px 28px;
-  max-width: 420px; width: 90%;
-  position: relative;
+  border: var(--veo-border-width, 0) solid var(--veo-border-color, transparent);
+  padding: var(--veo-pad, 24px);
+  max-width: var(--veo-width); width: 90%;
   box-shadow: var(--veo-shadow);
-  animation: veo-slide-up 220ms cubic-bezier(0.16, 1, 0.3, 1);
+  animation: veo-fade-in 180ms ease-out;
 }
 
 .veo-banner {
   position: fixed; left: 0; right: 0;
   background: var(--veo-bg);
-  padding: 14px 20px;
+  border: var(--veo-border-width, 0) solid var(--veo-border-color, transparent);
+  padding: var(--veo-pad, 16px);
   z-index: ${GUIDE_Z_INDEX};
-  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
+  box-shadow: var(--veo-shadow, 0 2px 12px rgba(0, 0, 0, 0.12));
   animation: veo-slide-down 200ms ease-out;
 }
 .veo-banner-top { top: 0; }
@@ -1348,13 +1582,26 @@ var GUIDE_STYLES = `
   position: absolute;
   background: var(--veo-bg);
   border-radius: var(--veo-radius);
-  padding: 14px 16px;
+  border: var(--veo-border-width, 0) solid var(--veo-border-color, transparent);
+  padding: var(--veo-pad, 15px);
   max-width: 300px;
   z-index: ${GUIDE_Z_INDEX};
-  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.18);
+  box-shadow: var(--veo-shadow, 0 8px 30px rgba(0, 0, 0, 0.18));
   animation: veo-fade-in 150ms ease-out;
 }
 
+.veo-inline {
+  background: var(--veo-bg);
+  border-radius: var(--veo-radius);
+  border: var(--veo-border-width, 0) solid var(--veo-border-color, transparent);
+  padding: var(--veo-pad, 20px);
+  max-width: var(--veo-width);
+  margin: var(--veo-margin, 12px) 0;
+  position: relative;
+  box-shadow: var(--veo-shadow);
+  animation: veo-fade-in 160ms ease-out;
+}
+
 .veo-guide-content {
   position: relative;
   display: flex; flex-direction: column;
@@ -1373,7 +1620,7 @@ var GUIDE_STYLES = `
   margin: 0 0 16px; color: var(--veo-text-secondary);
 }
 .veo-guide-actions {
-  display: flex; gap: 8px; justify-content: flex-end;
+  display: flex; gap: 8px; justify-content: var(--veo-actions-justify);
 }
 .veo-guide-cta {
   background: var(--veo-primary); color: #fff; border: none;
@@ -1392,16 +1639,66 @@ var GUIDE_STYLES = `
 }
 .veo-guide-close:hover { color: var(--veo-text); }
 
+.veo-form { display: flex; flex-direction: column; gap: 14px; margin-bottom: 16px; }
+.veo-form-field { display: flex; flex-direction: column; gap: 6px; }
+.veo-form-label { font-size: 13px; font-weight: 500; color: var(--veo-text); }
+.veo-form-input {
+  font-size: 14px; color: var(--veo-text);
+  background: var(--veo-bg);
+  border: 1px solid #d1d5db; border-radius: 8px;
+  padding: 8px 10px; width: 100%;
+}
+.veo-form-input:focus { outline: 2px solid var(--veo-primary); outline-offset: -1px; border-color: transparent; }
+.veo-form-options { display: flex; flex-direction: column; gap: 6px; }
+.veo-form-option {
+  display: flex; align-items: center; gap: 8px;
+  font-size: 14px; color: var(--veo-text); cursor: pointer;
+}
+.veo-form-option input { accent-color: var(--veo-primary); margin: 0; cursor: pointer; }
+.veo-form-scale { display: flex; gap: 4px; flex-wrap: wrap; }
+.veo-nps-btn {
+  min-width: 30px; height: 30px; padding: 0 4px;
+  font-size: 13px; font-weight: 500; color: var(--veo-text);
+  background: var(--veo-bg); border: 1px solid #d1d5db; border-radius: 6px;
+  cursor: pointer; transition: all 100ms ease;
+}
+.veo-nps-btn:hover { border-color: var(--veo-primary); }
+.veo-rating-btn {
+  background: none; border: none; padding: 0 2px;
+  font-size: 26px; line-height: 1; color: #d1d5db;
+  cursor: pointer; transition: color 100ms ease;
+}
+.veo-scale-active.veo-nps-btn { background: var(--veo-primary); color: #fff; border-color: var(--veo-primary); }
+.veo-scale-active.veo-rating-btn { color: #f59e0b; }
+.veo-form-error { font-size: 13px; color: #dc2626; margin: 0; }
+.veo-form-thanks {
+  text-align: center; padding: 24px 8px;
+  font-size: 16px; font-weight: 600; color: var(--veo-text);
+}
+.veo-form-preview-note {
+  text-align: center; margin: 0 0 12px;
+  font-size: 12px; color: #b45309;
+}
+
 .veo-walkthrough {
   position: absolute;
   background: var(--veo-bg);
   border-radius: var(--veo-radius);
-  padding: 16px;
+  border: var(--veo-border-width, 0) solid var(--veo-border-color, transparent);
+  padding: var(--veo-pad, 16px);
   max-width: 340px;
   z-index: ${GUIDE_Z_INDEX};
-  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
+  box-shadow: var(--veo-shadow, 0 8px 30px rgba(0, 0, 0, 0.2));
   animation: veo-fade-in 150ms ease-out;
 }
+.veo-walkthrough-arrow {
+  position: absolute;
+  width: 12px;
+  height: 12px;
+  background: var(--veo-bg);
+  transform: rotate(45deg);
+  pointer-events: none;
+}
 .veo-walkthrough-counter {
   font-size: 11px; color: #9ca3af;
   margin-bottom: 8px; letter-spacing: 0.02em;
@@ -1455,6 +1752,10 @@ var GUIDE_STYLES = `
   max-width: calc(100vw - 16px);
   animation: veo-fade-in 160ms ease;
 }
+.veo-custom-inline {
+  display: block;
+  margin: 12px 0;
+}
 .veo-custom-frame {
   display: block;
   border: 0;
@@ -1500,6 +1801,14 @@ var BaseRenderer = class {
     this.shadow = shadow;
     return { host, shadow, root };
   }
+  /**
+   * Aplica la tematización por datos del step (`step.style`) como variables
+   * CSS sobre el host. Llamar tras `createHost()`. No-op si no hay host o
+   * style. Ver `guide-design.ts`.
+   */
+  applyDesign(style) {
+    if (this.host) applyDesignVars(this.host, style);
+  }
   /**
    * Registra una función a ejecutar en `destroy()`. Útil para limpiar
    * listeners globales (scroll, resize) o intervalos.
@@ -1530,6 +1839,7 @@ var BannerRenderer = class extends BaseRenderer {
     const step = context.guide.guideSteps[0];
     if (!step) return;
     const { root } = this.createHost();
+    this.applyDesign(step.style);
     const ownerDocument = root.ownerDocument ?? document;
     const position = step.style?.position === "bottom" ? "bottom" : "top";
     const banner = ownerDocument.createElement("div");
@@ -1591,6 +1901,77 @@ function waitForElement(selector, timeoutMs = DEFAULT_ANCHOR_WAIT_MS) {
   });
 }
 
+// src/plugins/guides/renderers/custom-frame.ts
+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.style.width = opts.width;
+  const hasFixedHeight = opts.fixedHeight !== void 0 && opts.fixedHeight !== null;
+  if (hasFixedHeight) iframe.style.height = toCssSize(opts.fixedHeight);
+  const token = uuidv7();
+  iframe.srcdoc = buildSrcdoc(step.html ?? "", step.css ?? "", step.js ?? "", token);
+  const close = () => context.onClose();
+  const onMessage = (event) => {
+    if (event.source !== iframe.contentWindow) return;
+    const data = event.data;
+    if (!data || typeof data !== "object" || data.__veo !== token) return;
+    switch (data.type) {
+      case "dismiss":
+        context.onInteraction({
+          guideId: context.guide.guideId,
+          stepIndex: 0,
+          action: "dismissed"
+        });
+        close();
+        break;
+      case "cta":
+        context.onInteraction({
+          guideId: context.guide.guideId,
+          stepIndex: 0,
+          action: "cta_clicked"
+        });
+        if (typeof data.url === "string" && isSafeUrl(data.url)) {
+          window.open(data.url, "_blank", "noopener,noreferrer");
+        }
+        if (data.close !== false) close();
+        break;
+      case "navigate":
+        if (typeof data.url === "string" && isSafeUrl(data.url)) {
+          window.location.assign(data.url);
+        }
+        break;
+      case "track":
+        if (typeof data.name === "string" && context.onTrack) {
+          context.onTrack(data.name, isRecord(data.props) ? data.props : void 0);
+        }
+        break;
+      case "resize":
+        if (!hasFixedHeight && typeof data.height === "number" && data.height > 0) {
+          iframe.style.height = `${Math.ceil(data.height)}px`;
+        }
+        break;
+    }
+  };
+  window.addEventListener("message", onMessage);
+  return { iframe, cleanup: () => window.removeEventListener("message", onMessage) };
+}
+function toCssSize(value) {
+  return typeof value === "number" ? `${value}px` : value;
+}
+function isRecord(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function buildSrcdoc(html, css, js, token) {
+  const bridge = `(function(){var T=${JSON.stringify(token)};function P(m){m.__veo=T;parent.postMessage(m,'*');}window.veo={dismiss:function(){P({type:'dismiss'});},cta:function(u){P({type:'cta',url:u});},track:function(n,p){P({type:'track',name:n,props:p||{}});},navigate:function(u){P({type:'navigate',url:u});}};document.addEventListener('click',function(e){var a=e.target&&e.target.closest?e.target.closest('a[href]'):null;if(!a)return;var h=a.getAttribute('href');if(!h||h.charAt(0)==='#'||/^(javascript|mailto|tel):/i.test(h))return;e.preventDefault();if(a.target==='_blank'){P({type:'cta',url:a.href,close:false});}else{P({type:'navigate',url:h});}},true);function H(){P({type:'resize',height:Math.ceil(document.documentElement.scrollHeight)});}window.addEventListener('load',H);try{if(typeof ResizeObserver!=='undefined'){new ResizeObserver(H).observe(document.documentElement);}}catch(e){}})();`;
+  return `<!DOCTYPE html><html><head><meta charset="utf-8"><style>html,body{margin:0;padding:0;background:transparent;}</style><style>${escapeClosing(css, "style")}</style></head><body>${html}<script>${bridge}</script>` + (js ? `<script>${escapeClosing(js, "script")}</script>` : "") + "</body></html>";
+}
+function escapeClosing(code, tag) {
+  const rx = tag === "script" ? /<\/script/gi : /<\/style/gi;
+  return code.replace(rx, `<\\/${tag}`);
+}
+
 // src/plugins/guides/renderers/custom-renderer.ts
 var DEFAULT_PLACEMENT = { mode: "floating", position: "bottom-right" };
 var DEFAULT_OFFSET = 16;
@@ -1611,17 +1992,11 @@ var CustomRenderer = class extends BaseRenderer {
     const doc = root.ownerDocument ?? document;
     const wrapper = doc.createElement("div");
     wrapper.className = placement.mode === "anchored" ? "veo-custom-anchored" : "veo-custom-floating";
-    const iframe = doc.createElement("iframe");
-    iframe.className = "veo-custom-frame";
-    iframe.setAttribute("sandbox", "allow-scripts");
-    iframe.setAttribute("title", context.guide.guideName || "Veo");
-    iframe.style.width = toCssSize(placement.width ?? DEFAULT_WIDTH);
-    const hasFixedHeight = placement.height !== void 0 && placement.height !== null;
-    if (hasFixedHeight) {
-      iframe.style.height = toCssSize(placement.height);
-    }
-    const token = uuidv7();
-    iframe.srcdoc = buildSrcdoc(step.html, step.css ?? "", step.js ?? "", token);
+    const { iframe, cleanup } = mountCustomFrame(doc, step, context, {
+      width: toCssSize(placement.width ?? DEFAULT_WIDTH),
+      fixedHeight: placement.height ?? null
+    });
+    this.registerCleanup(cleanup);
     wrapper.appendChild(iframe);
     root.appendChild(wrapper);
     if (placement.mode === "floating") {
@@ -1629,50 +2004,6 @@ var CustomRenderer = class extends BaseRenderer {
     } else if (anchor) {
       this.registerCleanup(await this.setupAnchoredPosition(anchor, wrapper, placement));
     }
-    const close = () => context.onClose();
-    const onMessage = (event) => {
-      if (event.source !== iframe.contentWindow) return;
-      const data = event.data;
-      if (!data || typeof data !== "object" || data.__veo !== token) return;
-      switch (data.type) {
-        case "dismiss":
-          context.onInteraction({
-            guideId: context.guide.guideId,
-            stepIndex: 0,
-            action: "dismissed"
-          });
-          close();
-          break;
-        case "cta":
-          context.onInteraction({
-            guideId: context.guide.guideId,
-            stepIndex: 0,
-            action: "cta_clicked"
-          });
-          if (typeof data.url === "string" && isSafeUrl(data.url)) {
-            window.open(data.url, "_blank", "noopener,noreferrer");
-          }
-          if (data.close !== false) close();
-          break;
-        case "navigate":
-          if (typeof data.url === "string" && isSafeUrl(data.url)) {
-            window.location.assign(data.url);
-          }
-          break;
-        case "track":
-          if (typeof data.name === "string" && context.onTrack) {
-            context.onTrack(data.name, isRecord(data.props) ? data.props : void 0);
-          }
-          break;
-        case "resize":
-          if (!hasFixedHeight && typeof data.height === "number" && data.height > 0) {
-            iframe.style.height = `${Math.ceil(data.height)}px`;
-          }
-          break;
-      }
-    };
-    window.addEventListener("message", onMessage);
-    this.registerCleanup(() => window.removeEventListener("message", onMessage));
     context.onInteraction({ guideId: context.guide.guideId, stepIndex: 0, action: "shown" });
   }
   async setupAnchoredPosition(anchor, wrapper, placement) {
@@ -1698,12 +2029,6 @@ var CustomRenderer = class extends BaseRenderer {
     };
   }
 };
-function toCssSize(value) {
-  return typeof value === "number" ? `${value}px` : value;
-}
-function isRecord(value) {
-  return typeof value === "object" && value !== null && !Array.isArray(value);
-}
 function applyFloatingPosition(wrapper, placement) {
   const position = placement.position ?? "bottom-right";
   const ox = `${placement.offsetX ?? DEFAULT_OFFSET}px`;
@@ -1727,21 +2052,428 @@ function applyFloatingPosition(wrapper, placement) {
     s.transform = "translateX(-50%)";
   }
 }
-function buildSrcdoc(html, css, js, token) {
-  const bridge = `(function(){var T=${JSON.stringify(token)};function P(m){m.__veo=T;parent.postMessage(m,'*');}window.veo={dismiss:function(){P({type:'dismiss'});},cta:function(u){P({type:'cta',url:u});},track:function(n,p){P({type:'track',name:n,props:p||{}});},navigate:function(u){P({type:'navigate',url:u});}};function H(){P({type:'resize',height:Math.ceil(document.documentElement.scrollHeight)});}window.addEventListener('load',H);try{if(typeof ResizeObserver!=='undefined'){new ResizeObserver(H).observe(document.documentElement);}}catch(e){}})();`;
-  return `<!DOCTYPE html><html><head><meta charset="utf-8"><style>html,body{margin:0;padding:0;background:transparent;}</style><style>${escapeClosing(css, "style")}</style></head><body>${html}<script>${bridge}</script>` + (js ? `<script>${escapeClosing(js, "script")}</script>` : "") + "</body></html>";
+
+// src/plugins/guides/form-content.ts
+function mountFormContent(card, context, doc) {
+  const step = context.guide.guideSteps[0];
+  if (!step) return;
+  const fields = step.fields ?? [];
+  const dismiss = () => {
+    context.onInteraction({ guideId: context.guide.guideId, stepIndex: 0, action: "dismissed" });
+    context.onClose();
+  };
+  const content = doc.createElement("div");
+  content.className = "veo-guide-content";
+  if (step.title) {
+    const heading = doc.createElement("h2");
+    heading.className = "veo-guide-title";
+    heading.textContent = step.title;
+    content.appendChild(heading);
+  }
+  if (step.content) {
+    const paragraph = doc.createElement("p");
+    paragraph.className = "veo-guide-text";
+    paragraph.textContent = step.content;
+    content.appendChild(paragraph);
+  }
+  const readers = [];
+  const form = doc.createElement("form");
+  form.className = "veo-form";
+  form.noValidate = true;
+  for (const field of fields) {
+    const { wrapper, read } = buildField(field, doc);
+    readers.push({ field, read });
+    form.appendChild(wrapper);
+  }
+  const error = doc.createElement("p");
+  error.className = "veo-form-error";
+  error.style.display = "none";
+  form.appendChild(error);
+  const actions = doc.createElement("div");
+  actions.className = "veo-guide-actions";
+  const submit = doc.createElement("button");
+  submit.type = "submit";
+  submit.className = "veo-guide-cta";
+  submit.textContent = step.ctaText || "Enviar";
+  actions.appendChild(submit);
+  form.appendChild(actions);
+  form.addEventListener("submit", (e) => {
+    e.preventDefault();
+    error.style.display = "none";
+    const answers = {};
+    for (const { field, read } of readers) {
+      const value = read();
+      const empty = value === void 0 || value === null || value === "";
+      if (empty) {
+        if (field.required) {
+          error.textContent = `Complet\xE1 "${field.label}"`;
+          error.style.display = "block";
+          return;
+        }
+        continue;
+      }
+      answers[field.key] = value;
+    }
+    if (Object.keys(answers).length === 0) {
+      error.textContent = "Respond\xE9 al menos un campo";
+      error.style.display = "block";
+      return;
+    }
+    submit.disabled = true;
+    const submitFn = context.onFormSubmit ?? (() => Promise.resolve(true));
+    void submitFn(answers).then((ok) => {
+      if (!ok) {
+        submit.disabled = false;
+        error.textContent = "No se pudo enviar. Prob\xE1 de nuevo.";
+        error.style.display = "block";
+        return;
+      }
+      context.onInteraction({ guideId: context.guide.guideId, stepIndex: 0, action: "completed" });
+      const note = context.isPreview ? context.previewNote ?? "Vista previa: la respuesta NO se guard\xF3." : null;
+      showThanks(card, doc, note);
+      window.setTimeout(() => context.onClose(), note ? 2200 : 1400);
+    });
+  });
+  content.appendChild(form);
+  const closeBtn = doc.createElement("button");
+  closeBtn.type = "button";
+  closeBtn.className = "veo-guide-close";
+  closeBtn.setAttribute("aria-label", "Cerrar");
+  closeBtn.textContent = "\xD7";
+  closeBtn.addEventListener("click", dismiss);
+  content.appendChild(closeBtn);
+  card.appendChild(content);
+}
+function showThanks(card, doc, note) {
+  while (card.firstChild) card.removeChild(card.firstChild);
+  const thanks = doc.createElement("div");
+  thanks.className = "veo-form-thanks";
+  thanks.textContent = "\u2713 \xA1Gracias por tu respuesta!";
+  card.appendChild(thanks);
+  if (note) {
+    const noteEl = doc.createElement("p");
+    noteEl.className = "veo-form-preview-note";
+    noteEl.textContent = note;
+    card.appendChild(noteEl);
+  }
+}
+function buildField(field, doc) {
+  const wrapper = doc.createElement("div");
+  wrapper.className = "veo-form-field";
+  const label = doc.createElement("label");
+  label.className = "veo-form-label";
+  label.textContent = field.required ? `${field.label} *` : field.label;
+  wrapper.appendChild(label);
+  switch (field.type) {
+    case "textarea": {
+      const input = doc.createElement("textarea");
+      input.className = "veo-form-input";
+      input.rows = 3;
+      if (field.placeholder) input.placeholder = field.placeholder;
+      wrapper.appendChild(input);
+      return { wrapper, read: () => input.value.trim() };
+    }
+    case "number": {
+      const input = doc.createElement("input");
+      input.type = "number";
+      input.className = "veo-form-input";
+      if (field.placeholder) input.placeholder = field.placeholder;
+      wrapper.appendChild(input);
+      return {
+        wrapper,
+        read: () => input.value.trim() === "" ? void 0 : Number(input.value)
+      };
+    }
+    case "select": {
+      const select = doc.createElement("select");
+      select.className = "veo-form-input";
+      const blank = doc.createElement("option");
+      blank.value = "";
+      blank.textContent = field.placeholder || "Eleg\xED una opci\xF3n\u2026";
+      select.appendChild(blank);
+      for (const opt of field.options ?? []) {
+        const option = doc.createElement("option");
+        option.value = opt;
+        option.textContent = opt;
+        select.appendChild(option);
+      }
+      wrapper.appendChild(select);
+      return { wrapper, read: () => select.value || void 0 };
+    }
+    case "radio": {
+      const group = doc.createElement("div");
+      group.className = "veo-form-options";
+      const name = `veo-${field.key}`;
+      const inputs = [];
+      for (const opt of field.options ?? []) {
+        const optionLabel = doc.createElement("label");
+        optionLabel.className = "veo-form-option";
+        const radio = doc.createElement("input");
+        radio.type = "radio";
+        radio.name = name;
+        radio.value = opt;
+        inputs.push(radio);
+        const text = doc.createElement("span");
+        text.textContent = opt;
+        optionLabel.appendChild(radio);
+        optionLabel.appendChild(text);
+        group.appendChild(optionLabel);
+      }
+      wrapper.appendChild(group);
+      return { wrapper, read: () => inputs.find((i) => i.checked)?.value };
+    }
+    case "multiselect": {
+      const group = doc.createElement("div");
+      group.className = "veo-form-options";
+      const inputs = [];
+      for (const opt of field.options ?? []) {
+        const optionLabel = doc.createElement("label");
+        optionLabel.className = "veo-form-option";
+        const checkbox = doc.createElement("input");
+        checkbox.type = "checkbox";
+        checkbox.value = opt;
+        inputs.push(checkbox);
+        const text = doc.createElement("span");
+        text.textContent = opt;
+        optionLabel.appendChild(checkbox);
+        optionLabel.appendChild(text);
+        group.appendChild(optionLabel);
+      }
+      wrapper.appendChild(group);
+      return {
+        wrapper,
+        read: () => {
+          const values = inputs.filter((i) => i.checked).map((i) => i.value);
+          return values.length > 0 ? values : void 0;
+        }
+      };
+    }
+    case "checkbox": {
+      const optionLabel = doc.createElement("label");
+      optionLabel.className = "veo-form-option";
+      const checkbox = doc.createElement("input");
+      checkbox.type = "checkbox";
+      const text = doc.createElement("span");
+      text.textContent = field.placeholder || "S\xED";
+      optionLabel.appendChild(checkbox);
+      optionLabel.appendChild(text);
+      wrapper.appendChild(optionLabel);
+      return { wrapper, read: () => checkbox.checked ? true : field.required ? "" : false };
+    }
+    case "yesno": {
+      const group = doc.createElement("div");
+      group.className = "veo-form-options";
+      const name = `veo-${field.key}`;
+      const [yesLabel, noLabel] = field.options?.length === 2 ? field.options : ["S\xED", "No"];
+      const inputs = [];
+      for (const { label: optText, value } of [
+        { label: yesLabel, value: true },
+        { label: noLabel, value: false }
+      ]) {
+        const optionLabel = doc.createElement("label");
+        optionLabel.className = "veo-form-option";
+        const radio = doc.createElement("input");
+        radio.type = "radio";
+        radio.name = name;
+        inputs.push({ input: radio, value });
+        const text = doc.createElement("span");
+        text.textContent = optText;
+        optionLabel.appendChild(radio);
+        optionLabel.appendChild(text);
+        group.appendChild(optionLabel);
+      }
+      wrapper.appendChild(group);
+      return { wrapper, read: () => inputs.find((i) => i.input.checked)?.value };
+    }
+    case "nps":
+      return buildScale(wrapper, doc, 0, 10, "veo-nps-btn");
+    case "rating":
+      return buildScale(wrapper, doc, 1, 5, "veo-rating-btn", "\u2605");
+    default: {
+      const input = doc.createElement("input");
+      input.type = "text";
+      input.className = "veo-form-input";
+      if (field.placeholder) input.placeholder = field.placeholder;
+      wrapper.appendChild(input);
+      return { wrapper, read: () => input.value.trim() };
+    }
+  }
+}
+function buildScale(wrapper, doc, min, max, btnClass, symbol) {
+  const row = doc.createElement("div");
+  row.className = "veo-form-scale";
+  let selected;
+  const buttons = [];
+  for (let n = min; n <= max; n++) {
+    const btn = doc.createElement("button");
+    btn.type = "button";
+    btn.className = btnClass;
+    btn.textContent = symbol ?? String(n);
+    btn.setAttribute("aria-label", String(n));
+    btn.addEventListener("click", () => {
+      selected = n;
+      buttons.forEach((b, i) => {
+        const active2 = symbol ? i + min <= n : i + min === n;
+        b.classList.toggle("veo-scale-active", active2);
+      });
+    });
+    buttons.push(btn);
+    row.appendChild(btn);
+  }
+  wrapper.appendChild(row);
+  return { wrapper, read: () => selected };
 }
-function escapeClosing(code, tag) {
-  const rx = tag === "script" ? /<\/script/gi : /<\/style/gi;
-  return code.replace(rx, `<\\/${tag}`);
+
+// src/plugins/guides/renderers/form-renderer.ts
+var FormRenderer = class extends BaseRenderer {
+  render(context) {
+    const step = context.guide.guideSteps[0];
+    if (!step || (step.fields ?? []).length === 0) return;
+    const { root } = this.createHost();
+    this.applyDesign(step.style);
+    const doc = root.ownerDocument ?? document;
+    const overlay = doc.createElement("div");
+    overlay.className = "veo-modal-overlay";
+    const card = doc.createElement("div");
+    card.className = "veo-modal-card";
+    mountFormContent(card, context, doc);
+    overlay.appendChild(card);
+    root.appendChild(overlay);
+    const dismiss = () => {
+      context.onInteraction({ guideId: context.guide.guideId, stepIndex: 0, action: "dismissed" });
+      context.onClose();
+    };
+    overlay.addEventListener("click", (e) => {
+      if (e.target === overlay) dismiss();
+    });
+    const onKey = (e) => {
+      if (e.key === "Escape") dismiss();
+    };
+    document.addEventListener("keydown", onKey);
+    this.registerCleanup(() => document.removeEventListener("keydown", onKey));
+    context.onInteraction({ guideId: context.guide.guideId, stepIndex: 0, action: "shown" });
+  }
+};
+
+// src/plugins/guides/inline-host.ts
+function readInlinePosition(style) {
+  const p = style?.inlinePosition;
+  return p === "before" || p === "prepend" || p === "append" ? p : "after";
+}
+function insertHost(anchor, host, position) {
+  switch (position) {
+    case "before":
+      anchor.before(host);
+      break;
+    case "after":
+      anchor.after(host);
+      break;
+    case "prepend":
+      anchor.prepend(host);
+      break;
+    case "append":
+      anchor.append(host);
+      break;
+  }
+}
+function keepHostAttached(host, selector, position) {
+  const id = window.setInterval(() => {
+    if (host.isConnected) return;
+    const anchor = document.querySelector(selector);
+    if (anchor) insertHost(anchor, host, position);
+  }, 1e3);
+  return () => window.clearInterval(id);
 }
 
+// src/plugins/guides/renderers/inline-custom-renderer.ts
+var InlineCustomRenderer = class extends BaseRenderer {
+  async render(context) {
+    const step = context.guide.guideSteps[0];
+    if (!step || typeof step.html !== "string" || step.html.length === 0) return;
+    const selector = step.selector ?? context.guide.activationRules.selector;
+    if (typeof selector !== "string" || selector.length === 0) return;
+    const anchor = await waitForElement(selector);
+    if (!anchor) return;
+    const { host, root } = this.createHost();
+    host.style.display = "block";
+    const position = readInlinePosition(step.style);
+    insertHost(anchor, host, position);
+    this.registerCleanup(keepHostAttached(host, selector, position));
+    const doc = root.ownerDocument ?? document;
+    const wrapper = doc.createElement("div");
+    wrapper.className = "veo-custom-inline";
+    const { iframe, cleanup } = mountCustomFrame(doc, step, context, { width: "100%" });
+    this.registerCleanup(cleanup);
+    wrapper.appendChild(iframe);
+    root.appendChild(wrapper);
+    context.onInteraction({ guideId: context.guide.guideId, stepIndex: 0, action: "shown" });
+  }
+};
+
+// src/plugins/guides/renderers/inline-form-renderer.ts
+var InlineFormRenderer = class extends BaseRenderer {
+  async render(context) {
+    const step = context.guide.guideSteps[0];
+    if (!step || (step.fields ?? []).length === 0) return;
+    const selector = step.selector ?? context.guide.activationRules.selector;
+    if (typeof selector !== "string" || selector.length === 0) return;
+    const anchor = await waitForElement(selector);
+    if (!anchor) return;
+    const { host, root } = this.createHost();
+    host.style.display = "block";
+    const position = readInlinePosition(step.style);
+    insertHost(anchor, host, position);
+    this.registerCleanup(keepHostAttached(host, selector, position));
+    this.applyDesign(step.style);
+    const doc = root.ownerDocument ?? document;
+    const card = doc.createElement("div");
+    card.className = "veo-inline";
+    mountFormContent(card, context, doc);
+    root.appendChild(card);
+    context.onInteraction({ guideId: context.guide.guideId, stepIndex: 0, action: "shown" });
+  }
+};
+
+// src/plugins/guides/renderers/inline-renderer.ts
+var InlineRenderer = class extends BaseRenderer {
+  async render(context) {
+    const step = context.guide.guideSteps[0];
+    if (!step) return;
+    const selector = step.selector ?? context.guide.activationRules.selector;
+    if (typeof selector !== "string" || selector.length === 0) return;
+    const anchor = await waitForElement(selector);
+    if (!anchor) return;
+    const { host, root } = this.createHost();
+    host.style.display = "block";
+    const position = readInlinePosition(step.style);
+    insertHost(anchor, host, position);
+    this.registerCleanup(keepHostAttached(host, selector, position));
+    this.applyDesign(step.style);
+    const ownerDocument = root.ownerDocument ?? document;
+    const card = ownerDocument.createElement("div");
+    card.className = "veo-inline";
+    const dismiss = (action, ctaUrl) => {
+      context.onInteraction({ guideId: context.guide.guideId, stepIndex: 0, action });
+      if (ctaUrl) window.open(ctaUrl, "_blank", "noopener,noreferrer");
+      context.onClose();
+    };
+    const content = buildStepContent(step, ownerDocument, {
+      onCtaClick: (action, url) => dismiss("cta_clicked", action === "url" ? url : void 0),
+      onDismiss: () => dismiss("dismissed")
+    });
+    card.appendChild(content);
+    root.appendChild(card);
+    context.onInteraction({ guideId: context.guide.guideId, stepIndex: 0, action: "shown" });
+  }
+};
+
 // src/plugins/guides/renderers/modal-renderer.ts
 var ModalRenderer = class extends BaseRenderer {
   render(context) {
     const step = context.guide.guideSteps[0];
     if (!step) return;
     const { root } = this.createHost();
+    this.applyDesign(step.style);
     const ownerDocument = root.ownerDocument ?? document;
     const overlay = ownerDocument.createElement("div");
     overlay.className = "veo-modal-overlay";
@@ -1789,6 +2521,7 @@ var TooltipRenderer = class extends BaseRenderer {
     const anchor = await waitForElement(selector);
     if (!anchor) return;
     const { root } = this.createHost();
+    this.applyDesign(step.style);
     const ownerDocument = root.ownerDocument ?? document;
     const tooltip = ownerDocument.createElement("div");
     tooltip.className = "veo-tooltip";
@@ -1916,6 +2649,7 @@ var WalkthroughRenderer = class extends BaseRenderer {
     const anchor = await waitForElement(selector, WALKTHROUGH_STEP_SELECTOR_TIMEOUT_MS);
     if (!anchor) return false;
     const { root } = this.createHost();
+    this.applyDesign(step.style);
     const ownerDocument = root.ownerDocument ?? document;
     const tooltip = ownerDocument.createElement("div");
     tooltip.className = "veo-walkthrough";
@@ -1927,14 +2661,18 @@ var WalkthroughRenderer = class extends BaseRenderer {
       context.callbacks
     );
     tooltip.appendChild(content);
+    const arrowEl = ownerDocument.createElement("div");
+    arrowEl.className = "veo-walkthrough-arrow";
+    tooltip.appendChild(arrowEl);
     root.appendChild(tooltip);
     const updatePosition = async () => {
-      const { x, y } = await dom.computePosition(anchor, tooltip, {
+      const { x, y, placement, middlewareData } = await dom.computePosition(anchor, tooltip, {
         placement: "bottom",
-        middleware: [dom.offset(8), dom.flip(), dom.shift({ padding: 8 })]
+        middleware: [dom.offset(10), dom.flip(), dom.shift({ padding: 8 }), dom.arrow({ element: arrowEl })]
       });
       tooltip.style.left = `${x}px`;
       tooltip.style.top = `${y}px`;
+      positionArrow(arrowEl, placement, middlewareData.arrow);
     };
     await updatePosition();
     const reposition = () => {
@@ -1949,6 +2687,21 @@ var WalkthroughRenderer = class extends BaseRenderer {
     return true;
   }
 };
+var STATIC_SIDE = {
+  top: "bottom",
+  bottom: "top",
+  left: "right",
+  right: "left"
+};
+function positionArrow(arrowEl, placement, data) {
+  const side = STATIC_SIDE[placement.split("-")[0] ?? "bottom"] ?? "top";
+  for (const prop of ["top", "bottom", "left", "right"]) {
+    arrowEl.style.setProperty(prop, "");
+  }
+  if (data?.x != null) arrowEl.style.setProperty("left", `${data.x}px`);
+  if (data?.y != null) arrowEl.style.setProperty("top", `${data.y}px`);
+  arrowEl.style.setProperty(side, "-6px");
+}
 
 // src/plugins/guides/walkthrough-state.ts
 var WalkthroughStateManager = class {
@@ -2078,10 +2831,18 @@ var GuidesController = class {
   constructor(client, config) {
     this.client = client;
     this.activeRenderers = /* @__PURE__ */ new Set();
+    /**
+     * Guías single-step actualmente en pantalla, por `guideId`. Evita repintar/
+     * duplicar la misma guía en cada pageview de una SPA (p.ej. una guía inline
+     * anclada a un elemento persistente). Se libera al cerrarse la guía.
+     */
+    this.activeByGuideId = /* @__PURE__ */ new Map();
     this.dispatched = /* @__PURE__ */ new Set();
     this.activeWalkthroughRenderer = null;
     this.activeWalkthroughGuide = null;
     this.debug = config.debug === true;
+    this.apiUrl = config.apiUrl;
+    this.apiKey = config.apiKey;
     this.resolver = config.resolver ?? new GuideResolverClient(config.apiUrl, config.apiKey, this.debug);
     if (config.trackerQueue) {
       this.trackerQueue = config.trackerQueue;
@@ -2141,6 +2902,10 @@ var GuidesController = class {
         if (this.debug) console.log(`[veo] guides: filtered locally guideId=${guide.guideId}`);
         continue;
       }
+      if (this.activeByGuideId.has(guide.guideId)) {
+        if (this.debug) console.log(`[veo] guides: already shown guideId=${guide.guideId}`);
+        continue;
+      }
       if (guide.guideType === "walkthrough" && guide.guideSteps.length > 1) {
         if (this.walkthroughState.hasActive()) {
           if (this.debug)
@@ -2163,6 +2928,7 @@ var GuidesController = class {
       }
     }
     this.activeRenderers.clear();
+    this.activeByGuideId.clear();
     if (this.activeWalkthroughRenderer) {
       try {
         this.activeWalkthroughRenderer.destroy();
@@ -2177,6 +2943,7 @@ var GuidesController = class {
   runSingleStepRender(guide, sessionId, pageUrl) {
     const renderer = this.createSingleStepRenderer(guide.guideType);
     if (!renderer) return;
+    this.activeByGuideId.set(guide.guideId, renderer);
     const delayMs = guide.activationRules.delayMs ?? 0;
     window.setTimeout(
       () => this.mountSingleStepRenderer(guide, renderer, sessionId, pageUrl),
@@ -2185,9 +2952,13 @@ var GuidesController = class {
   }
   mountSingleStepRenderer(guide, renderer, sessionId, pageUrl) {
     this.activeRenderers.add(renderer);
+    this.activeByGuideId.set(guide.guideId, renderer);
     const onClose = () => {
       renderer.destroy();
       this.activeRenderers.delete(renderer);
+      if (this.activeByGuideId.get(guide.guideId) === renderer) {
+        this.activeByGuideId.delete(guide.guideId);
+      }
     };
     const onInteraction = (event) => {
       this.handleInteraction(guide, sessionId, pageUrl, event);
@@ -2195,11 +2966,15 @@ var GuidesController = class {
     const onTrack = (eventName, properties) => {
       this.client.track(eventName, properties);
     };
+    const onFormSubmit = (answers) => this.submitFormResponse(guide.guideId, answers);
     try {
-      void renderer.render({ guide, onInteraction, onClose, onTrack });
+      void renderer.render({ guide, onInteraction, onClose, onTrack, onFormSubmit });
     } catch (err) {
       if (this.debug) console.error("[veo] renderer.render threw:", err);
       this.activeRenderers.delete(renderer);
+      if (this.activeByGuideId.get(guide.guideId) === renderer) {
+        this.activeByGuideId.delete(guide.guideId);
+      }
     }
   }
   /**
@@ -2431,10 +3206,40 @@ var GuidesController = class {
         return new TooltipRenderer();
       case "custom":
         return new CustomRenderer();
+      case "inline":
+        return new InlineRenderer();
+      case "inline-custom":
+        return new InlineCustomRenderer();
+      case "form":
+        return new FormRenderer();
+      case "inline-form":
+        return new InlineFormRenderer();
       case "walkthrough":
         return null;
     }
   }
+  /**
+   * Envía las respuestas de una guía `form` al backend, que las mergea como
+   * propiedades del usuario. Usa el endUserId actual (o el anónimo si aún no
+   * hubo identify — el backend pre-crea la fila igual que identify).
+   */
+  async submitFormResponse(guideId, answers) {
+    const endUserId = this.client.getEndUserId() ?? this.client.getAnonymousId();
+    try {
+      const res = await fetch(`${this.apiUrl}/v1/guides/${guideId}/form-response`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json", "X-Api-Key": this.apiKey },
+        body: JSON.stringify({ endUserId, answers })
+      });
+      if (!res.ok && this.debug) {
+        console.warn("[veo] form-response respondi\xF3", res.status);
+      }
+      return res.ok;
+    } catch (err) {
+      if (this.debug) console.warn("[veo] form-response fall\xF3:", err);
+      return false;
+    }
+  }
 };
 function extractPath(url) {
   try {
@@ -2444,6 +3249,283 @@ function extractPath(url) {
   }
 }
 
+// src/plugins/guides/guide-preview.ts
+var PREVIEW_GUIDE_ID = "__veo_preview__";
+var GuidePreviewController = class {
+  constructor() {
+    this.singleStep = null;
+    this.walkthrough = null;
+    this.walkthroughGuide = null;
+    this.walkthroughIndex = 0;
+    /** Input de la preview ACTIVA (para formSubmit/nota de forms). */
+    this.input = null;
+  }
+  preview(input) {
+    this.close();
+    this.input = input;
+    const guide = normalize(input);
+    const start = typeof input.startStepIndex === "number" ? input.startStepIndex : 0;
+    const ready = guide.guideType === "walkthrough" ? this.startWalkthrough(guide, start) : this.renderSingleStep(guide);
+    return { close: () => this.close(), ready };
+  }
+  close() {
+    if (this.singleStep) {
+      safeDestroy(this.singleStep);
+      this.singleStep = null;
+    }
+    if (this.walkthrough) {
+      safeDestroy(this.walkthrough);
+      this.walkthrough = null;
+    }
+    this.walkthroughGuide = null;
+    this.walkthroughIndex = 0;
+    this.input = null;
+  }
+  async renderSingleStep(guide) {
+    const renderer = createSingleStepRenderer(guide.guideType);
+    if (!renderer) return { rendered: false };
+    this.singleStep = renderer;
+    let shown = false;
+    try {
+      await renderer.render({
+        guide,
+        onInteraction: (event) => {
+          if (event.action === "shown") shown = true;
+        },
+        onClose: () => this.close(),
+        onTrack: () => {
+        },
+        // Preview de forms: por defecto simula el envío SIN escribir props;
+        // el caller puede pasar `formSubmit` real (link de preview).
+        onFormSubmit: this.input?.formSubmit ?? (() => Promise.resolve(true)),
+        isPreview: true,
+        ...this.input?.formSubmit && this.input.formSubmitNote !== void 0 ? { previewNote: this.input.formSubmitNote } : {}
+      });
+    } catch {
+      this.close();
+      return { rendered: false };
+    }
+    if (this.singleStep !== renderer) {
+      safeDestroy(renderer);
+      return { rendered: false };
+    }
+    return { rendered: shown };
+  }
+  async startWalkthrough(guide, startIndex = 0) {
+    if (guide.guideSteps.length === 0) return { rendered: false };
+    this.walkthroughGuide = guide;
+    const idx = Math.min(Math.max(0, Math.floor(startIndex)), guide.guideSteps.length - 1);
+    this.walkthroughIndex = idx;
+    const rendered = await this.renderWalkthroughStep(idx);
+    return { rendered };
+  }
+  async renderWalkthroughStep(index) {
+    const guide = this.walkthroughGuide;
+    if (!guide) return false;
+    if (this.walkthrough) {
+      safeDestroy(this.walkthrough);
+      this.walkthrough = null;
+    }
+    const renderer = new WalkthroughRenderer();
+    const callbacks = {
+      onNext: () => {
+        const next = this.walkthroughIndex + 1;
+        if (next >= guide.guideSteps.length) {
+          this.close();
+          return;
+        }
+        this.walkthroughIndex = next;
+        void this.renderWalkthroughStep(next);
+      },
+      onBack: () => {
+        const prev = this.walkthroughIndex - 1;
+        if (prev < 0) return;
+        this.walkthroughIndex = prev;
+        void this.renderWalkthroughStep(prev);
+      },
+      onSkip: () => this.close(),
+      onComplete: () => this.close()
+    };
+    let success = false;
+    try {
+      success = await renderer.render({ guide, currentStepIndex: index, callbacks });
+    } catch {
+      success = false;
+    }
+    if (!success || this.walkthroughGuide !== guide) {
+      safeDestroy(renderer);
+      return false;
+    }
+    this.walkthrough = renderer;
+    return true;
+  }
+};
+var activeController = null;
+function previewGuide(input) {
+  if (!hasDocument()) {
+    return { close: () => {
+    }, ready: Promise.resolve({ rendered: false }) };
+  }
+  if (!activeController) activeController = new GuidePreviewController();
+  return activeController.preview(input);
+}
+function closeGuidePreview() {
+  activeController?.close();
+}
+function normalize(input) {
+  const selector = input.activationRules?.selector;
+  const activationRules = {
+    url: input.activationRules?.url ?? { type: "prefix", pattern: "/" },
+    trigger: "immediate",
+    ...selector !== void 0 ? { selector } : {}
+  };
+  return {
+    guideId: PREVIEW_GUIDE_ID,
+    guideName: input.guideName ?? "Preview",
+    guideType: input.guideType,
+    guideSteps: input.guideSteps,
+    activationRules,
+    displayFrequency: "always",
+    displayPriority: 0
+  };
+}
+function createSingleStepRenderer(type) {
+  switch (type) {
+    case "modal":
+      return new ModalRenderer();
+    case "banner":
+      return new BannerRenderer();
+    case "tooltip":
+      return new TooltipRenderer();
+    case "custom":
+      return new CustomRenderer();
+    case "inline":
+      return new InlineRenderer();
+    case "inline-custom":
+      return new InlineCustomRenderer();
+    case "form":
+      return new FormRenderer();
+    case "inline-form":
+      return new InlineFormRenderer();
+    case "walkthrough":
+      return null;
+  }
+}
+function safeDestroy(renderer) {
+  try {
+    renderer.destroy();
+  } catch {
+  }
+}
+
+// src/plugins/guides/preview-mode.ts
+var active = null;
+async function runPreviewMode(opts) {
+  if (!hasDocument()) return null;
+  active?.teardown();
+  let guide = null;
+  try {
+    const res = await fetch(`${opts.apiUrl}/v1/guides/preview-resolve`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json", "X-Api-Key": opts.apiKey },
+      body: JSON.stringify({ token: opts.token })
+    });
+    if (res.ok) {
+      const data = await res.json();
+      guide = data.guide ?? null;
+    } else if (opts.debug) {
+      console.warn("[veo] preview-resolve respondi\xF3", res.status);
+    }
+  } catch (err) {
+    if (opts.debug) console.warn("[veo] preview-resolve fall\xF3:", err);
+  }
+  const submitToBackend = async (answers) => {
+    if (!guide) return false;
+    const veo = window.veo;
+    const endUserId = veo?.getEndUserId?.() ?? veo?.getAnonymousId?.() ?? null;
+    if (!endUserId) return false;
+    try {
+      const res = await fetch(`${opts.apiUrl}/v1/guides/${guide.guideId}/form-response`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json", "X-Api-Key": opts.apiKey },
+        body: JSON.stringify({ endUserId, answers })
+      });
+      return res.ok;
+    } catch {
+      return false;
+    }
+  };
+  let preview = null;
+  const show = () => {
+    if (!guide) return;
+    preview?.close();
+    preview = previewGuide({
+      guideType: guide.guideType,
+      guideSteps: guide.guideSteps,
+      activationRules: guide.activationRules,
+      guideName: guide.guideName,
+      formSubmit: submitToBackend,
+      formSubmitNote: "Vista previa: guardado en TU usuario para probar el flujo."
+    });
+  };
+  const chip = mountChip({
+    label: guide ? `Vista previa: ${guide.guideName}` : "Link de preview inv\xE1lido o vencido",
+    error: !guide,
+    onReshow: guide ? show : null,
+    onClose: () => handle.teardown()
+  });
+  const handle = {
+    teardown() {
+      preview?.close();
+      preview = null;
+      chip.remove();
+      if (active === handle) active = null;
+    }
+  };
+  active = handle;
+  show();
+  return handle;
+}
+function mountChip(opts) {
+  const host = document.createElement("div");
+  host.setAttribute("data-veo-preview-chip", "");
+  const root = host.attachShadow({ mode: "open" });
+  const style = document.createElement("style");
+  style.textContent = `
+    .chip { position: fixed; bottom: 16px; right: 16px; z-index: 2147483647;
+      display: flex; align-items: center; gap: 8px; padding: 8px 12px;
+      background: #111827; color: #f9fafb; border-radius: 9999px;
+      font: 500 12px/1.2 system-ui, sans-serif; box-shadow: 0 4px 12px rgba(0,0,0,.25); }
+    .chip.error { background: #7f1d1d; }
+    .label { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+    button { all: unset; cursor: pointer; padding: 2px 6px; border-radius: 9999px;
+      font-size: 12px; line-height: 1; }
+    button:hover { background: rgba(255,255,255,.15); }
+  `;
+  root.appendChild(style);
+  const chip = document.createElement("div");
+  chip.className = opts.error ? "chip error" : "chip";
+  const label = document.createElement("span");
+  label.className = "label";
+  label.textContent = opts.label;
+  chip.appendChild(label);
+  if (opts.onReshow) {
+    const reshow = document.createElement("button");
+    reshow.textContent = "\u21BB";
+    reshow.title = "Volver a mostrar la gu\xEDa";
+    reshow.addEventListener("click", opts.onReshow);
+    chip.appendChild(reshow);
+  }
+  const close = document.createElement("button");
+  close.textContent = "\u2715";
+  close.title = "Salir de la vista previa";
+  close.addEventListener("click", opts.onClose);
+  chip.appendChild(close);
+  root.appendChild(chip);
+  document.body.appendChild(host);
+  return { remove: () => host.remove() };
+}
+
 // src/plugins/guides/index.ts
 function guidesPlugin(config) {
   return definePlugin({
@@ -2458,79 +3540,45 @@ function guidesPlugin(config) {
       client.on("pageview", ({ url, sessionId }) => {
         void controller.checkGuides(url, sessionId);
       });
-    }
-  });
-}
-
-// src/plugins/spa-router.ts
-function spaRouterPlugin() {
-  return definePlugin({
-    name: "spa-router",
-    install(client) {
-      if (!hasWindow()) return;
-      client.pageview();
-      const fire = () => {
-        queueMicrotask(() => client.pageview());
-      };
-      const origPushState = window.history.pushState;
-      const origReplaceState = window.history.replaceState;
-      window.history.pushState = function(...args) {
-        origPushState.apply(this, args);
-        fire();
-      };
-      window.history.replaceState = function(...args) {
-        origReplaceState.apply(this, args);
-        fire();
-      };
-      window.addEventListener("popstate", fire);
-      window.addEventListener("hashchange", fire);
+      void controller.checkGuides(window.location.href, client.getSessionId());
     }
   });
 }
 
 // src/index.ts
 function init(config) {
-  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.guides === true) {
-    client.use(
-      guidesPlugin({
-        apiUrl: config.apiUrl,
+  return setupClient(config, (client) => {
+    const previewToken = getPreviewToken();
+    if (config.guides === true && !isBuilderMode() && previewToken === null) {
+      client.use(
+        guidesPlugin({
+          apiUrl: config.apiUrl,
+          apiKey: config.apiKey,
+          ...config.debug !== void 0 ? { debug: config.debug } : {}
+        })
+      );
+    }
+    if (previewToken !== null) {
+      void runPreviewMode({
         apiKey: config.apiKey,
+        apiUrl: config.apiUrl,
+        token: previewToken,
         ...config.debug !== void 0 ? { debug: config.debug } : {}
-      })
-    );
-  }
-  if (typeof window !== "undefined") {
-    const stub = window.veo;
-    const pending = stub?._q ?? [];
-    window.veo = client;
-    for (const entry of pending) {
-      const [method, args] = entry;
-      if (method === "init") continue;
-      const fn = client[method];
-      if (typeof fn === "function") {
-        try {
-          fn.apply(client, Array.from(args));
-        } catch (err) {
-          if (config.debug) console.error("[veo] drain error:", err);
-        }
-      }
+      });
     }
-  }
-  return client;
+    client.preview = previewGuide;
+    client.closePreview = closeGuidePreview;
+  });
 }
 
 exports.Client = Client;
 exports.SDK_VERSION = SDK_VERSION;
 exports.autocapturePlugin = autocapturePlugin;
+exports.closeGuidePreview = closeGuidePreview;
 exports.definePlugin = definePlugin;
 exports.guidesPlugin = guidesPlugin;
 exports.init = init;
+exports.previewGuide = previewGuide;
 exports.spaRouterPlugin = spaRouterPlugin;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map