@magicfeedback/popup-sdk 1.1.8 → 1.2.0

package/dist/index.js

@@ -3077,6 +3077,11 @@ async function renderPopup(container, surveyId, productId, actions, emit, onClos
   const isDark = style?.theme === "dark";
   const theme = {
     popupBg: isDark ? "#1e1e1e" : "#fff",
+    // El popup fija su propio fondo, así que debe fijar también el esquema de color.
+    // Sin esto los controles de formulario (input/textarea/select) caen al estilo por
+    // defecto del navegador: en un host con `prefers-color-scheme: dark` se pintan
+    // oscuros con texto blanco sobre el fondo claro del popup.
+    colorScheme: isDark ? "dark" : "light",
     textPrimary: isDark ? "#f0f0f0" : "#111",
     closeBtnHoverBg: isDark ? "rgba(255,255,255,0.10)" : "rgba(0,0,0,0.06)",
     closeBtnHoverColor: isDark ? "#fff" : "#000000"
@@ -3099,6 +3104,7 @@ async function renderPopup(container, surveyId, productId, actions, emit, onClos
       flex-direction: column;
       justify-content: flex-start;
       background: ${theme.popupBg};
+      color-scheme: ${theme.colorScheme};
       border-radius: 8px;
       padding: 24px;
       box-shadow: 0 4px 6px rgba(0,0,0,0.1);
@@ -3550,6 +3556,9 @@ __export(index_exports, {
   CrashReporter: () => CrashReporter,
   DeepdotsPopups: () => DeepdotsPopups,
   InMemoryStorage: () => InMemoryStorage,
+  MAX_TRACKED_MESSAGES: () => MAX_TRACKED_MESSAGES,
+  MESSAGE_CHANNELS: () => MESSAGE_CHANNELS,
+  MessageGuard: () => MessageGuard,
   NoopPopupRenderer: () => NoopPopupRenderer,
   POPUP_TRIGGER_CONDITION_STATUSES: () => POPUP_TRIGGER_CONDITION_STATUSES,
   ReactNativePopupRenderer: () => ReactNativePopupRenderer,
@@ -4017,6 +4026,15 @@ var AnalyticsManager = class {
       this.exitMiniService(name);
     }
   }
+  /**
+   * Olvida lo que pertenecía al usuario anterior (user attributes + métricas) al cambiar de
+   * usuario. NO toca el buffer de eventos: el cierre de sesión ya lo vació con la identidad
+   * vieja, y lo que llegue después es del usuario nuevo.
+   */
+  resetUserScope() {
+    this.attributes = {};
+    this.metrics = {};
+  }
   /** Registra un evento de analítica (modelo GA: nombre + params). */
   track(name, params) {
     const current = this.getMiniService();
@@ -4104,7 +4122,7 @@ function pushKV(list, key, value) {
   if (value === void 0 || value === null || value === "") return;
   list.push({ key, value: [String(value)] });
 }
-function buildAnalyticsFeedbackBody(envelope, keys, feedbackSessionId) {
+function buildAnalyticsFeedbackBody(envelope, keys, feedbackSessionId, options) {
   const { context } = envelope;
   const profile = [];
   pushKV(profile, "external-user-id", envelope.userId);
@@ -4155,7 +4173,8 @@ function buildAnalyticsFeedbackBody(envelope, keys, feedbackSessionId) {
     },
     publicKey: keys.publicKey,
     integration: keys.integration,
-    completed: false,
+    // Único marcador de cierre acordado con backend: el último lote de la sesión.
+    completed: options?.sessionEnd === true,
     ...feedbackSessionId ? { sessionId: feedbackSessionId } : {}
   };
 }
@@ -4174,7 +4193,7 @@ function createFeedbackSink(options) {
   let feedbackSessionId;
   let firstPostInFlight = null;
   const url = `${options.baseUrl}/sdk/feedback`;
-  const post = async (body, final) => {
+  const post = async (body, final, sessionEnd = false) => {
     const json = JSON.stringify(body);
     const small = json.length <= KEEPALIVE_MAX_BYTES;
     if (final && options.sendBeaconImpl && small) {
@@ -4208,6 +4227,7 @@ function createFeedbackSink(options) {
       );
       return;
     }
+    if (sessionEnd) return;
     try {
       const data = await res.json();
       if (data?.sessionId && data.sessionId !== feedbackSessionId) {
@@ -4220,13 +4240,18 @@ function createFeedbackSink(options) {
   };
   return async (envelope, meta) => {
     const final = meta?.final === true;
+    const sessionEnd = meta?.sessionEnd === true;
     if (!feedbackSessionId && firstPostInFlight && !final) {
       await firstPostInFlight;
     }
-    const body = buildAnalyticsFeedbackBody(envelope, options.keys, feedbackSessionId);
+    const body = buildAnalyticsFeedbackBody(envelope, options.keys, feedbackSessionId, { sessionEnd });
     options.log?.("[DeepdotsAnalytics] POST /sdk/feedback \u2192", body);
-    const sent = post(body, final);
-    if (!feedbackSessionId) {
+    const sent = post(body, final, sessionEnd);
+    if (sessionEnd) {
+      feedbackSessionId = void 0;
+      firstPostInFlight = null;
+      options.onSessionReset?.();
+    } else if (!feedbackSessionId) {
       firstPostInFlight = sent.then(
         () => void 0,
         () => void 0
@@ -4665,6 +4690,7 @@ var CrashReporter = class {
 init_logger();
 
 // src/analytics/messaging.ts
+var MESSAGE_CHANNELS = ["push", "in_app"];
 function buildMessageParams(stage, o) {
   const p = {
     stage,
@@ -4677,6 +4703,57 @@ function buildMessageParams(stage, o) {
   if (o.currency) p.currency = o.currency;
   return { ...p, ...o.params ?? {} };
 }
+var MAX_TRACKED_MESSAGES = 500;
+var MessageGuard = class {
+  constructor(maxTrackedMessages = MAX_TRACKED_MESSAGES) {
+    this.maxTrackedMessages = maxTrackedMessages;
+    /** message_id → canal fijado + stages ya emitidos. El orden de inserción marca la eviction. */
+    this.seen = /* @__PURE__ */ new Map();
+  }
+  evaluate(stage, options) {
+    const channel = options.channel;
+    if (!MESSAGE_CHANNELS.includes(channel)) {
+      return {
+        emit: false,
+        reason: "invalid_channel",
+        detail: `channel "${channel}" no v\xE1lido (esperado ${MESSAGE_CHANNELS.join(" | ")})`
+      };
+    }
+    const entry = this.seen.get(options.id);
+    if (!entry) {
+      this.remember(options.id, channel, stage);
+      return { emit: true };
+    }
+    if (entry.channel !== channel) {
+      return {
+        emit: false,
+        reason: "channel_conflict",
+        detail: `message_id "${options.id}" ya se report\xF3 en channel "${entry.channel}"; se descarta "${channel}"`
+      };
+    }
+    if (entry.stages.has(stage)) {
+      return {
+        emit: false,
+        reason: "duplicate_stage",
+        detail: `stage "${stage}" ya emitido para message_id "${options.id}"`
+      };
+    }
+    entry.stages.add(stage);
+    return { emit: true };
+  }
+  /** Olvida todo lo vigilado (nueva sesión). */
+  reset() {
+    this.seen.clear();
+  }
+  remember(id, channel, stage) {
+    this.seen.set(id, { channel, stages: /* @__PURE__ */ new Set([stage]) });
+    while (this.seen.size > this.maxTrackedMessages) {
+      const oldest = this.seen.keys().next();
+      if (oldest.done) break;
+      this.seen.delete(oldest.value);
+    }
+  }
+};
 
 // src/core/deepdots-popups.ts
 var EXIT_QUEUE_STORAGE_KEY = "__deepdots_exit_popup_queue__";
@@ -4718,14 +4795,24 @@ var DeepdotsPopups = class {
     this.analyticsFlushTimer = void 0;
     /** Crash & error reporting (#14–17). Null hasta init(). */
     this.crashReporter = null;
+    /** Protecciones del funnel de Messaging (#18–22). Vigencia de sesión: se reinicia en init(). */
+    this.messageGuard = new MessageGuard();
     /** Observador de navegación (Fase 2): emite page_view por el canal de analytics. */
     this.navObserver = null;
     /** Tiempo activo (engagement time, #8). */
     this.engagement = null;
     /** Atributos internos del usuario identificado → POST /sdk/popups/contact. Null si no hay userId. */
     this.contact = null;
+    /** Storage resuelto en init() (inyectado por el host o localStorage). Reusado al cambiar de usuario. */
+    this.storage = null;
     /** Marca si ya se inició la navegación manual (setScreen) — para RN sin History API. */
     this.navStarted = false;
+    /**
+     * `true` entre `session_start` y `session_end`. Hace idempotente tanto la apertura como
+     * el cierre (p. ej. `visibilitychange` + `pagehide` seguidos) y permite abrir una sesión
+     * nueva al volver a foreground o al conceder el consentimiento más tarde.
+     */
+    this.sessionOpen = false;
     /**
      * 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.
@@ -4737,6 +4824,11 @@ var DeepdotsPopups = class {
     this.logger = config.logger ?? console;
     setLogger(this.logger);
     if (this.initialized) {
+      const nextUserId = config.userId || void 0;
+      if (nextUserId !== this.config?.userId) {
+        this.setUserId(nextUserId);
+        return;
+      }
       this.log("SDK already initialized");
       return;
     }
@@ -4749,6 +4841,7 @@ var DeepdotsPopups = class {
       userId: config.userId || void 0
     };
     const storage = config.storage ?? createDefaultStorage();
+    this.storage = storage;
     this.tracking = new TrackingManager({
       storage,
       clientUserId: this.config.userId,
@@ -4776,6 +4869,9 @@ var DeepdotsPopups = class {
       sendBeaconImpl: typeof navigator !== "undefined" && typeof navigator.sendBeacon === "function" ? (url, body) => navigator.sendBeacon(url, body) : void 0,
       onSessionId: (id) => {
         this.analyticsFeedbackSessionId = id;
+      },
+      onSessionReset: () => {
+        this.analyticsFeedbackSessionId = void 0;
       }
     }) : createDryRunSink((...a) => this.logger.log(...a));
     const device = config.device ?? collectDeviceInfo(config.appVersion);
@@ -4784,6 +4880,7 @@ var DeepdotsPopups = class {
       navigator: typeof navigator !== "undefined" ? navigator : void 0,
       intl: typeof Intl !== "undefined" ? Intl : void 0
     });
+    this.messageGuard.reset();
     this.analytics = new AnalyticsManager({
       sink: analyticsSink,
       publicKey: config.analytics?.publicKey ?? this.config.apiKey,
@@ -4819,7 +4916,7 @@ var DeepdotsPopups = class {
     this.engagement = new EngagementTracker();
     this.engagement.resume();
     this.setupAnalyticsFlush();
-    this.track("deepdots_session_start", {});
+    this.openSession();
     const pendingCrashes = this.crashReporter.drainPendingCrashes();
     if (this.tracking?.isTrackingEnabled()) {
       for (const rec of pendingCrashes) {
@@ -4851,7 +4948,9 @@ var DeepdotsPopups = class {
   }
   /** Activa/desactiva el tracking (identidad + sesión + analytics). Kill-switch del contrato §7bis. */
   setTrackingEnabled(enabled) {
+    if (!enabled) this.closeSession("tracking_disabled");
     this.tracking?.setTrackingEnabled(enabled);
+    if (enabled) this.openSession();
     this.log("tracking \xB7 setTrackingEnabled:", enabled, "\xB7 session_id:", this.tracking?.getSessionId() ?? null);
   }
   // ───────── Analytics (canal separado del feedback, vinculado por user_id) ─────────
@@ -4921,8 +5020,18 @@ var DeepdotsPopups = class {
   trackFunnelStep(funnel, step, taskId, params) {
     this.track("deepdots_funnel_step", { funnel, step, task_id: taskId, ...params ?? {} });
   }
-  /** Messaging (#18–22): registra una etapa del funnel de una notificación (push/in-app). No-op si tracking off. */
+  /**
+   * Messaging (#18–22): registra una etapa del funnel de una notificación (push/in-app).
+   * No-op si tracking off. El evento se descarta (con warning) si el `channel` no es válido,
+   * si ese `(message_id, stage)` ya se emitió en la sesión, o si el `message_id` ya se reportó
+   * en otro canal — ver `MessageGuard`.
+   */
   trackMessage(stage, options) {
+    const verdict = this.messageGuard.evaluate(stage, options);
+    if (!verdict.emit) {
+      console.warn(`[DeepdotsPopups] trackMessage descartado (${verdict.reason}): ${verdict.detail}`);
+      return;
+    }
     this.track("deepdots_message", buildMessageParams(stage, options));
   }
   /**
@@ -4938,21 +5047,86 @@ var DeepdotsPopups = class {
       this.navObserver.visit(name);
     }
   }
-  /** App a foreground (RN: AppState 'active'): reanuda el engagement time. */
+  /** App a foreground (RN: AppState 'active'): reanuda el engagement time y abre sesión nueva. */
   onForeground() {
     this.engagement?.resume();
+    this.openSession();
   }
   /**
-   * App a background (RN: AppState 'background'): cierra pantalla actual (page_view),
-   * mini-service (mini_service_exit), emite engagement y hace flush del lote.
+   * App a background (RN: AppState 'background'): FIN DE SESIÓN. Cierra pantalla actual
+   * (page_view), mini-services (mini_service_exit), emite engagement + `session_end` y
+   * envía el último lote con `completed:true`.
+   *
+   * Es la única señal disponible en móvil: el kill de la app (swipe) NO da callback.
    */
   onBackground() {
+    this.closeSession("background");
+    this.engagement?.pause();
+  }
+  /**
+   * Cierre EXPLÍCITO de la sesión por parte del host (logout, fin de flujo…): emite
+   * `session_end` y envía el último lote con `completed:true`.
+   */
+  endSession() {
+    this.closeSession("manual");
+  }
+  /**
+   * Cambio de usuario (login / logout / cambio de cuenta). Cierra la sesión del usuario
+   * anterior (`session_end` con `reason: 'user_change'` + `completed:true`), cambia la
+   * identidad y abre una sesión nueva. Sin `userId` vuelve al id anónimo del SDK.
+   *
+   * Equivale a llamar a `init()` otra vez con otro `userId`.
+   */
+  setUserId(userId) {
+    const next = userId || void 0;
+    if (!this.initialized || !this.config || next === this.config.userId) return;
+    this.closeSession("user_change");
+    const enabled = this.tracking?.isTrackingEnabled() ?? true;
+    const storage = this.storage ?? createDefaultStorage();
+    this.config.userId = next;
+    this.tracking = new TrackingManager({ storage, clientUserId: next, enabled });
+    this.contact = next ? new ContactManager({
+      storage,
+      publicKey: this.config.apiKey ?? "",
+      userId: next,
+      post: (body) => this.postContact(body)
+    }) : null;
+    this.analytics?.resetUserScope();
+    this.messageGuard.reset();
+    this.log("tracking \xB7 user_change \xB7 user_id:", this.tracking.getUserId());
+    this.openSession();
+  }
+  /**
+   * Cierra la sesión actual: vuelca todo lo que quedaba abierto y envía el último lote
+   * marcado con `completed:true`, para que el backend cierre el registro. El `sessionId`
+   * cacheado se olvida → el lote siguiente abre un registro nuevo.
+   *
+   * Idempotente: dos cierres seguidos (p. ej. `visibilitychange` + `pagehide`) no duplican
+   * el `session_end`.
+   */
+  closeSession(reason) {
+    if (!this.sessionOpen) return;
+    if (!this.tracking?.isTrackingEnabled()) return;
+    this.sessionOpen = false;
     this.navObserver?.stop();
     this.navStarted = false;
-    if (this.tracking?.isTrackingEnabled()) this.analytics?.exitAllMiniServices();
+    this.analytics?.exitAllMiniServices();
     this.flushEngagement();
-    this.engagement?.pause();
-    this.flushAnalytics();
+    this.track("deepdots_session_end", { reason });
+    this.flushAnalytics({ final: reason === "page_hide", sessionEnd: true });
+    this.analyticsFeedbackSessionId = void 0;
+    this.tracking?.setSessionId(null);
+    this.log("tracking \xB7 session_end:", reason);
+  }
+  /**
+   * Abre sesión (`session_start`) si no hay una abierta y el tracking está activo. Idempotente:
+   * se llama en init(), al volver a foreground y al conceder el consentimiento.
+   */
+  openSession() {
+    if (this.sessionOpen) return;
+    if (!this.tracking?.isTrackingEnabled()) return;
+    this.sessionOpen = true;
+    this.track("deepdots_session_start", {});
   }
   /** Payload que se ENVIARÍA al endpoint de analytics (no envía ni vacía el buffer). */
   previewAnalytics() {
@@ -4990,10 +5164,7 @@ var DeepdotsPopups = class {
     this.analyticsFlushTimer = setInterval(() => this.flushAnalytics(), ANALYTICS_FLUSH_INTERVAL_MS);
     window.addEventListener("pagehide", () => {
       clearInterval(this.analyticsFlushTimer);
-      this.navObserver?.stop();
-      if (this.tracking?.isTrackingEnabled()) this.analytics?.exitAllMiniServices();
-      this.flushEngagement();
-      this.flushAnalytics({ final: true });
+      this.closeSession("page_hide");
     });
     document.addEventListener("visibilitychange", () => {
       if (document.visibilityState === "hidden") {
@@ -5671,7 +5842,8 @@ function setupReactNative(sdk, config, deps = {}) {
   if (deps.appState?.addEventListener) {
     subscription = deps.appState.addEventListener("change", (state) => {
       if (state === "active") sdk.onForeground();
-      else sdk.onBackground();
+      else if (state === "background") sdk.onBackground();
+      else sdk.flushAnalytics();
     });
   }
   return () => {