@magicfeedback/popup-sdk 1.1.8 → 1.3.0

package/dist/react-native.mjs

@@ -7,8 +7,9 @@ import {
   buildSurveyIdentity,
   createDefaultStorage,
   sdkWarn,
-  setLogger
-} from "./chunk-4UXOEIAB.mjs";
+  setLogger,
+  style_default
+} from "./chunk-R4B3K2ZW.mjs";
 
 // src/react-native/index.tsx
 import { createContext, useContext, useEffect, useRef, useState } from "react";
@@ -200,6 +201,15 @@ function resolveEnvironment(nodeEnv) {
 }
 
 // src/ui/surveyHtml.ts
+var POSITION_MAP = {
+  center: { justifyContent: "center", alignItems: "center", padding: "0", background: "rgba(0,0,0,0.5)" },
+  bottom: { justifyContent: "center", alignItems: "flex-end", padding: "16px", background: "transparent" },
+  "bottom-right": { justifyContent: "flex-end", alignItems: "flex-end", padding: "16px", background: "transparent" },
+  "bottom-left": { justifyContent: "flex-start", alignItems: "flex-end", padding: "16px", background: "transparent" },
+  top: { justifyContent: "center", alignItems: "flex-start", padding: "16px", background: "transparent" },
+  "top-right": { justifyContent: "flex-end", alignItems: "flex-start", padding: "16px", background: "transparent" },
+  "top-left": { justifyContent: "flex-start", alignItems: "flex-start", padding: "16px", background: "transparent" }
+};
 function buildSurveyHtml(opts) {
   const env = opts.env === "development" ? "dev" : "prod";
   const version = opts.version ?? "2.2.4";
@@ -210,17 +220,141 @@ function buildSurveyHtml(opts) {
   const metaJson = JSON.stringify(opts.metadata ?? []);
   const fontFaceCss = opts.font ? buildFontFaceCss(opts.font.family, opts.font.url) : "";
   const fontFamilyValue = opts.font ? buildFontFamilyValue(opts.font.family) : "-apple-system,system-ui,sans-serif";
+  const popupClass = opts.font?.family ? "deepdots-popup deepdots-has-font" : "deepdots-popup";
+  const isDark = opts.theme === "dark";
+  const popupBg = isDark ? "#1e1e1e" : "#fff";
+  const colorScheme = isDark ? "dark" : "light";
+  const textPrimary = isDark ? "#f0f0f0" : "#111";
+  const pos = POSITION_MAP[opts.position ?? "center"] ?? POSITION_MAP.center;
+  const backLabel = JSON.stringify(opts.actions?.back?.label ?? "Back");
+  const startLabel = JSON.stringify(opts.actions?.start?.label ?? "Start survey");
+  const completeLabel = JSON.stringify(opts.actions?.complete?.label ?? "Complete survey");
+  const submitLabel = JSON.stringify(opts.actions?.accept?.label ?? "Send");
   return `<!DOCTYPE html><html><head>
 <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
-<meta name="color-scheme" content="light"/>
-<style>${fontFaceCss}html,body{margin:0;padding:0;background:transparent;font-family:${fontFamilyValue}}#mf{width:100%;box-sizing:border-box}#mf *{max-width:100%;box-sizing:border-box}</style>
+<meta name="color-scheme" content="${colorScheme}"/>
+<style>
+${style_default}
+${fontFaceCss}
+html,body{margin:0;padding:0;height:100%;font-family:${fontFamilyValue}}
+body{display:flex;justify-content:${pos.justifyContent};align-items:${pos.alignItems};background:${pos.background};padding:${pos.padding};box-sizing:border-box}
+.deepdots-popup{position:relative;display:flex;flex-direction:column;justify-content:flex-start;background:${popupBg};color-scheme:${colorScheme};border-radius:8px;padding:24px;box-shadow:0 4px 6px rgba(0,0,0,0.1);max-width:600px;width:90%;min-height:200px;box-sizing:border-box}
+.deepdots-popup-header{display:flex;justify-content:flex-end;align-items:center;width:100%}
+#dd-close{background:transparent;border:none;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:8px;cursor:pointer;color:${textPrimary};padding:4px}
+.deepdots-popup-container-content{display:flex;flex-direction:column;padding:0 20px 12px 20px;max-height:80vh;overflow:hidden;box-sizing:border-box}
+.deepdots-popup-main{display:flex;flex-direction:column;width:100%;max-height:80vh;overflow-y:auto;overflow-x:hidden;position:relative}
+#dd-form-wrapper{width:100%;flex:1 1 auto}
+#mf{width:100%;box-sizing:border-box;visibility:hidden}
+.deepdots-popup-main *{max-width:100%;box-sizing:border-box}
+#dd-logo{max-height:40px;max-width:100%;object-fit:contain}
+.deepdots-error-hint{display:none;margin:12px 0 0 0;padding:10px 12px;border-radius:6px;background:#FEF3C7;color:#92400E;border:1px solid #FCD34D;font-size:13px}
+.deepdots-popup-footer{display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;gap:8px;margin-top:auto;width:100%;padding-top:16px}
+.dd-nav-btn{display:none;border:none;padding:12px 24px;border-radius:4px;cursor:pointer;font-size:14px;box-shadow:0 2px 4px rgba(0,0,0,0.1);align-items:center;justify-content:center;text-align:center}
+#dd-back{background:transparent;color:#333;border:1px solid #999}
+#dd-start,#dd-complete,#dd-submit{background:#1E293B;color:#fff;border:none}
+#dd-submit:disabled,#dd-start:disabled,#dd-back:disabled,#dd-complete:disabled{opacity:0.6;cursor:not-allowed}
+.mf-spinner{display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
+.mf-spinner-circle{width:28px;height:28px;border:3px solid #e0e6ed;border-top-color:#1E293B;border-radius:50%;animation:ddspin 0.9s linear infinite}
+@keyframes ddspin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
+@media (max-width:640px){
+  .deepdots-popup{width:calc(100% - 24px);max-width:calc(100% - 24px);border-radius:12px}
+  .deepdots-popup-footer{flex-direction:column-reverse;gap:12px}
+  .dd-nav-btn{width:100%}
+  .magicfeedback-checkbox-container,.magicfeedback-radio-container{margin:4px 0;padding:4px 8px}
+  .magicfeedback-checkbox label,.magicfeedback-radio-container label{font-size:15px}
+  .deepdots-popup input[type="radio"]{margin:6px 0 6px 8px}
+  .deepdots-popup input[type="checkbox"]{width:16px;height:16px}
+}
+</style>
 </head><body>
-<div id="mf"></div>
+<div class="${popupClass}" id="dd-popup">
+  <div class="deepdots-popup-header">
+    <button type="button" id="dd-close" aria-label="Close popup">
+      <svg width="28" height="28" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <path d="M6 6L18 18M6 18L18 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+      </svg>
+    </button>
+  </div>
+  <div class="deepdots-popup-container-content">
+    <div class="deepdots-popup-main" id="dd-main">
+      <div id="dd-form-wrapper">
+        <div class="mf-spinner" id="dd-spinner" role="status" aria-label="Loading survey"><div class="mf-spinner-circle"></div></div>
+        <div id="mf"></div>
+      </div>
+      <div class="deepdots-error-hint" id="dd-error" role="alert" aria-live="polite"></div>
+      <div class="deepdots-popup-footer" id="dd-footer">
+        <button type="button" class="dd-nav-btn" id="dd-submit">Send</button>
+        <button type="button" class="dd-nav-btn" id="dd-back">Back</button>
+        <button type="button" class="dd-nav-btn" id="dd-complete">Complete survey</button>
+        <button type="button" class="dd-nav-btn" id="dd-start">Start survey</button>
+      </div>
+    </div>
+  </div>
+</div>
 <script>
 (function(){
   function emit(s){ try{ if(window.ReactNativeWebView){ window.ReactNativeWebView.postMessage(s); } }catch(e){} }
   function emitJSON(n,p){ try{ emit(JSON.stringify({name:n,payload:p||{}})); }catch(e){} }
   window.DeepdotsClose = function(){ emitJSON('popup_close'); };
+
+  var popup=document.getElementById('dd-popup');
+  var main=document.getElementById('dd-main');
+  var footer=document.getElementById('dd-footer');
+  var spinner=document.getElementById('dd-spinner');
+  var formHost=document.getElementById('mf');
+  var errorHint=document.getElementById('dd-error');
+  var backBtn=document.getElementById('dd-back');
+  var startBtn=document.getElementById('dd-start');
+  var completeBtn=document.getElementById('dd-complete');
+  var submitBtn=document.getElementById('dd-submit');
+
+  backBtn.textContent=${backLabel};
+  startBtn.textContent=${startLabel};
+  completeBtn.textContent=${completeLabel};
+  submitBtn.textContent=${submitLabel};
+
+  document.getElementById('dd-close').onclick=function(){ emitJSON('popup_close'); };
+  backBtn.onclick=function(){ if(window.DeepdotsForm && window.DeepdotsForm.back){ window.DeepdotsForm.back(); } };
+  startBtn.onclick=function(){ if(window.DeepdotsForm && window.DeepdotsForm.startForm){ window.DeepdotsForm.startForm(); } };
+  completeBtn.onclick=function(){ emitJSON('popup_close'); };
+  var surveyCompletedEmitted=false;
+  submitBtn.onclick=function(){
+    if(surveyCompletedEmitted) return;
+    if(window.DeepdotsForm && window.DeepdotsForm.send){ window.DeepdotsForm.send(); }
+  };
+
+  function updateButtons(state){
+    backBtn.style.display='none';
+    startBtn.style.display='none';
+    submitBtn.style.display='none';
+    completeBtn.style.display='none';
+    backBtn.style.width='';
+    startBtn.style.width='';
+    submitBtn.style.width='';
+    completeBtn.style.width='';
+    if(state==='start'){
+      startBtn.style.display='inline-flex';
+      startBtn.style.width='100%';
+    } else if(state==='in_progress_first'){
+      submitBtn.style.display='inline-flex';
+    } else if(state==='in_progress_next'){
+      backBtn.style.display='inline-flex';
+      submitBtn.style.display='inline-flex';
+    } else if(state==='completed'){
+      completeBtn.style.display='inline-flex';
+      completeBtn.style.width='100%';
+    }
+  }
+
+  function setLoading(isLoading){
+    spinner.style.display=isLoading?'flex':'none';
+    if(!isLoading){ formHost.style.visibility='visible'; }
+    footer.style.display=isLoading?'none':'flex';
+    backBtn.disabled=isLoading; startBtn.disabled=isLoading; completeBtn.disabled=isLoading; submitBtn.disabled=isLoading;
+    if(isLoading){ updateButtons(null); }
+  }
+  setLoading(true);
+
   var initialized=false;
   function initMF(){
     if(initialized || !window.magicfeedback) return initialized;
@@ -229,23 +363,85 @@ function buildSurveyHtml(opts) {
       window.magicfeedback.init({ debug:false, env:'${env}' });
       var form = window.magicfeedback.form(${sid}, ${pid}, ${profileJson}, ${metaJson});
       window.DeepdotsForm = form;
+      var stylesInjected=false;
       form.generate('mf', {
         addButton:false,
         getMetaData:true,
-        onLoadedEvent:function(){ emitJSON('loaded'); },
-        beforeSubmitEvent:function(){ emitJSON('before_submit'); },
+        onLoadedEvent:function(args){
+          var s=args && args.formData ? args.formData.style : null;
+          if(s && !stylesInjected){
+            stylesInjected=true;
+            if(s.boxBackgroundColor){ popup.style.background=s.boxBackgroundColor; }
+            if(s.contentAlign){ main.style.justifyContent = s.contentAlign==='center' ? 'center' : 'flex-start'; }
+            if(s.buttonPrimaryColor){
+              submitBtn.style.background=s.buttonPrimaryColor; submitBtn.style.border='none'; submitBtn.style.color='#fff';
+              startBtn.style.background=s.buttonPrimaryColor; startBtn.style.border='none'; startBtn.style.color='#fff';
+              completeBtn.style.background=s.buttonPrimaryColor; completeBtn.style.border='none'; completeBtn.style.color='#fff';
+            }
+            if(s.buttonSecondaryColor){
+              backBtn.style.background='#fff'; backBtn.style.color=s.buttonSecondaryColor; backBtn.style.border='1px solid '+s.buttonSecondaryColor;
+            }
+            if(s.logo && !document.getElementById('dd-logo')){
+              var logoImg=document.createElement('img');
+              logoImg.id='dd-logo'; logoImg.src=s.logo; logoImg.alt='Logo';
+              if(s.logoSize==='small'){ logoImg.style.maxHeight='30px'; }
+              else if(s.logoSize==='medium'){ logoImg.style.maxHeight='50px'; }
+              else if(s.logoSize==='large'){ logoImg.style.maxHeight='70px'; }
+              if(s.logoPosition==='left'){ logoImg.style.margin='0 16px 20px 0'; logoImg.style.display='block'; logoImg.style.marginLeft='0'; }
+              else if(s.logoPosition==='right'){ logoImg.style.margin='0 0 20px 16px'; logoImg.style.display='block'; logoImg.style.marginLeft='auto'; }
+              else if(s.logoPosition==='center'){ logoImg.style.margin='0 auto 20px auto'; logoImg.style.display='block'; }
+              main.insertBefore(logoImg, document.getElementById('dd-form-wrapper'));
+            }
+            if(s.startMessage && s.startMessage!==''){ updateButtons('start'); }
+            else { updateButtons('in_progress_first'); }
+          } else {
+            updateButtons('in_progress_first');
+          }
+          emitJSON('loaded');
+          setLoading(false);
+        },
+        beforeSubmitEvent:function(){
+          setLoading(true);
+          emitJSON('before_submit');
+        },
         afterSubmitEvent:function(p){
-          try{ if(p && p.completed){ emitJSON('survey_completed', p); } else { emitJSON('after_submit', p); } }
-          catch(e){ emitJSON('after_submit'); }
+          var error=p && p.error ? (typeof p.error==='string' ? p.error : String(p.error)) : '';
+          if(error){
+            setLoading(false);
+            if(error.toLowerCase().indexOf('no response')!==-1){
+              errorHint.textContent='Please answer the required question to continue.';
+              errorHint.style.display='block';
+              updateButtons('in_progress_next');
+              return;
+            }
+            errorHint.textContent='An error occurred while submitting. Please try again or close the popup.';
+            errorHint.style.display='block';
+            return;
+          }
+          errorHint.style.display='none';
+          setLoading(false);
+          if(p && p.completed){
+            surveyCompletedEmitted=true;
+            updateButtons('completed');
+            emitJSON('survey_completed', p);
+            return;
+          }
+          if(p && p.total>1 && p.progress>0 && p.progress<p.total){ updateButtons('in_progress_next'); }
+          else { updateButtons('in_progress_first'); }
+          emitJSON('after_submit', p);
         },
-        onBackEvent:function(p){ emitJSON('back', p); }
-      }).catch(function(e){ emit('error:init'); });
-    }catch(e){ emit('error:exception'); }
+        onBackEvent:function(p){
+          if(p && p.progress===0){ updateButtons('in_progress_first'); }
+          else { updateButtons('in_progress_next'); }
+          emitJSON('back', p);
+        }
+      }).catch(function(e){ setLoading(false); emit('error:init'); });
+    }catch(e){ setLoading(false); emit('error:exception'); }
     return true;
   }
   var s=document.createElement('script'); s.src=${JSON.stringify(cdn)}; s.async=true;
   s.onload=function(){ initMF(); };
-  s.onerror=function(){ emit('error:load'); };
+  s.onerror=function(){ setLoading(false); emit('error:load'); };
   document.head.appendChild(s);
   var tries=0, t=setInterval(function(){ if(initMF()||++tries>40){ clearInterval(t); } },150);
 })();
@@ -264,18 +460,28 @@ var ReactNativePopupRenderer = class {
   }
   init() {
   }
-  show(surveyId, productId, _actions, emit, onClose, env = "production", userId, style, sessionId, miniService, analyticsFeedbackSessionId) {
+  show(surveyId, productId, actions, emit, onClose, env = "production", userId, style, sessionId, miniService, analyticsFeedbackSessionId) {
     this.emitFn = emit;
     this.onCloseFn = onClose;
     this.currentSurveyId = surveyId;
     this.partialEmitted = false;
     const { profile, metadata } = buildSurveyIdentity(userId ?? null, sessionId ?? null, miniService ?? null, analyticsFeedbackSessionId ?? null);
-    const html = buildSurveyHtml({ surveyId, productId, env, profile, metadata, font: style?.font });
+    const html = buildSurveyHtml({
+      surveyId,
+      productId,
+      env,
+      profile,
+      metadata,
+      font: style?.font,
+      theme: style?.theme,
+      position: style?.position,
+      actions
+    });
     if (this.options.onShow) {
       this.options.onShow({ surveyId, productId, html });
     } else {
       sdkWarn(
-        "[Deepdots] ReactNativePopupRenderer sin onShow: pasa { onShow } a new ReactNativePopupRenderer({...}) para montar el WebView del survey."
+        "[Deepdots] ReactNativePopupRenderer has no onShow: pass { onShow } to new ReactNativePopupRenderer({...}) to mount the survey WebView."
       );
     }
   }
@@ -366,7 +572,7 @@ var BrowserPopupRenderer = class {
     if (!this.container) return;
     this.visible = true;
     const container = this.container;
-    void import("./renderPopup-PS3NJDUR.mjs").then(({ renderPopup }) => {
+    void import("./renderPopup-ZYXOUBCP.mjs").then(({ renderPopup }) => {
       renderPopup(container, surveyId, productId, actions, emit, onClose, env, userId, style, sessionId, miniService, analyticsFeedbackSessionId);
     });
   }
@@ -390,7 +596,7 @@ function createDefaultRenderer() {
 // src/analytics/analytics-manager.ts
 function createDryRunSink(log = console.log) {
   return (payload) => log(
-    "[DeepdotsAnalytics] (dry-run \xB7 NO enviado \xB7 sin init.analytics) POST /sdk/feedback \u2192",
+    "[DeepdotsAnalytics] (dry-run \xB7 NOT sent \xB7 no init.analytics) POST /sdk/feedback \u2192",
     JSON.stringify(payload, null, 2)
   );
 }
@@ -459,6 +665,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();
@@ -546,7 +761,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);
@@ -597,7 +812,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 } : {}
   };
 }
@@ -616,20 +832,20 @@ 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) {
       const payload = typeof Blob !== "undefined" ? new Blob([json], { type: "application/json" }) : json;
       if (options.sendBeaconImpl(url, payload)) {
-        options.log?.("[DeepdotsAnalytics] flush final v\xEDa sendBeacon");
+        options.log?.("[DeepdotsAnalytics] final flush via sendBeacon");
         return;
       }
-      options.log?.("[DeepdotsAnalytics] sendBeacon rechaz\xF3 el lote; fallback a fetch");
+      options.log?.("[DeepdotsAnalytics] sendBeacon rejected the batch; falling back to fetch");
     }
     const f = options.fetchImpl ?? (typeof fetch !== "undefined" ? fetch : void 0);
     if (!f) {
-      options.log?.("[DeepdotsAnalytics] no fetch disponible; payload no enviado", body);
+      options.log?.("[DeepdotsAnalytics] no fetch available; payload not sent", body);
       return;
     }
     const res = await f(url, {
@@ -642,19 +858,20 @@ function createFeedbackSink(options) {
     if (!res.ok) {
       const detail = await safeBodyText(res);
       if (isRetryableStatus(res.status)) {
-        throw new Error(`POST /sdk/feedback ${res.status} (reintentable): ${detail}`);
+        throw new Error(`POST /sdk/feedback ${res.status} (retryable): ${detail}`);
       }
       options.log?.(
-        `[DeepdotsAnalytics] POST /sdk/feedback rechazado con ${res.status}; lote DESCARTADO:`,
+        `[DeepdotsAnalytics] POST /sdk/feedback rejected with ${res.status}; batch DISCARDED:`,
         detail
       );
       return;
     }
+    if (sessionEnd) return;
     try {
       const data = await res.json();
       if (data?.sessionId && data.sessionId !== feedbackSessionId) {
         feedbackSessionId = data.sessionId;
-        options.log?.("[DeepdotsAnalytics] feedbackSessionId cacheado:", feedbackSessionId);
+        options.log?.("[DeepdotsAnalytics] feedbackSessionId cached:", feedbackSessionId);
         options.onSessionId?.(feedbackSessionId);
       }
     } catch {
@@ -662,13 +879,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
@@ -1103,6 +1325,7 @@ var CrashReporter = class {
 };
 
 // src/analytics/messaging.ts
+var MESSAGE_CHANNELS = ["push", "in_app"];
 function buildMessageParams(stage, o) {
   const p = {
     stage,
@@ -1115,6 +1338,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: `invalid channel "${channel}" (expected ${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}" was already reported on channel "${entry.channel}"; discarding "${channel}"`
+      };
+    }
+    if (entry.stages.has(stage)) {
+      return {
+        emit: false,
+        reason: "duplicate_stage",
+        detail: `stage "${stage}" was already sent for 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__";
@@ -1156,14 +1430,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.
@@ -1175,6 +1459,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;
     }
@@ -1187,6 +1476,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,
@@ -1214,6 +1504,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);
@@ -1222,6 +1515,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,
@@ -1257,7 +1551,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) {
@@ -1289,7 +1583,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) ─────────
@@ -1359,8 +1655,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 discarded (${verdict.reason}): ${verdict.detail}`);
+      return;
+    }
     this.track("deepdots_message", buildMessageParams(stage, options));
   }
   /**
@@ -1376,21 +1682,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() {
@@ -1428,10 +1799,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") {
@@ -1893,7 +2261,7 @@ var DeepdotsPopups = class {
     }
     if (!this.popupContainer) return;
     const container = this.popupContainer;
-    void import("./renderPopup-PS3NJDUR.mjs").then(({ renderPopup }) => {
+    void import("./renderPopup-ZYXOUBCP.mjs").then(({ renderPopup }) => {
       renderPopup(
         container,
         surveyId,
@@ -2106,7 +2474,8 @@ function setupReactNative(sdk2, config, deps = {}) {
   if (deps.appState?.addEventListener) {
     subscription = deps.appState.addEventListener("change", (state) => {
       if (state === "active") sdk2.onForeground();
-      else sdk2.onBackground();
+      else if (state === "background") sdk2.onBackground();
+      else sdk2.flushAnalytics();
     });
   }
   return () => {
@@ -2152,9 +2521,10 @@ function DeepdotsProvider({ config, children }) {
     survey ? /* @__PURE__ */ jsx(Modal, { visible: true, transparent: true, animationType: "slide", children: /* @__PURE__ */ jsx(View, { style: { flex: 1 }, children: /* @__PURE__ */ jsx(
       WebView,
       {
+        style: { flex: 1 },
         originWhitelist: ["*"],
         javaScriptEnabled: true,
-        source: { html: survey.html },
+        source: { html: survey.html, baseUrl: "https://sdk.deepdots.com/" },
         onMessage: (e) => rendererRef.current?.handleMessage(e.nativeEvent.data)
       }
     ) }) }) : null