@magicfeedback/popup-sdk 1.8.0 → 1.8.2

package/dist/react-native.d.mts

@@ -507,12 +507,14 @@ declare class DeepdotsPopups {
      * se llama en init(), al volver a foreground y al conceder el consentimiento.
      */
     private openSession;
+    /** Web: si la pestaña se ve. Sin `document` (RN) manda AppState vía onForeground/onBackground. */
+    private isDocumentVisible;
     /** Payload que se ENVIARÍA al endpoint de analytics (no envía ni vacía el buffer). */
     previewAnalytics(): AnalyticsEnvelope;
     /**
      * Envía el lote acumulado de analytics y vacía el buffer.
-     * `final: true` (cierre de página/app) cambia el transporte a `sendBeacon`, que sobrevive
-     * al unload; un lote que falle por red o 5xx se re-encola para el siguiente flush.
+     * `final: true` (cierre de página/app): el lote no espera al primer POST en vuelo, porque
+     * el documento se muere; un lote que falle por red o 5xx se re-encola para el siguiente flush.
      */
     flushAnalytics(options?: {
         final?: boolean;
@@ -523,6 +525,7 @@ declare class DeepdotsPopups {
     private analyticsIdentity;
     /** Flush automático al ocultar/cerrar la página (no perder el lote pendiente). */
     private setupAnalyticsFlush;
+    private startAnalyticsFlushTimer;
     /** Enable auto-launch functionality with configured triggers */
     autoLaunch(): void;
     /** Inicia los triggers configurados */
@@ -602,11 +605,18 @@ declare class DeepdotsPopups {
     private mapPopupTriggerType;
     private markSurveyProgress;
     /**
-     * Rehidrata el estado de redisplay desde el storage. `answeredSurveys` se reconstruye
-     * desde las entradas COMPLETED: es exactamente lo que persiste `markSurveyAnswered`.
+     * Fusiona el estado de redisplay del storage con el de memoria: por cada popup/survey gana
+     * la entrada MÁS RECIENTE. Fusionar y no sustituir es lo que hace convivir a varias
+     * pestañas sobre el mismo `localStorage`: se llama en el `init()`, antes de cada decisión
+     * de mostrar y antes de cada escritura. `answeredSurveys` se reconstruye desde las
+     * entradas COMPLETED: es exactamente lo que persiste `markSurveyAnswered`.
      */
     private loadPopupState;
-    /** Vuelca el estado de redisplay al storage. Sin storage (o bloqueado) degrada a memoria. */
+    /**
+     * Vuelca el estado de redisplay al storage. Sin storage (o bloqueado) degrada a memoria.
+     * Fusiona antes de escribir: escribir solo la foto en memoria borraba lo que otra pestaña
+     * hubiese guardado desde nuestro `init()`.
+     */
     private persistPopupState;
     private isPopupDefinition;
     private isPopupTrigger;

package/dist/react-native.d.ts

@@ -507,12 +507,14 @@ declare class DeepdotsPopups {
      * se llama en init(), al volver a foreground y al conceder el consentimiento.
      */
     private openSession;
+    /** Web: si la pestaña se ve. Sin `document` (RN) manda AppState vía onForeground/onBackground. */
+    private isDocumentVisible;
     /** Payload que se ENVIARÍA al endpoint de analytics (no envía ni vacía el buffer). */
     previewAnalytics(): AnalyticsEnvelope;
     /**
      * Envía el lote acumulado de analytics y vacía el buffer.
-     * `final: true` (cierre de página/app) cambia el transporte a `sendBeacon`, que sobrevive
-     * al unload; un lote que falle por red o 5xx se re-encola para el siguiente flush.
+     * `final: true` (cierre de página/app): el lote no espera al primer POST en vuelo, porque
+     * el documento se muere; un lote que falle por red o 5xx se re-encola para el siguiente flush.
      */
     flushAnalytics(options?: {
         final?: boolean;
@@ -523,6 +525,7 @@ declare class DeepdotsPopups {
     private analyticsIdentity;
     /** Flush automático al ocultar/cerrar la página (no perder el lote pendiente). */
     private setupAnalyticsFlush;
+    private startAnalyticsFlushTimer;
     /** Enable auto-launch functionality with configured triggers */
     autoLaunch(): void;
     /** Inicia los triggers configurados */
@@ -602,11 +605,18 @@ declare class DeepdotsPopups {
     private mapPopupTriggerType;
     private markSurveyProgress;
     /**
-     * Rehidrata el estado de redisplay desde el storage. `answeredSurveys` se reconstruye
-     * desde las entradas COMPLETED: es exactamente lo que persiste `markSurveyAnswered`.
+     * Fusiona el estado de redisplay del storage con el de memoria: por cada popup/survey gana
+     * la entrada MÁS RECIENTE. Fusionar y no sustituir es lo que hace convivir a varias
+     * pestañas sobre el mismo `localStorage`: se llama en el `init()`, antes de cada decisión
+     * de mostrar y antes de cada escritura. `answeredSurveys` se reconstruye desde las
+     * entradas COMPLETED: es exactamente lo que persiste `markSurveyAnswered`.
      */
     private loadPopupState;
-    /** Vuelca el estado de redisplay al storage. Sin storage (o bloqueado) degrada a memoria. */
+    /**
+     * Vuelca el estado de redisplay al storage. Sin storage (o bloqueado) degrada a memoria.
+     * Fusiona antes de escribir: escribir solo la foto en memoria borraba lo que otra pestaña
+     * hubiese guardado desde nuestro `init()`.
+     */
     private persistPopupState;
     private isPopupDefinition;
     private isPopupTrigger;

package/dist/react-native.js

@@ -522,6 +522,29 @@ function ddApplySurveyPrimaryColor(el, style){
   }
 });
 
+// src/ui/busy.ts
+function setSurveyBusy(el, busy) {
+  if (!el) return;
+  el.style.pointerEvents = busy ? "none" : "";
+  el.setAttribute("aria-busy", busy ? "true" : "false");
+  if ("inert" in el) {
+    el.inert = busy;
+  }
+}
+var BUSY_JS;
+var init_busy = __esm({
+  "src/ui/busy.ts"() {
+    "use strict";
+    BUSY_JS = `
+function ddSetSurveyBusy(el, busy){
+  if(!el){ return; }
+  el.style.pointerEvents = busy ? 'none' : '';
+  el.setAttribute('aria-busy', busy ? 'true' : 'false');
+  if('inert' in el){ el.inert = busy; }
+}`;
+  }
+});
+
 // src/assets/style.css
 var style_default;
 var init_style = __esm({
@@ -2964,6 +2987,7 @@ async function renderPopup(container, surveyId, productId, actions, emit, onClos
   revealTimer = setTimeout(reveal, REVEAL_TIMEOUT_MS);
   function setLoading(isLoading) {
     spinnerEl.style.display = isLoading ? "flex" : "none";
+    setSurveyBusy(formWrapper, isLoading);
     if (!isLoading) {
       formHost.style.visibility = "visible";
       revealWhenPainted2();
@@ -3119,6 +3143,7 @@ var init_renderPopup = __esm({
     init_font();
     init_logo();
     init_surveyPalette();
+    init_busy();
     init_logger();
     init_labels();
     init_reveal();
@@ -3338,6 +3363,7 @@ init_font();
 init_labels();
 init_reveal();
 init_surveyPalette();
+init_busy();
 init_style();
 var REVEAL_JS = `
 function ddCreateReveal(popup, onReveal, timeoutMs){
@@ -3557,6 +3583,7 @@ ${customCss}
   var footer=document.getElementById('dd-footer');
   var spinner=document.getElementById('dd-spinner');
   var formHost=document.getElementById('mf');
+  var formWrapper=document.getElementById('dd-form-wrapper');
   var errorHint=document.getElementById('dd-error');
   var backBtn=document.getElementById('dd-back');
   var startBtn=document.getElementById('dd-start');
@@ -3716,6 +3743,7 @@ ${customCss}
   }
 
 ${PRIMARY_COLOR_JS}
+${BUSY_JS}
 ${REVEAL_JS}
   // 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.
@@ -3726,6 +3754,11 @@ ${REVEAL_JS}
 
   function setLoading(isLoading){
     spinner.style.display=isLoading?'flex':'none';
+    // El spinner no tapa el survey (28px en posicion absoluta), asi que sin esto el usuario
+    // puede seguir cambiando de opcion mientras se envia la pagina, y ese cambio ya no viaja
+    // con ella. Se bloquea el wrapper, que es el elemento estable: el div de dentro lo
+    // sustituye @magicfeedback/native por su propio contenedor al generar el survey.
+    ddSetSurveyBusy(formWrapper, isLoading);
     if(!isLoading){
       formHost.style.visibility='visible';
       // Fin de la carga, sea por survey cargado o por error. Entre p\xE1ginas es no-op: la
@@ -4331,14 +4364,7 @@ function createFeedbackSink(options) {
   const post = async (body, final, sessionEnd = false) => {
     const json = JSON.stringify(body);
     const small = json.length <= KEEPALIVE_MAX_BYTES;
-    if (final && options.sendBeaconImpl && small) {
-      const payload = typeof Blob !== "undefined" ? new Blob([json], { type: "application/json" }) : json;
-      if (options.sendBeaconImpl(url, payload)) {
-        options.log?.("[DeepdotsAnalytics] final flush via sendBeacon");
-        return;
-      }
-      options.log?.("[DeepdotsAnalytics] sendBeacon rejected the batch; falling back to fetch");
-    }
+    if (final) options.log?.("[DeepdotsAnalytics] final flush via fetch keepalive");
     const f = options.fetchImpl ?? (typeof fetch !== "undefined" ? fetch : void 0);
     if (!f) {
       options.log?.("[DeepdotsAnalytics] no fetch available; payload not sent", body);
@@ -4348,6 +4374,9 @@ function createFeedbackSink(options) {
       method: "POST",
       headers: { "Content-Type": "application/json" },
       body: json,
+      // La API autentica por `publicKey` en el body y responde `Allow-Origin: *`: una
+      // petición con credenciales fallaría el CORS. Explícito para no depender del default.
+      credentials: "omit",
       // keepalive: el POST sobrevive a la navegación mientras el body sea pequeño.
       ...small ? { keepalive: true } : {}
     });
@@ -4440,6 +4469,15 @@ var NavigationObserver = class {
     this.closeCurrent();
     this.currentScreen = null;
   }
+  /**
+   * Retoma el seguimiento en la pantalla actual tras un `stop()`, cuando se abre una sesión
+   * nueva sin navegar (cambio de usuario, vuelta de la bfcache). No-op si nunca se instaló
+   * (navegación manual por `setScreen`, RN) o si ya hay pantalla en curso.
+   */
+  restart() {
+    if (!this.installed || this.currentScreen != null || typeof window === "undefined") return;
+    this.begin(window.location.href);
+  }
   closeCurrent() {
     if (this.currentScreen == null) return;
     const exit = this.now();
@@ -5083,8 +5121,6 @@ var DeepdotsPopups = class {
       baseUrl: this.baseUrl,
       keys: config.analytics,
       log: (...a) => this.log(...a),
-      // sendBeacon: único transporte que sobrevive al cierre de la página.
-      sendBeaconImpl: typeof navigator !== "undefined" && typeof navigator.sendBeacon === "function" ? (url, body) => navigator.sendBeacon(url, body) : void 0,
       onSessionId: (id) => {
         this.analyticsFeedbackSessionId = id;
       },
@@ -5132,7 +5168,6 @@ var DeepdotsPopups = class {
     this.navObserver.onVisit((v) => this.track("deepdots_page_view", { screen: v.screen, duration_seconds: v.durationSeconds }));
     this.navObserver.install();
     this.engagement = new EngagementTracker();
-    this.engagement.resume();
     this.setupAnalyticsFlush();
     this.openSession();
     const pendingCrashes = this.crashReporter.drainPendingCrashes();
@@ -5351,6 +5386,7 @@ var DeepdotsPopups = class {
     this.navStarted = false;
     this.analytics?.exitAllMiniServices();
     this.flushEngagement();
+    this.engagement?.pause();
     this.track("deepdots_session_end", { reason });
     this.flushAnalytics({ final: reason === "page_hide", sessionEnd: true });
     this.analyticsFeedbackSessionId = void 0;
@@ -5366,6 +5402,12 @@ var DeepdotsPopups = class {
     if (!this.tracking?.isTrackingEnabled()) return;
     this.sessionOpen = true;
     this.track("deepdots_session_start", {});
+    this.navObserver?.restart();
+    if (this.isDocumentVisible()) this.engagement?.resume();
+  }
+  /** Web: si la pestaña se ve. Sin `document` (RN) manda AppState vía onForeground/onBackground. */
+  isDocumentVisible() {
+    return typeof document === "undefined" || document.visibilityState !== "hidden";
   }
   /** Payload que se ENVIARÍA al endpoint de analytics (no envía ni vacía el buffer). */
   previewAnalytics() {
@@ -5378,8 +5420,8 @@ var DeepdotsPopups = class {
   }
   /**
    * Envía el lote acumulado de analytics y vacía el buffer.
-   * `final: true` (cierre de página/app) cambia el transporte a `sendBeacon`, que sobrevive
-   * al unload; un lote que falle por red o 5xx se re-encola para el siguiente flush.
+   * `final: true` (cierre de página/app): el lote no espera al primer POST en vuelo, porque
+   * el documento se muere; un lote que falle por red o 5xx se re-encola para el siguiente flush.
    */
   flushAnalytics(options) {
     if (!this.tracking?.isTrackingEnabled()) return;
@@ -5400,21 +5442,30 @@ var DeepdotsPopups = class {
   /** Flush automático al ocultar/cerrar la página (no perder el lote pendiente). */
   setupAnalyticsFlush() {
     if (typeof document === "undefined" || typeof window === "undefined") return;
-    this.analyticsFlushTimer = setInterval(() => this.flushAnalytics(), ANALYTICS_FLUSH_INTERVAL_MS);
+    this.startAnalyticsFlushTimer();
     window.addEventListener("pagehide", () => {
       clearInterval(this.analyticsFlushTimer);
       this.closeSession("page_hide");
     });
+    window.addEventListener("pageshow", (event) => {
+      if (!event.persisted) return;
+      this.startAnalyticsFlushTimer();
+      this.openSession();
+    });
     document.addEventListener("visibilitychange", () => {
       if (document.visibilityState === "hidden") {
         this.flushEngagement();
         this.engagement?.pause();
         this.flushAnalytics();
       } else if (document.visibilityState === "visible") {
-        this.engagement?.resume();
+        if (this.sessionOpen) this.engagement?.resume();
       }
     });
   }
+  startAnalyticsFlushTimer() {
+    clearInterval(this.analyticsFlushTimer);
+    this.analyticsFlushTimer = setInterval(() => this.flushAnalytics(), ANALYTICS_FLUSH_INTERVAL_MS);
+  }
   /** Enable auto-launch functionality with configured triggers */
   autoLaunch() {
     if (!this.initialized) {
@@ -5508,6 +5559,7 @@ var DeepdotsPopups = class {
     this.emitEvent("popup_shown", def.surveyId, { popupId: def.id });
   }
   shouldShow(def, pathUrl, skipPathCheck = false) {
+    if (this.storage) this.loadPopupState(this.storage);
     if (this.isPathExcluded(def, pathUrl)) {
       return false;
     }
@@ -6034,22 +6086,32 @@ var DeepdotsPopups = class {
     this.persistPopupState();
   }
   /**
-   * Rehidrata el estado de redisplay desde el storage. `answeredSurveys` se reconstruye
-   * desde las entradas COMPLETED: es exactamente lo que persiste `markSurveyAnswered`.
+   * Fusiona el estado de redisplay del storage con el de memoria: por cada popup/survey gana
+   * la entrada MÁS RECIENTE. Fusionar y no sustituir es lo que hace convivir a varias
+   * pestañas sobre el mismo `localStorage`: se llama en el `init()`, antes de cada decisión
+   * de mostrar y antes de cada escritura. `answeredSurveys` se reconstruye desde las
+   * entradas COMPLETED: es exactamente lo que persiste `markSurveyAnswered`.
    */
   loadPopupState(storage) {
     const state = readPopupState(storage);
     Object.entries(state.lastShown).forEach(([popupId, timestamp]) => {
-      this.lastShown.set(popupId, timestamp);
+      if (timestamp > (this.lastShown.get(popupId) ?? -Infinity)) this.lastShown.set(popupId, timestamp);
     });
     Object.entries(state.progress).forEach(([surveyId, entry]) => {
+      const current = this.surveyProgress.get(surveyId);
+      if (current && current.timestamp >= entry.timestamp) return;
       this.surveyProgress.set(surveyId, { status: entry.status, timestamp: entry.timestamp });
       if (entry.status === "COMPLETED") this.answeredSurveys.add(surveyId);
     });
   }
-  /** Vuelca el estado de redisplay al storage. Sin storage (o bloqueado) degrada a memoria. */
+  /**
+   * Vuelca el estado de redisplay al storage. Sin storage (o bloqueado) degrada a memoria.
+   * Fusiona antes de escribir: escribir solo la foto en memoria borraba lo que otra pestaña
+   * hubiese guardado desde nuestro `init()`.
+   */
   persistPopupState() {
     if (!this.storage) return;
+    this.loadPopupState(this.storage);
     writePopupState(this.storage, {
       lastShown: Object.fromEntries(this.lastShown),
       progress: Object.fromEntries(this.surveyProgress)