@vio-live/web-sdk 0.32.0 → 0.33.0

package/CHANGELOG.md

@@ -14,6 +14,54 @@ How to keep this file: see [CONTRIBUTING → Changelog](CONTRIBUTING.md#changelo
 The details of each feature live in the [README](README.md); this file says *what*
 and *when*, and links there.
 
+## 0.33.0 — 2026-10-28
+
+### Fixed
+- **One cart per connection.** Every connection of a site (environment + key) shared one stored
+  cart, and every tab adopted what the others wrote: two tabs on two connections (Staging and Prod
+  side by side) could take each other's cart for a moment. Each connection now keeps its own
+  (`vio.cart.v1:<environment>:<hash of the key>` — never the key itself), a tab only listens to
+  its own, and `Vio.init` with another key switches `Vio.cart` to that connection's carts (the
+  first one's come back if the page switches back). An answer that arrives for the connection the
+  page left lands in that connection's cart, silently — never in the new one.
+- **The commerce key is the channel of the article's campaign, not the sponsor's first block.**
+  With two campaigns of one sponsor on a surface (Careless: campaign 2 on channel 482, an internal
+  test campaign 1 on channel 480), products, carts and checkouts used the default campaign's
+  channel even for an article of the other. The key now follows the campaign in context (the
+  click's `campaignId`, `vio-campaign`, `data-vio-campaign`, `Vio.init`'s), among the sponsor's
+  blocks (a block with `commerce: null` is skipped instead of throwing). `Vio.commerceFor(sponsorId)`
+  still works and takes an optional `{ campaignId?, channelId? }`; commerce clients are kept per
+  sponsor and key. New: `Vio.sponsorCommerce(sponsorId, ctx?)`.
+- **A cart remembers its channel.** `SponsorCartState.channelId` is stored when the backend cart is
+  created, and every later cart and checkout call for it (also the return from Vipps / Stripe,
+  through the per-checkout memory) uses that channel's key. If the bootstrap no longer lists the
+  channel, the stale `cartId` is dropped and the cart is created again on the current channel with
+  its lines — never a call with another channel's key. Carts from before keep the sponsor's first
+  block, as when they were created.
+- **The order's campaign belongs to the cart's sponsor.** `attribution.campaign_id` on the checkout
+  and `campaignId` on `vio:checkout-created` (→ `add_payment_info`) took the page's campaign even
+  when it was another sponsor's. Now: the campaign the cart's lines were added from, else the
+  page's (`data-vio-campaign` / `vio-campaign` on the page, then `Vio.init`'s) only when the sponsor
+  takes part in it, else the slices' rule — only campaigns of that sponsor.
+- **The bootstrap no longer lives for the whole page.** When the tab becomes visible again and the
+  cached bootstrap is older than 5 minutes, it is fetched again (the old one stays until the new
+  one arrives, and if the refresh fails). Carts keep their lines; an open checkout keeps paying
+  with its channel's key.
+- **«Frakt & retur» no longer shows filler as the delivery time.** A rate's description equal to
+  its own name (dashboard-created rates copied it), `By Outshifter` or `Default Shipping Method`
+  (products' defaults) is no description in `getShippingRates`; the detail also drops one equal
+  to the product's title or the brand / seller name.
+
+### ⚠️ Upgrade notes
+- **Hosts with several articles (Replit, Vev):** pass `sponsorId` **and** `campaignId` on
+  `vio:product-click`, set `data-vio-campaign` on each article's wrapper, and do **not** set a
+  site-wide `Vio.init({ campaignId })` — the campaign in context decides which channel sells.
+- The carts kept in the old shared entry move, once, to the first connection that opens with none
+  of its own. Nothing to do.
+- `Vio.cart` is the same object for the whole page, so listeners added to it keep working across a
+  re-init. A host that archived and restored carts per connection itself (Replit's
+  `vioCartConnections`) can rely on this instead.
+
 ## 0.32.0 — 2026-10-28
 
 > First version published to npm since 0.29.0: **0.30.0 and 0.31.0 were never published on their own** — their

package/README.md

@@ -226,7 +226,7 @@ a campaign to a slot. But an editorial page — a Vev article, a Replit article
 often *is* part of one campaign, and the page can say so:
 
 ```ts
-Vio.init({ apiKey: '…', campaignId: 12 })          // the whole page
+Vio.init({ apiKey: '…', campaignId: 12 })          // the whole page — only on a page of ONE campaign
 ```
 
 ```html
@@ -243,6 +243,19 @@ ancestors. On web/Replit a **per-article** campaign needs a per-article scope to
 same `carousel-1`, and the articles' campaigns would overwrite one another's
 assignment; Vev ids are per block, so it does not apply there. What it does:
 
+- **Which channel sells.** One article = one campaign = one channel = one
+  sponsor, and one sponsor may run several campaigns on a surface, each on its own
+  commerce channel. The SDK reads products, creates the cart and pays with the key
+  of the channel of the **campaign in context** — the click's `campaignId`, the
+  element's `vio-campaign`, an ancestor's `data-vio-campaign`, then `Vio.init`'s —
+  among the blocks of that sponsor (`Vio.sponsorCommerce(sponsorId, { campaignId })`,
+  `Vio.commerceFor(sponsorId, { campaignId })`); without one, the sponsor's first
+  block, as before. A cart remembers the channel it was created on (`channelId`)
+  and every later cart and checkout call uses that channel's key; if the bootstrap
+  no longer lists that channel, the cart is created again on the current one with
+  its lines. So on a site with several articles (Replit, Vev), **set
+  `data-vio-campaign` per article and pass `sponsorId` and `campaignId` on
+  `vio:product-click`; do not set a site-wide `Vio.init({ campaignId })`.**
 - **Declaration.** The manifest carries the page's campaign (top-level) and an
   element's own campaign per location when it differs. The campaigns service
   (campaigns micro PR #16) turns that into assignments of the page's slots
@@ -372,9 +385,11 @@ Since 0.26 the origins do not stay in the browser: **Commerce receives them**
 - **Per checkout.** `CreateCheckout` and the `UpdateCheckout` right before paying
   carry `attribution`: `surface_key` (the SDK key — the gateway sets it from
   `X-API-Key` anyway, and shopcart checks it against the cart's channel, so a page
-  cannot credit a sale to another surface), `campaign_id` (the page's campaign,
-  `Vio.pageCampaign()` — else the campaign that explains most units of the cart under
-  the same rule `purchase` is split by), `content_url` / `content_title` (the page at
+  cannot credit a sale to another surface), `campaign_id` (always a campaign the
+  cart's sponsor takes part in: the campaign the cart's lines were added from, else
+  the page's — `data-vio-campaign` / `vio-campaign` on the page, then `Vio.init`'s —
+  else the campaign that explains most units of the cart under the same rule
+  `purchase` is split by), `content_url` / `content_title` (the page at
   pay time) and `entry` (`{ referrer, utm_source, utm_medium, utm_campaign,
   landing_url }`: the landing the session **remembers** — the same memory the
   `client` block reads, which now keeps the landing page too — never the page the

package/dist/{chunk-C5Q6W4B2.js → chunk-T5B74YBQ.js}

@@ -1,4 +1,4 @@
-import { Vio, __decorateClass, primaryImageUrl, displayPrice, toCampaignId, getGlobalCurrency, ensureVippsButton, formatPrice, buyerRefOf, nexiReturnPaymentId, readNexiPending, kustomReturnOutcome, KUSTOM_RETURN_QUERY_KEYS, storageGet, ADYEN_RETURN_METHOD, adyenReturnParams, ADYEN_RETURN_QUERY_KEYS, adyenReturnOutcome, getGlobalCountryCode, isValidPhone, gatewayHasBuyerRef, rememberedCheckoutSponsor, checkoutSponsorOf, AdyenOriginError, normalizeSlotId, autoSlotDisplayName, autoSlotId, sponsorIdentityFrom, Configuration, normalizeScope, campaignCandidates } from './chunk-IR4XYTZL.js';
+import { Vio, __decorateClass, primaryImageUrl, displayPrice, toCampaignId, getGlobalCurrency, ensureVippsButton, formatPrice, shippingDescriptionOf, buyerRefOf, nexiReturnPaymentId, readNexiPending, kustomReturnOutcome, KUSTOM_RETURN_QUERY_KEYS, storageGet, ADYEN_RETURN_METHOD, adyenReturnParams, ADYEN_RETURN_QUERY_KEYS, adyenReturnOutcome, getGlobalCountryCode, isValidPhone, gatewayHasBuyerRef, rememberedCheckoutSponsor, checkoutSponsorOf, AdyenOriginError, normalizeSlotId, autoSlotDisplayName, autoSlotId, sponsorIdentityFrom, Configuration, normalizeScope, campaignCandidates } from './chunk-ZORYG4W3.js';
 import { LitElement, css, html, nothing } from 'lit';
 import { property, state, query } from 'lit/decorators.js';
 
@@ -1151,6 +1151,21 @@ var VioProductCarousel = class extends LitElement {
    * sponsor of the campaign the slot shows (ADR-0034 — "the campaign of the
    * block is its sponsor"), else 0 (unknown).
    */
+  /**
+   * The campaign whose channel sells a sponsor's products here (one article =
+   * one campaign = one channel): the campaign this slot credits for that
+   * sponsor (`Vio.attribution`), then the element's own (`vio-campaign`, an
+   * ancestor's `data-vio-campaign`).
+   */
+  commerceCampaigns(sponsorId) {
+    const own = this.slotRegistration.campaignHint;
+    try {
+      const resolved = typeof Vio.attribution === "function" ? Vio.attribution(this.effectiveSlot || null, { sponsorId, campaignId: own }).campaignId : void 0;
+      return resolved !== void 0 ? [resolved, ...own] : own;
+    } catch {
+      return own;
+    }
+  }
   effectiveSponsorId() {
     if (this.sponsorId > 0) return this.sponsorId;
     const fromSlot = typeof Vio.campaignForSlot === "function" ? Number(Vio.campaignForSlot(this.effectiveSlot || null, { campaignId: this.slotRegistration.campaignHint })?.primarySponsor?.id) : NaN;
@@ -1188,7 +1203,7 @@ var VioProductCarousel = class extends LitElement {
       }
       const fetched = await Promise.all(
         Array.from(bySponsor.entries()).map(async ([sponsorId2, ids]) => {
-          const commerce = this.commerceKey && this.productRefs.trim() === "" ? Vio.commerceWithKey(this.commerceKey) : Vio.commerceFor(sponsorId2);
+          const commerce = this.commerceKey && this.productRefs.trim() === "" ? Vio.commerceWithKey(this.commerceKey) : Vio.commerceFor(sponsorId2, { campaignId: this.commerceCampaigns(sponsorId2) });
           const products = await commerce.channel.product.getByIds({
             product_ids: ids,
             currency: this.currency,
@@ -2204,6 +2219,21 @@ var VioProductDetail = class extends LitElement {
     const own = this.slotRegistration.campaignHint;
     return this.fromCard && this.eventCampaignId !== void 0 ? [this.eventCampaignId, ...own] : own;
   }
+  /**
+   * The campaign whose channel sells the open product (one article = one
+   * campaign = one channel): the campaign its events credit, then the opening
+   * click's and this element's own — so the product, its rates and its
+   * seller are read with that channel's key, the one the cart is created on.
+   */
+  commerceCampaigns() {
+    const hint = this.activeCampaignHint;
+    try {
+      const resolved = this.attribution().campaignId;
+      return typeof resolved === "number" ? [resolved, ...hint] : hint;
+    } catch {
+      return hint;
+    }
+  }
   slotAttributes() {
     return {
       vioSlot: this.vioSlot,
@@ -3319,7 +3349,7 @@ var VioProductDetail = class extends LitElement {
       try {
         const activeCurrency = getGlobalCurrency() || this.currency;
         this.currency = activeCurrency;
-        const commerce = Vio.commerceFor(this.sponsorId);
+        const commerce = Vio.commerceFor(this.sponsorId, { campaignId: this.commerceCampaigns() });
         products = await commerce.channel.product.getByIds({
           product_ids: [productIdNum],
           currency: activeCurrency,
@@ -4019,7 +4049,7 @@ var VioProductDetail = class extends LitElement {
   async loadShippingFrom(productId, seq) {
     let rates = null;
     try {
-      const product = Vio.commerceFor(this.sponsorId).channel.product;
+      const product = Vio.commerceFor(this.sponsorId, { campaignId: this.commerceCampaigns() }).channel.product;
       rates = typeof product.getShippingRates === "function" ? await product.getShippingRates(productId, { currency: this.currency }) : null;
     } catch {
       rates = null;
@@ -4135,7 +4165,12 @@ var VioProductDetail = class extends LitElement {
    */
   renderShippingReturns() {
     const identity = resolveSponsorIdentity(this.sponsorId);
-    const rates = this.shippingRates;
+    const rates = shippingRatesShown(this.shippingRates, [
+      this.product?.title,
+      this.product?.brand,
+      this.sellerName,
+      identity?.name
+    ]);
     const times = [...new Set(rates.map((r) => r.description).filter(Boolean))];
     const perRateTime = times.length > 1;
     const sharedTime = times.length === 1 ? times[0] : times.length === 0 && this.deliveryTime.trim() ? `Leveringstid: ${this.deliveryTime.trim()}` : "";
@@ -4188,7 +4223,7 @@ var VioProductDetail = class extends LitElement {
   async loadSeller(productId, seq) {
     let name = null;
     try {
-      name = await Vio.commerceFor(this.sponsorId).channel.product.getSellerCompany(productId);
+      name = await Vio.commerceFor(this.sponsorId, { campaignId: this.commerceCampaigns() }).channel.product.getSellerCompany(productId);
     } catch {
       name = null;
     }
@@ -4657,6 +4692,9 @@ function normalizeValues(raw) {
   }
   return [];
 }
+function shippingRatesShown(rates, repeats = []) {
+  return rates.map((r) => ({ ...r, description: shippingDescriptionOf(r.description, [r.name, ...repeats]) }));
+}
 function splitRateName(name) {
   const text = String(name ?? "").trim();
   const m = text.match(/^(.+?)\s+[-–—]\s+(.+)$/);
@@ -9353,5 +9391,5 @@ function registerVioElements() {
 }
 
 export { VioCart, VioCheckout, VioProduct, VioProductCarousel, VioProductDetail, VioTokens, applyVioTheme, registerVioElements };
-//# sourceMappingURL=chunk-C5Q6W4B2.js.map
-//# sourceMappingURL=chunk-C5Q6W4B2.js.map
+//# sourceMappingURL=chunk-T5B74YBQ.js.map
+//# sourceMappingURL=chunk-T5B74YBQ.js.map