@magicfeedback/popup-sdk 1.8.0 → 1.8.2

package/dist/react-native.mjs

@@ -1,4 +1,5 @@
 import {
+  BUSY_JS,
   LABELS,
   PRIMARY_COLOR_JS,
   RESOLVE_LOCALE_JS,
@@ -17,7 +18,7 @@ import {
   sdkWarn,
   setLogger,
   style_default
-} from "./chunk-322DDMX6.mjs";
+} from "./chunk-EBJZDVC6.mjs";
 
 // src/react-native/index.tsx
 import { createContext, useContext, useEffect, useRef, useState } from "react";
@@ -431,6 +432,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');
@@ -590,6 +592,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.
@@ -600,6 +603,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
@@ -862,7 +870,7 @@ function createReactNativeRenderer() {
 }
 
 // src/ui/preload.ts
-var defaultLoader = () => import("./renderPopup-SNDPX5RX.mjs");
+var defaultLoader = () => import("./renderPopup-E2OLIXIQ.mjs");
 var pending = null;
 function preloadRenderPopup(loader = defaultLoader) {
   if (pending) return pending;
@@ -935,7 +943,7 @@ var BrowserPopupRenderer = class {
     if (!this.container) return;
     this.visible = true;
     const container = this.container;
-    void import("./renderPopup-SNDPX5RX.mjs").then(({ renderPopup }) => {
+    void import("./renderPopup-E2OLIXIQ.mjs").then(({ renderPopup }) => {
       renderPopup(container, surveyId, productId, actions, emit, onClose, env, userId, style, sessionId, miniService, analyticsFeedbackSessionId, options);
     });
   }
@@ -1200,14 +1208,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);
@@ -1217,6 +1218,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 } : {}
     });
@@ -1309,6 +1313,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();
@@ -1948,8 +1961,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;
       },
@@ -1997,7 +2008,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();
@@ -2216,6 +2226,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;
@@ -2231,6 +2242,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() {
@@ -2243,8 +2260,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;
@@ -2265,21 +2282,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) {
@@ -2373,6 +2399,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;
     }
@@ -2781,7 +2808,7 @@ var DeepdotsPopups = class {
     }
     if (!this.popupContainer) return;
     const container = this.popupContainer;
-    void import("./renderPopup-SNDPX5RX.mjs").then(({ renderPopup }) => {
+    void import("./renderPopup-E2OLIXIQ.mjs").then(({ renderPopup }) => {
       renderPopup(
         container,
         surveyId,
@@ -2899,22 +2926,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)