@magicfeedback/popup-sdk 1.9.0 → 1.11.0

package/dist/index.mjs

@@ -21,7 +21,7 @@ import {
   sdkWarn,
   setLogger,
   style_default
-} from "./chunk-MTV7T4OW.mjs";
+} from "./chunk-GXEPYT33.mjs";
 
 // src/types/index.ts
 var POPUP_TRIGGER_CONDITION_STATUSES = [
@@ -254,7 +254,7 @@ function trimmedOrNull(value) {
 }
 function buildSurveyHtml(opts) {
   const env = opts.env === "development" ? "dev" : "prod";
-  const version = opts.version ?? "2.2.22";
+  const version = opts.version ?? "2.2.31";
   const cdn = `https://cdn.jsdelivr.net/npm/@magicfeedback/native@${version}/dist/magicfeedback-sdk.browser.js`;
   const sid = jsonForScript(opts.surveyId);
   const pid = jsonForScript(opts.productId);
@@ -592,11 +592,25 @@ ${customCss}
 ${PRIMARY_COLOR_JS}
 ${BUSY_JS}
 ${REVEAL_JS}
+  // Foco en la primera pregunta si es de escribir. Al navegar lo pone @magicfeedback/native
+  // (autofocus:'navigation'); la apertura la decide el popup, que es quien sabe cu\xE1ndo se revela.
+  // Necesita el popup revelado y el survey cargado, que llegan en cualquier orden, y solo con
+  // rat\xF3n o trackpad: en t\xE1ctil sacar\xEDa el teclado sin que el usuario haya tocado nada.
+  var ddRevealed=false, ddSurveyLoaded=false, ddOpenFocusDone=false;
+  function ddAutofocusOnOpen(){
+    if(ddOpenFocusDone || !ddRevealed || !ddSurveyLoaded){ return; }
+    ddOpenFocusDone=true;
+    var fine=typeof window.matchMedia==='function' && window.matchMedia('(pointer: fine)').matches;
+    var f=window.DeepdotsForm;
+    if(fine && f && typeof f.focusFirstQuestion==='function'){ f.focusFirstQuestion(); }
+  }
   // El popup se ense\xF1a cuando el survey est\xE1 pintado; \`ready\` deja al host abrir su propio
   // Modal en ese momento en vez de montar un WebView en blanco.
   var ddReveal=ddCreateReveal(popup, function(){
     document.body.classList.add('dd-ready');
     emitJSON('ready');
+    ddRevealed=true;
+    ddAutofocusOnOpen();
   }, ${REVEAL_TIMEOUT_MS});
 
   function setLoading(isLoading){
@@ -634,10 +648,18 @@ ${REVEAL_JS}
         // textContent, as\xED que el mensaje de la plataforma (HTML con imagen) no se ver\xEDa, y su
         // fallback es un literal gen\xE9rico que ignora style.successMessage.
         addSuccessScreen:false,
+        // Surveys multi-idioma: native pide a la API este idioma (el del init o el del
+        // dispositivo); si el survey no lo tiene, la API sirve el idioma por defecto.
+        lang:${initLangJson}||undefined,
+        // Foco en la primera pregunta de escribir tras Start, Siguiente o Atr\xE1s. Las versiones
+        // de native sin esta opci\xF3n la ignoran.
+        autofocus:'navigation',
         onLoadedEvent:function(args){
-          // Idioma del survey: manda sobre el del init para que el chrome no se quede en
-          // ingl\xE9s delante de un survey traducido.
-          var langs=args && args.formData ? args.formData.lang : null;
+          // Idioma en el que native muestra el survey: manda sobre el del init para que el
+          // chrome no se quede en ingl\xE9s delante de un survey traducido. Native < 2.3 no lo
+          // env\xEDa: entonces el primero de formData.lang (el idioma por defecto).
+          var shown=args && typeof args.lang==='string' && args.lang.trim() ? args.lang : null;
+          var langs=shown ? [shown] : (args && args.formData ? args.formData.lang : null);
           if(langs && langs.length){
             for(var li=0;li<langs.length;li++){
               if(typeof langs[li]==='string' && langs[li].trim()){ ddApplyLabels(langs[li]); break; }
@@ -691,6 +713,8 @@ ${REVEAL_JS}
           updateProgress({ progress:form.progress, total:form.total, completed:false, followup:false });
           emitJSON('loaded');
           setLoading(false);
+          // La primera carga es la apertura; las siguientes (tras Start) las enfoca native.
+          if(!ddSurveyLoaded){ ddSurveyLoaded=true; ddAutofocusOnOpen(); }
         },
         beforeSubmitEvent:function(){
           setLoading(true);
@@ -841,6 +865,7 @@ var ReactNativePopupRenderer = class {
         this.emitReady(surveyId);
         break;
       case "loaded":
+        break;
       case "before_submit":
       case "after_submit":
       case "back":
@@ -868,7 +893,7 @@ function createReactNativeRenderer() {
 }
 
 // src/ui/preload.ts
-var defaultLoader = () => import("./renderPopup-LEGTSBLD.mjs");
+var defaultLoader = () => import("./renderPopup-KSZJ5AN4.mjs");
 var pending = null;
 function preloadRenderPopup(loader = defaultLoader) {
   if (pending) return pending;
@@ -941,7 +966,7 @@ var BrowserPopupRenderer = class {
     if (!this.container) return;
     this.visible = true;
     const container = this.container;
-    void import("./renderPopup-LEGTSBLD.mjs").then(({ renderPopup }) => {
+    void import("./renderPopup-KSZJ5AN4.mjs").then(({ renderPopup }) => {
       renderPopup(container, surveyId, productId, actions, emit, onClose, env, userId, style, sessionId, miniService, analyticsFeedbackSessionId, options);
     });
   }
@@ -1216,7 +1241,7 @@ async function safeBodyText(res) {
   }
 }
 function createFeedbackSink(options) {
-  let feedbackSessionId;
+  let feedbackSessionId = options.initialSessionId || void 0;
   let firstPostInFlight = null;
   let generation = 0;
   const url = `${options.baseUrl}/sdk/feedback`;
@@ -1309,6 +1334,50 @@ function createFeedbackSink(options) {
   };
 }
 
+// src/analytics/suspended-session.ts
+var SUSPENDED_SESSION_KEY = "deepdots.analytics.suspended";
+function getSessionStorage() {
+  try {
+    return typeof window !== "undefined" && window.sessionStorage ? window.sessionStorage : null;
+  } catch {
+    return null;
+  }
+}
+function writeSuspendedSession(storage, session) {
+  try {
+    storage.setItem(SUSPENDED_SESSION_KEY, JSON.stringify(session));
+    return true;
+  } catch {
+    return false;
+  }
+}
+function clearSuspendedSession(storage) {
+  try {
+    storage.removeItem(SUSPENDED_SESSION_KEY);
+  } catch {
+  }
+}
+function takeSuspendedSession(storage, match, now, windowMs) {
+  let raw = null;
+  try {
+    raw = storage.getItem(SUSPENDED_SESSION_KEY);
+  } catch {
+    return null;
+  }
+  if (!raw) return null;
+  clearSuspendedSession(storage);
+  try {
+    const s = JSON.parse(raw);
+    if (typeof s.sessionId !== "string" || !s.sessionId) return null;
+    if (typeof s.at !== "number" || now - s.at < 0 || now - s.at > windowMs) return null;
+    if (s.integration !== match.integration) return null;
+    if ((s.userId ?? null) !== match.userId) return null;
+    return { sessionId: s.sessionId, integration: s.integration, userId: s.userId ?? null, at: s.at };
+  } catch {
+    return null;
+  }
+}
+
 // src/tracking/navigation-observer.ts
 var UUID_PREFIX = /^[0-9a-f]{8}-[0-9a-f]{4}-/i;
 function screenPath(href) {
@@ -1903,8 +1972,10 @@ var ANALYTICS_HEARTBEAT_MS = 5 * 6e4;
 var ANALYTICS_SESSION_TIMEOUT_MS = 30 * 6e4;
 var ANALYTICS_SERVER_IDLE_MS = 60 * 6e4;
 var ANALYTICS_SESSION_DISCARD_MS = ANALYTICS_SERVER_IDLE_MS - 10 * 6e4;
+var ANALYTICS_RESUME_WINDOW_MS = 6e4;
 var RESERVED_EVENT_PREFIX = "deepdots_";
 var CUSTOM_EVENT_PREFIX = "deepdots_event_";
+var MAX_PENDING_TRIGGERS = 20;
 var DeepdotsPopups = class {
   constructor() {
     this.config = null;
@@ -1918,6 +1989,14 @@ var DeepdotsPopups = class {
     // deprecated: mantenido para compatibilidad interna
     this.popupDefinitions = [];
     this.popupsLoaded = false;
+    /**
+     * `true` mientras el `GET /sdk/{apiKey}/popups` de `init()` está en vuelo. En esa ventana los
+     * disparos del host (`triggerEvent`, `triggerSurvey`) no tienen contra qué evaluarse, así que
+     * se guardan en `pendingTriggers` y se reproducen al cargar. Click, scroll, time y exit no
+     * hacen falta: son listeners que `autoLaunch` instala ya con las definiciones cargadas.
+     */
+    this.awaitingPopups = false;
+    this.pendingTriggers = [];
     this.pendingAutoLaunch = false;
     // Estado que alimenta las reglas de redisplay. Copia de trabajo en memoria; la fuente
     // duradera es el storage (`popup-state-store`), rehidratada en `init()` — sin eso, una
@@ -1972,6 +2051,13 @@ var DeepdotsPopups = class {
     this.lastEngagementAt = 0;
     /** Cuándo se ocultó la pestaña por última vez (ms epoch); null si está visible. */
     this.hiddenAt = null;
+    /**
+     * Sesión suspendida por un `pagehide` (ms epoch y `deepdots_user_id`); null si no hay.
+     * `openSession` la reanuda si sigue a tiempo (ver ANALYTICS_RESUME_WINDOW_MS).
+     */
+    this.suspended = null;
+    /** Integración de analytics del init: la sesión suspendida solo la hereda la misma. */
+    this.analyticsIntegration = void 0;
     /**
      * Idioma resuelto en init() (explícito > navigator.language > Intl). Única fuente de
      * verdad para el context de analytics Y para la segmentación por idioma de los popups.
@@ -2031,10 +2117,17 @@ var DeepdotsPopups = class {
       }
     }
     this.log("tracking \xB7 user_id:", this.tracking.getUserId(), "\xB7 new_user:", this.tracking.isNewUser(), "\xB7 enabled:", this.tracking.isTrackingEnabled());
+    this.analyticsIntegration = config.analytics?.integration;
+    const resumable = this.readResumableSession();
+    if (resumable) {
+      this.analyticsFeedbackSessionId = resumable.sessionId;
+      this.suspended = { at: resumable.at, userId: resumable.userId };
+    }
     const analyticsSink = config.analytics ? createFeedbackSink({
       baseUrl: this.baseUrl,
       keys: config.analytics,
       log: (...a) => this.log(...a),
+      initialSessionId: resumable?.sessionId,
       onSessionId: (id) => {
         this.analyticsFeedbackSessionId = id;
         this.notifyFeedbackSession(id, "open");
@@ -2084,6 +2177,9 @@ var DeepdotsPopups = class {
     this.engagement = new EngagementTracker();
     this.setupAnalyticsFlush();
     this.openSession();
+    if (resumable && this.analyticsFeedbackSessionId === resumable.sessionId) {
+      this.notifyFeedbackSession(resumable.sessionId, "open");
+    }
     const pendingCrashes = this.crashReporter.drainPendingCrashes();
     if (this.tracking?.isTrackingEnabled()) {
       for (const rec of pendingCrashes) {
@@ -2094,8 +2190,10 @@ var DeepdotsPopups = class {
     this.log("SDK initialized", this.config);
     if (this.renderer.init) this.renderer.init();
     this.setupPopupContainer();
+    this.awaitingPopups = Boolean(this.config.apiKey && this.baseUrl);
     this.fetchPopupsFromServer().then((defs) => {
-      this.popupDefinitions = this.validatePopupDefinitions(defs);
+      if (!defs) this.dropPendingTriggers();
+      this.popupDefinitions = this.validatePopupDefinitions(defs ?? []);
       this.popupsLoaded = true;
       this.log("Popups loaded from API", this.popupDefinitions);
       if (this.popupDefinitions.length) this.renderer.preload?.();
@@ -2104,6 +2202,7 @@ var DeepdotsPopups = class {
       if (this.pendingAutoLaunch) {
         this.startTriggers();
       }
+      this.replayPendingTriggers();
     });
   }
   /** User id actual (generado por el SDK o provisto por el cliente). Null si tracking off. */
@@ -2332,9 +2431,15 @@ var DeepdotsPopups = class {
   openSession() {
     if (this.sessionOpen) return;
     if (!this.tracking?.isTrackingEnabled()) return;
+    const suspendedMs = this.takeSuspendedSession();
     this.sessionOpen = true;
     this.lastEngagementAt = Date.now();
-    this.track("deepdots_session_start", {});
+    if (suspendedMs === null) {
+      this.track("deepdots_session_start", {});
+    } else {
+      this.track("deepdots_session_resume", { suspended_ms: suspendedMs });
+      this.log("tracking \xB7 session resumed after", suspendedMs, "ms:", this.analyticsFeedbackSessionId);
+    }
     this.navObserver?.restart();
     if (this.isDocumentVisible()) this.engagement?.resume();
   }
@@ -2399,6 +2504,75 @@ var DeepdotsPopups = class {
     }
     this.openSession();
   }
+  /**
+   * `pagehide` en web: SUSPENDE la sesión en vez de cerrarla, porque el navegador lo lanza
+   * igual al recargar que al cerrar la pestaña. Vuelca lo pendiente (page_view de la
+   * pantalla, mini-services, engagement) con un `deepdots_session_suspend` y SIN
+   * `completed`, y deja el registro en `sessionStorage` (ver `suspended-session.ts`):
+   *  - si la página vuelve a cargar en esta pestaña, `init()` sigue en el mismo registro;
+   *  - si la pestaña se cerró, el backend lo cierra a los pocos minutos sin otro lote.
+   *
+   * Devuelve false cuando no se puede suspender — aún no se conoce el registro (el primer
+   * POST sigue en vuelo) o no hay `sessionStorage` — y entonces el caller cierra como antes.
+   */
+  suspendSession() {
+    if (!this.sessionOpen || !this.tracking?.isTrackingEnabled()) return false;
+    const sessionId = this.analyticsFeedbackSessionId;
+    const integration = this.analyticsIntegration;
+    const storage = getSessionStorage();
+    if (!sessionId || !integration || !storage) return false;
+    const at = Date.now();
+    const userId = this.tracking.getUserId();
+    if (!writeSuspendedSession(storage, { sessionId, integration, userId, at })) return false;
+    this.sessionOpen = false;
+    this.suspended = { at, userId };
+    this.navObserver?.stop();
+    this.navStarted = false;
+    this.analytics?.exitAllMiniServices();
+    this.flushEngagement();
+    this.engagement?.pause();
+    this.track("deepdots_session_suspend", { reason: "page_hide" });
+    this.flushAnalytics({ final: true });
+    this.log("tracking \xB7 session suspended:", sessionId);
+    return true;
+  }
+  /**
+   * Recoge la sesión que dejó suspendida la carga anterior de esta pestaña (ver
+   * `suspendSession`). Solo con analytics configurado y el tracking activo: sin ellos no hay
+   * registro en el que seguir.
+   */
+  readResumableSession() {
+    const integration = this.analyticsIntegration;
+    const storage = getSessionStorage();
+    if (!integration || !storage || !this.tracking?.isTrackingEnabled()) return null;
+    return takeSuspendedSession(
+      storage,
+      { integration, userId: this.tracking.getUserId() },
+      Date.now(),
+      ANALYTICS_RESUME_WINDOW_MS
+    );
+  }
+  /**
+   * Consume la sesión suspendida al abrir: los ms que estuvo suspendida si se puede seguir en
+   * ella (mismo usuario, dentro de ANALYTICS_RESUME_WINDOW_MS); null si no había o ya no toca.
+   * En ese caso se olvida su registro sin enviar nada: lo cierra el backend, y la sesión que
+   * se abre ahora va a uno nuevo.
+   */
+  takeSuspendedSession() {
+    const suspended = this.suspended;
+    if (!suspended) return null;
+    this.suspended = null;
+    const storage = getSessionStorage();
+    if (storage) clearSuspendedSession(storage);
+    const suspendedMs = Math.max(0, Date.now() - suspended.at);
+    if (this.analyticsFeedbackSessionId && suspendedMs <= ANALYTICS_RESUME_WINDOW_MS && suspended.userId === (this.tracking?.getUserId() ?? null)) {
+      return suspendedMs;
+    }
+    this.analytics?.discardSession(this.analyticsIdentity());
+    this.analyticsFeedbackSessionId = void 0;
+    this.tracking?.setSessionId(null);
+    return null;
+  }
   /** Olvida la sesión abierta sin enviar nada (ver onDocumentVisible). */
   discardSession() {
     this.sessionOpen = false;
@@ -2447,7 +2621,7 @@ var DeepdotsPopups = class {
     if (typeof document === "undefined" || typeof window === "undefined") return;
     window.addEventListener("pagehide", () => {
       clearInterval(this.analyticsFlushTimer);
-      this.closeSession("page_hide");
+      if (!this.suspendSession()) this.closeSession("page_hide");
     });
     window.addEventListener("pageshow", (event) => {
       if (!event.persisted) return;
@@ -2515,6 +2689,7 @@ var DeepdotsPopups = class {
   }
   /** Lógica para evaluar condiciones antes de mostrar una encuesta */
   triggerSurvey(surveyId, popupId) {
+    if (this.bufferIfAwaitingPopups({ kind: "survey", surveyId, popupId })) return;
     const def = this.findPopupDefinition(surveyId, popupId);
     if (!def) {
       this.debug("No popup definition for trigger", { surveyId, popupId });
@@ -2536,6 +2711,10 @@ var DeepdotsPopups = class {
       this.debug("Ignoring empty event trigger name");
       return;
     }
+    if (this.bufferIfAwaitingPopups({ kind: "event", name: normalized })) return;
+    this.evaluateEvent(normalized);
+  }
+  evaluateEvent(normalized) {
     const candidates = this.popupDefinitions.filter((def) => {
       return def.triggers.some((trigger) => {
         const triggerValue = String(trigger.value ?? "").trim();
@@ -2553,6 +2732,40 @@ var DeepdotsPopups = class {
     }
     this.showDefinition(matched);
   }
+  /**
+   * Guarda `trigger` si las definiciones aún no han llegado. Devuelve `true` si lo guardó (el
+   * llamador no debe evaluarlo ahora) y `false` si no hay carga en vuelo (se evalúa ya, como
+   * siempre: tras cargar, tras un fallo o sin apiKey).
+   */
+  bufferIfAwaitingPopups(trigger) {
+    if (!this.awaitingPopups) return false;
+    if (this.pendingTriggers.length >= MAX_PENDING_TRIGGERS) {
+      const dropped = this.pendingTriggers.shift();
+      this.debug("Pending trigger buffer full; dropped oldest", dropped);
+    }
+    this.pendingTriggers.push(trigger);
+    this.debug("Popups not loaded yet; trigger buffered", trigger);
+    return true;
+  }
+  /** La carga falló: sin definiciones no hay nada que reproducir, se descarta todo. */
+  dropPendingTriggers() {
+    const dropped = this.pendingTriggers.length;
+    this.awaitingPopups = false;
+    this.pendingTriggers = [];
+    if (dropped > 0) this.debug("Popups failed to load; dropped pending triggers", dropped);
+  }
+  /** Reproduce en orden por la evaluación normal (segmentos, cooldowns y condiciones de AHORA). */
+  replayPendingTriggers() {
+    this.awaitingPopups = false;
+    const replay = this.pendingTriggers;
+    this.pendingTriggers = [];
+    if (!replay.length) return;
+    this.debug("Replaying triggers received before popups loaded", replay.length);
+    replay.forEach((trigger) => {
+      if (trigger.kind === "event") this.evaluateEvent(trigger.name);
+      else this.triggerSurvey(trigger.surveyId, trigger.popupId);
+    });
+  }
   showDefinition(def) {
     this.log("Showing popup (definition)", def);
     this.surveyToPopupId.set(def.surveyId, def.id);
@@ -2823,7 +3036,7 @@ var DeepdotsPopups = class {
     } catch {
     }
   }
-  /** Fetch al servidor para obtener popups */
+  /** Fetch al servidor para obtener popups. `null` si la carga falló (red, no-2xx, payload inválido). */
   async fetchPopupsFromServer() {
     const apiKey = this.config?.apiKey;
     const baseUrl = this.baseUrl;
@@ -2839,19 +3052,19 @@ var DeepdotsPopups = class {
       const response = await fetch(endpoint);
       if (!response.ok) {
         this.log("Failed to fetch popups", response.status, response.statusText);
-        return [];
+        return null;
       }
       const raw = await response.text();
       const parsed = JSON.parse(raw);
       if (!Array.isArray(parsed)) {
         this.log("Unexpected popups payload", parsed);
-        return [];
+        return null;
       }
       this.debug("Fetched popups payload", parsed);
       return parsed;
     } catch (error) {
       this.log("Error fetching popups", error);
-      return [];
+      return null;
     }
   }
   /** Envía los atributos de contact a la API (`POST /sdk/popups/contact`). */
@@ -2971,7 +3184,7 @@ var DeepdotsPopups = class {
     }
     if (!this.popupContainer) return;
     const container = this.popupContainer;
-    void import("./renderPopup-LEGTSBLD.mjs").then(({ renderPopup }) => {
+    void import("./renderPopup-KSZJ5AN4.mjs").then(({ renderPopup }) => {
       renderPopup(
         container,
         surveyId,