@vio-live/web-sdk 0.9.1 → 0.11.0

package/dist/{chunk-WKJRYYNI.js → chunk-U2QG4IVJ.js}

@@ -1805,6 +1805,23 @@ var CartManager = class extends EventTarget {
     const targetItemId = item.cartItemId;
     if (quantity <= 0) {
       cart.items = cart.items.filter((i) => i !== item);
+      if (typeof document !== "undefined") {
+        document.dispatchEvent(
+          new CustomEvent("vio:removed-from-cart", {
+            bubbles: true,
+            detail: {
+              productId: item.productId,
+              variantId: item.variantId,
+              name: item.name,
+              brand: item.brand,
+              price: item.unitPrice,
+              quantity: item.quantity,
+              currency: item.currency,
+              sponsorId
+            }
+          })
+        );
+      }
     } else {
       item.quantity = quantity;
     }
@@ -2554,10 +2571,33 @@ function renderKustomSnippet(container, htmlSnippet) {
 }
 
 // src/core/checkout/payments/qliro.ts
+function readVioTheme() {
+  if (typeof globalThis === "undefined") return void 0;
+  const doc = globalThis.document;
+  const getComputed = globalThis.getComputedStyle;
+  if (!doc?.documentElement || typeof getComputed !== "function") return void 0;
+  let style;
+  try {
+    style = getComputed(doc.documentElement);
+  } catch {
+    return void 0;
+  }
+  const read = (name) => {
+    const value = style?.getPropertyValue?.(name)?.trim();
+    return value || void 0;
+  };
+  const theme = {
+    accent: read("--vio-color-accent"),
+    surface: read("--vio-color-surface"),
+    radiusMd: read("--vio-radius-md"),
+    radiusLg: read("--vio-radius-lg")
+  };
+  return Object.values(theme).some(Boolean) ? theme : void 0;
+}
 var CREATE_PAYMENT_QLIRO_MUTATION = `
-mutation CreatePaymentQliro($checkoutId: String!, $countryCode: String!, $href: String!, $email: String) {
+mutation CreatePaymentQliro($checkoutId: String!, $countryCode: String!, $href: String!, $email: String, $theme: QliroThemeInput) {
   Payment {
-    CreatePaymentQliro(checkout_id: $checkoutId, country_code: $countryCode, href: $href, email: $email) {
+    CreatePaymentQliro(checkout_id: $checkoutId, country_code: $countryCode, href: $href, email: $email, theme: $theme) {
       order_id
       status
       html_snippet
@@ -2591,6 +2631,139 @@ async function getQliroOrder(checkoutId, options) {
   return json?.data?.Payment?.GetQliroOrder ?? null;
 }
 
+// src/core/checkout/payments/qliro-sync.ts
+var SYNC_PAYMENT_QLIRO_MUTATION = `
+mutation SyncPaymentQliro($checkoutId: String!) {
+  Payment {
+    SyncPaymentQliro(checkout_id: $checkoutId) {
+      order_id
+      update_version
+      total_price
+    }
+  }
+}
+`;
+async function syncPaymentQliro(checkoutId, options) {
+  const json = await executeCartGraphQL(SYNC_PAYMENT_QLIRO_MUTATION, { checkoutId }, options);
+  return json?.data?.Payment?.SyncPaymentQliro ?? null;
+}
+var DEFAULT_UNLOCK_TIMEOUT_MS = 15e3;
+function installQliroListeners(options) {
+  const { checkoutId, queryOptions, onEvent } = options;
+  const unlockTimeoutMs = options.unlockTimeoutMs ?? DEFAULT_UNLOCK_TIMEOUT_MS;
+  const win = globalThis;
+  let q1 = null;
+  let destroyed = false;
+  let pending = null;
+  const emit = (event) => {
+    try {
+      onEvent?.(event);
+    } catch {
+    }
+  };
+  const settle = () => {
+    if (!pending) return;
+    clearTimeout(pending.timer);
+    const { resolve } = pending;
+    pending = null;
+    try {
+      q1?.unlock();
+    } catch {
+    }
+    resolve();
+  };
+  const acknowledges = (echo, version) => {
+    if (version === null) return false;
+    return !echo || echo === version;
+  };
+  const settleIfAcknowledged = () => {
+    if (!pending) return;
+    if (pending.echoes.some((echo) => acknowledges(echo, pending.version))) {
+      settle();
+    }
+  };
+  const previousQ1Ready = win.q1Ready;
+  win.q1Ready = (instance) => {
+    try {
+      previousQ1Ready?.(instance);
+    } catch {
+    }
+    if (destroyed) return;
+    q1 = instance;
+    instance.onCheckoutLoaded(() => emit({ type: "loaded" }));
+    instance.onOrderUpdated((order) => {
+      if (!pending) return;
+      const echoed = order?.merchantUpdateVersion ?? order?.MerchantUpdateVersion ?? null;
+      pending.echoes.push(echoed);
+      settleIfAcknowledged();
+    });
+    instance.onShippingMethodChanged(
+      (shipping) => emit({ type: "shipping-changed", shipping })
+    );
+    instance.onShippingPriceChanged(
+      (price, totalPrice) => emit({ type: "shipping-price-changed", price, totalPrice })
+    );
+    instance.onCustomerInfoChanged(
+      (customer) => emit({ type: "customer-changed", customer })
+    );
+    instance.onPaymentMethodChanged(
+      (paymentMethod) => emit({ type: "payment-method-changed", paymentMethod })
+    );
+    instance.onPaymentDeclined(
+      (reason, message) => emit({ type: "payment-declined", reason, message })
+    );
+    instance.onSessionExpired(() => {
+      emit({ type: "session-expired" });
+      void controller.sync();
+    });
+  };
+  const controller = {
+    async sync() {
+      if (destroyed) return null;
+      if (pending) settle();
+      try {
+        q1?.lock();
+      } catch {
+      }
+      const settled = new Promise((resolve) => {
+        pending = {
+          version: null,
+          echoes: [],
+          resolve,
+          timer: setTimeout(settle, unlockTimeoutMs)
+        };
+      });
+      let result = null;
+      try {
+        result = await syncPaymentQliro(checkoutId, queryOptions);
+      } catch (error) {
+        emit({ type: "sync-failed", error });
+        settle();
+        await settled;
+        return null;
+      }
+      if (destroyed || !result?.update_version || !q1) {
+        settle();
+        await settled;
+        return result;
+      }
+      if (pending) {
+        pending.version = result.update_version;
+        settleIfAcknowledged();
+      }
+      await settled;
+      return result;
+    },
+    destroy() {
+      destroyed = true;
+      settle();
+      if (win.q1Ready) win.q1Ready = previousQ1Ready;
+      q1 = null;
+    }
+  };
+  return controller;
+}
+
 // src/core/checkout/payments/walley.ts
 var CREATE_PAYMENT_WALLEY_MUTATION = `
 mutation CreatePaymentWalley($checkoutId: String!, $countryCode: String!, $href: String!, $email: String) {
@@ -2866,6 +3039,8 @@ var CheckoutManager = class _CheckoutManager extends EventTarget {
     this.applePayPublishableKey = null;
     this.applePayConnectedAccount = null;
     this.klarnaAvailableCache = null;
+    /** Live q1 listeners while a Qliro widget is mounted. */
+    this.qliroController = null;
     this.klarnaOrderInFlight = false;
     /** Last backend shippings fetched (per-supplier), for UI reuse. */
     this.lastFetchedShippings = [];
@@ -3275,16 +3450,56 @@ var CheckoutManager = class _CheckoutManager extends EventTarget {
         checkoutId,
         countryCode: getGlobalCountryCode(),
         href,
-        email: this.state?.address?.email || void 0
+        email: this.state?.address?.email || void 0,
+        // Qliro cannot be restyled once rendered, so the host page's theme has
+        // to travel with the order.
+        theme: readVioTheme()
       },
       opts
     );
     if (!order?.html_snippet) {
       throw new Error("Qliro order creation failed: missing html_snippet");
     }
+    this.qliroController?.destroy();
+    this.qliroController = installQliroListeners({
+      checkoutId,
+      queryOptions: opts,
+      onEvent: (event) => this.onQliroEvent(event)
+    });
     renderKustomSnippet(container, order.html_snippet);
     return order;
   }
+  /**
+   * Everything the customer does inside the Qliro iframe, re-published as a
+   * DOM event so a host page can follow a checkout it cannot see into.
+   */
+  onQliroEvent(event) {
+    this.dispatchEvent(
+      new CustomEvent("qliro-event", {
+        detail: event,
+        bubbles: true,
+        composed: true
+      })
+    );
+    if (event.type === "shipping-changed" || event.type === "shipping-price-changed") {
+      this.emit();
+    }
+  }
+  /**
+   * Push the current cart onto the open Qliro order.
+   *
+   * Call it after changing the cart while the widget is open: it holds
+   * `q1.lock()` across the round trip and unlocks once Qliro confirms it is
+   * showing the new version. A no-op when no Qliro widget is mounted.
+   */
+  async syncQliroOrder() {
+    return await this.qliroController?.sync() ?? null;
+  }
+  /** Drop the Qliro listeners and release any lock still held. */
+  destroyQliroListeners() {
+    this.qliroController?.destroy();
+    this.qliroController = null;
+  }
   /** Re-read the Qliro order owned by a checkout — the confirmation trip. */
   async getQliroOrder(checkoutId, sponsorId) {
     const opts = await getCartGraphQLOptions(sponsorId ?? this.state?.sponsorId);
@@ -4154,7 +4369,7 @@ function toSmallestUnit(amount, currency) {
 }
 
 // src/core/version.ts
-var SDK_VERSION = "0.9.1";
+var SDK_VERSION = "0.11.0";
 
 // src/core/analytics/analytics-manager.ts
 var SESSION_TTL_MS = 30 * 60 * 1e3;
@@ -4176,6 +4391,9 @@ var AnalyticsManager = class extends EventTarget {
     this.retryAttempt = 0;
     this.retryNotBefore = 0;
     this.sessionId = null;
+    this.requireConsent = false;
+    this.consentGranted = false;
+    this.anonIdCache = null;
     /** Set via start({ sessionId }) — the host owns the session, we follow. */
     this.externalSessionId = null;
     this.sessionStartedAt = 0;
@@ -4191,7 +4409,29 @@ var AnalyticsManager = class extends EventTarget {
    * Install listeners + begin flushing. Explicit on purpose (no module
    * side-effects). Safe to call twice (second call only updates options).
    */
+  /**
+   * Consentimiento (ePrivacy/GDPR). Por defecto el SDK asume que el host ya
+   * lo gestionó — su CMP decide si nos carga. Con `requireConsent: true`
+   * arranca en modo **cookieless**: mide la visita con ids efímeros en
+   * memoria y NO escribe nada en localStorage hasta que el host llame
+   * `setConsent(true)`. Retirarlo borra lo persistido.
+   */
+  setConsent(granted) {
+    this.consentGranted = granted;
+    if (granted) {
+      if (this.anonIdCache) safeStorageSet(ANON_KEY, this.anonIdCache);
+      if (this.sessionId) this.persistSession();
+      return;
+    }
+    safeStorageRemove(ANON_KEY);
+    safeStorageRemove(SESSION_KEY);
+  }
+  /** ¿Podemos escribir en el dispositivo? */
+  get canPersist() {
+    return !this.requireConsent || this.consentGranted;
+  }
   start(options = {}) {
+    this.requireConsent = options.requireConsent === true;
     this.options = {
       host: options.host ?? this.options.host,
       collector: options.collector ?? this.options.collector,
@@ -4341,6 +4581,7 @@ var AnalyticsManager = class extends EventTarget {
       content_id: ctx.contentId,
       // Deletion-proof reporting: sources have no trash bin — the title
       // snapshotted at event time keeps reports legible if content dies.
+      error_code: ctx.errorCode,
       content_title: ctx.contentTitle ?? (typeof document !== "undefined" && document.title ? document.title.slice(0, 255) : void 0),
       variant: ctx.variant
     });
@@ -4376,18 +4617,35 @@ var AnalyticsManager = class extends EventTarget {
       ...opts.props ? { props: opts.props } : {}
     };
   }
+  /** Guarda la sesión solo si podemos escribir en el dispositivo. */
+  persistSession(now = Date.now()) {
+    if (!this.canPersist || !this.sessionId) return;
+    safeStorageSet(
+      SESSION_KEY,
+      JSON.stringify({
+        id: this.sessionId,
+        ts: now,
+        startedAt: this.sessionStartedAt ?? now
+      })
+    );
+  }
   anonId() {
-    const stored = safeStorageGet(ANON_KEY);
-    if (stored) return stored;
+    if (this.anonIdCache) return this.anonIdCache;
+    const stored = this.canPersist ? safeStorageGet(ANON_KEY) : null;
+    if (stored) {
+      this.anonIdCache = stored;
+      return stored;
+    }
     const id = `a-${uuid()}`;
-    safeStorageSet(ANON_KEY, id);
-    return safeStorageGet(ANON_KEY) ?? id;
+    if (this.canPersist) safeStorageSet(ANON_KEY, id);
+    this.anonIdCache = (this.canPersist ? safeStorageGet(ANON_KEY) : null) ?? id;
+    return this.anonIdCache;
   }
   /** Rolling session: renewed by activity, rotated after 30 min idle. */
   ensureSession() {
     const now = Date.now();
     if (!this.sessionId) {
-      const stored = safeStorageGet(SESSION_KEY);
+      const stored = this.canPersist ? safeStorageGet(SESSION_KEY) : null;
       if (stored) {
         try {
           const parsed = JSON.parse(stored);
@@ -4399,7 +4657,7 @@ var AnalyticsManager = class extends EventTarget {
         }
       }
     } else {
-      const stored = safeStorageGet(SESSION_KEY);
+      const stored = this.canPersist ? safeStorageGet(SESSION_KEY) : null;
       if (stored) {
         try {
           if (now - JSON.parse(stored).ts >= SESSION_TTL_MS) {
@@ -4421,16 +4679,10 @@ var AnalyticsManager = class extends EventTarget {
       this.sessionId = `s-${uuid()}`;
       this.sessionStartedAt = now;
       this.impressedComponents.clear();
-      safeStorageSet(
-        SESSION_KEY,
-        JSON.stringify({ id: this.sessionId, ts: now, startedAt: now })
-      );
+      this.persistSession(now);
       this.track("session_start");
     } else {
-      safeStorageSet(
-        SESSION_KEY,
-        JSON.stringify({ id: this.sessionId, ts: now, startedAt: this.sessionStartedAt })
-      );
+      this.persistSession(now);
     }
   }
   trackSessionEnd() {
@@ -4495,6 +4747,34 @@ var AnalyticsManager = class extends EventTarget {
         }
       });
     });
+    on("vio:removed-from-cart", (ev) => {
+      const d = ev.detail ?? {};
+      if (d.productId === void 0) return;
+      this.track("remove_from_cart", {
+        context: { sponsorId: d.sponsorId },
+        commerce: {
+          items: [
+            {
+              productId: d.productId,
+              variantId: d.variantId,
+              name: d.name,
+              brand: d.brand,
+              price: d.price,
+              quantity: d.quantity
+            }
+          ],
+          value: (d.price ?? 0) * (d.quantity ?? 1),
+          currency: d.currency
+        }
+      });
+    });
+    on("vio:cart-error", (ev) => {
+      const d = ev.detail ?? {};
+      this.track("sdk_error", {
+        context: { errorCode: "cart_error" },
+        props: d.message ? { message: String(d.message).slice(0, 500) } : void 0
+      });
+    });
     on("vio:product-click", (ev) => {
       const d = ev.detail ?? {};
       if (d.productId === void 0) return;
@@ -4595,6 +4875,12 @@ function safeStorageGet(key) {
     return null;
   }
 }
+function safeStorageRemove(key) {
+  try {
+    window.localStorage.removeItem(key);
+  } catch {
+  }
+}
 function safeStorageSet(key, value) {
   try {
     window.localStorage.setItem(key, value);
@@ -4780,5 +5066,5 @@ var _vioGlobal = globalThis;
 var Vio = _vioGlobal.__VIO_FACADE__ ?? (_vioGlobal.__VIO_FACADE__ = new VioFacade());
 
 export { ADD_ITEM_MUTATION, AnalyticsManager, CREATE_CART_MUTATION, CREATE_CHECKOUT_MUTATION, CREATE_PAYMENT_STRIPE_MUTATION, CREATE_PAYMENT_VIPPS_MUTATION, CartManager, CheckoutManager, CommerceClient, Configuration, DELETE_ITEM_MUTATION, GET_AVAILABLE_PAYMENT_METHODS_QUERY, GET_CART_QUERY, GET_CHECKOUT_QUERY, GET_LINE_ITEMS_BY_SUPPLIER_QUERY, GET_VIPPS_STATUS_QUERY, SDK_VERSION, UPDATE_CHECKOUT_MUTATION, UPDATE_ITEM_MUTATION, UPDATE_SHIPPINGS_BY_SUPPLIER_MUTATION, Vio, VioApi, VioApiError, __decorateClass, addItem, checkApplePayAvailability, createCart, createCheckout, createCommerceClient, createPaymentStripe, createPaymentVipps, createVioApi, deleteItem, displayPrice, executeCartGraphQL, formatPrice, getAvailablePaymentMethods, getCart, getCartGraphQLOptions, getCheckout, getCustomerSessionId, getGlobalCurrency, getLineItemsBySupplier, getVippsStatus, primaryImageUrl, showApplePaySheet, updateCheckout, updateItem, updateShippingsBySupplier };
-//# sourceMappingURL=chunk-WKJRYYNI.js.map
-//# sourceMappingURL=chunk-WKJRYYNI.js.map
+//# sourceMappingURL=chunk-U2QG4IVJ.js.map
+//# sourceMappingURL=chunk-U2QG4IVJ.js.map