@vio-live/web-sdk 0.7.0 → 0.9.0

package/dist/core/index.d.ts

@@ -802,6 +802,45 @@ interface QliroOrder {
     total_price?: number;
 }
 
+/**
+ * Walley (former Collector) — embedded checkout via Vio Commerce.
+ *
+ * Third embedded provider, same category as Kustom/Qliro: the widget
+ * collects address, shipping AND payment by itself.
+ *
+ *   1. `Payment { CreatePaymentWalley }` initializes the session (sponsor-key
+ *      authed; the seller's own Walley credentials live server-side, per
+ *      seller, never here) and returns a SYNTHESIZED html_snippet — Walley's
+ *      real embed is a `<script data-token>` loader, so shopcart wraps it
+ *      in the same shape Kustom/Qliro use, and this module reuses their
+ *      exact script-executing injection.
+ *   2. Walley's own script renders the iframe. On completion it dispatches
+ *      the DOM event `walleyCheckoutPurchaseCompleted` — the PRIMARY success
+ *      signal, no page reload needed. `redirectPageUri` is registered too
+ *      (`?checkout_id=…&payment_processor=WALLEY`, same contract as
+ *      Kustom/Qliro) as a safety net in case the event is missed (tab
+ *      backgrounded, page reload).
+ *   3. Either path re-reads the session (`Payment { GetWalleyOrder }`) BY
+ *      OWNING CHECKOUT — same as Qliro — and re-renders Walley's own
+ *      receipt.
+ *
+ * The Commerce order itself is created server-side by Walley's notification
+ * webhook (shopcart /checkout/payment/walley/ok) — the browser never
+ * confirms money.
+ */
+
+/** Normalized Walley session (shopcart maps privateId/publicToken/status). */
+interface WalleyOrder {
+    order_id: string;
+    /** Walley status: Initialized | CustomerIdentified | CommittedToPurchase | PurchaseCompleted | Aborted. */
+    status: string;
+    html_snippet: string;
+    public_token?: string;
+    purchase_country?: string;
+    purchase_currency?: string;
+    total_price?: number;
+}
+
 /**
  * Checkout types — multi-sponsor compatible.
  *
@@ -809,7 +848,7 @@ interface QliroOrder {
  * merchant, same as iOS multi-sponsor model). Multiple sponsors → multiple
  * sequential checkouts.
  */
-type PaymentMethod = 'apple-pay' | 'klarna' | 'vipps' | 'card' | 'stripe' | 'kustom' | 'qliro';
+type PaymentMethod = 'apple-pay' | 'klarna' | 'vipps' | 'card' | 'stripe' | 'kustom' | 'qliro' | 'walley';
 interface CheckoutAddress {
     firstName: string;
     lastName: string;
@@ -988,6 +1027,15 @@ declare class CheckoutManager extends EventTarget {
     mountQliroCheckout(container: HTMLElement, sponsorId?: number): Promise<QliroOrder>;
     /** Re-read the Qliro order owned by a checkout — the confirmation trip. */
     getQliroOrder(checkoutId: string, sponsorId?: number): Promise<QliroOrder | null>;
+    /**
+     * Mount the Walley embedded checkout. `onPurchaseCompleted` fires as soon
+     * as Walley's own script dispatches its success event INSIDE the widget —
+     * no redirect needed. `getWalleyOrder`/the confirmation-URL fallback
+     * remain for the case the event is missed (tab backgrounded, reload).
+     */
+    mountWalleyCheckout(container: HTMLElement, sponsorId?: number, onPurchaseCompleted?: (order: WalleyOrder) => void): Promise<WalleyOrder>;
+    /** Re-read the Walley session owned by a checkout — the confirmation trip. */
+    getWalleyOrder(checkoutId: string, sponsorId?: number): Promise<WalleyOrder | null>;
     setAddress(address: CheckoutAddress): void;
     selectPaymentMethod(method: PaymentMethod): void;
     /**
@@ -1336,6 +1384,6 @@ declare const Vio: VioFacade;
  *
  * RELEASE CHECKLIST: bump together with package.json (see CONTRIBUTING).
  */
-declare const SDK_VERSION = "0.5.1";
+declare const SDK_VERSION = "0.9.0";
 
 export { ADD_ITEM_MUTATION, type AddManualOptions, type AddProductOptions, type AnalyticsCommerce, type AnalyticsContext, type AnalyticsEventName, type AnalyticsItemInput, AnalyticsManager, type AnalyticsStartOptions, type ApplePayConfig, type ApplePayResult, type BootstrapResponse, CREATE_CART_MUTATION, CREATE_CHECKOUT_MUTATION, CREATE_PAYMENT_STRIPE_MUTATION, CREATE_PAYMENT_VIPPS_MUTATION, type CartChangeDetail, type CartLineItem, CartManager, type CartQueryOptions, type CheckoutAddress, type CheckoutChangeDetail, CheckoutManager, type CheckoutState, CommerceClient, Configuration, type CreatePaymentVippsResponse, type CreatePaymentVippsVariables, DELETE_ITEM_MUTATION, type Environment, GET_AVAILABLE_PAYMENT_METHODS_QUERY, GET_CART_QUERY, GET_CHECKOUT_QUERY, GET_LINE_ITEMS_BY_SUPPLIER_QUERY, GET_VIPPS_STATUS_QUERY, type GetVippsStatusVariables, type ImageSize, type PaymentCompleteDetail, type PaymentMethod, type PaymentSelectDetail, type PlacementComponent, type Product, type ProductCategory, type ProductImage, type ProductOption, type ProductPrice, type ProductVariant, type ResolvedConfig, SDK_VERSION, type Sponsor, type SponsorCartState, type SponsorCommerceBlock, type TrackOptions, UPDATE_CHECKOUT_MUTATION, UPDATE_ITEM_MUTATION, UPDATE_SHIPPINGS_BY_SUPPLIER_MUTATION, Vio, VioApi, VioApiError, type VioConfig, type VippsPaymentState, type VippsStatusResult, 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 };

package/dist/core/index.js

@@ -1,4 +1,4 @@
 import '../chunk-QYQQ5J6E.js';
-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, 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 } from '../chunk-4ZEN4J7I.js';
+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, 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 } from '../chunk-SNIF67UB.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/index.js

@@ -1,4 +1,4 @@
 import './chunk-QYQQ5J6E.js';
-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, 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 } from './chunk-4ZEN4J7I.js';
+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, 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 } from './chunk-SNIF67UB.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/react/index.d.ts

@@ -1,6 +1,6 @@
 import * as _lit_react from '@lit/react';
-import { V as VioCart$1, a as VioCheckout$1, b as VioProduct$1, c as VioProductCarousel$1, d as VioProductDetail$1 } from '../tokens-CCZuuTN6.js';
-export { e as VioThemeOverrides, f as VioTokens, g as applyVioTheme } from '../tokens-CCZuuTN6.js';
+import { V as VioCart$1, a as VioCheckout$1, b as VioProduct$1, c as VioProductCarousel$1, d as VioProductDetail$1 } from '../tokens-CrO2ciCS.js';
+export { e as VioThemeOverrides, f as VioTokens, g as applyVioTheme } from '../tokens-CrO2ciCS.js';
 import 'lit-html';
 import 'lit';
 

package/dist/react/index.js

@@ -1,6 +1,6 @@
-import { registerVioElements, VioProduct, VioProductCarousel, VioProductDetail, VioCart, VioCheckout } from '../chunk-GPMDZSC2.js';
-export { VioTokens, applyVioTheme } from '../chunk-GPMDZSC2.js';
-import '../chunk-4ZEN4J7I.js';
+import { registerVioElements, VioProduct, VioProductCarousel, VioProductDetail, VioCart, VioCheckout } from '../chunk-OTL6QM3G.js';
+export { VioTokens, applyVioTheme } from '../chunk-OTL6QM3G.js';
+import '../chunk-SNIF67UB.js';
 import * as React from 'react';
 
 // node_modules/@lit/react/node/create-component.js

package/dist/{tokens-CCZuuTN6.d.ts → tokens-CrO2ciCS.d.ts}

@@ -319,6 +319,8 @@ declare class VioCheckout extends LitElement {
     private kustomMountedOrderId;
     private qliroMounting;
     private qliroMountedOrderId;
+    private walleyMounting;
+    private walleyMountedOrderId;
     /** Redirecting to the Stripe / Vipps hosted page. */
     private stripeLoading;
     private vippsLoading;
@@ -434,6 +436,15 @@ declare class VioCheckout extends LitElement {
     private mountQliroIfNeeded;
     private unmountQliro;
     private renderQliroPanel;
+    /**
+     * Mount the Walley embedded checkout once it's the chosen method. Unlike
+     * Kustom/Qliro, success is signalled INLINE by Walley's own DOM event
+     * (`walleyCheckoutPurchaseCompleted`) — no redirect round-trip needed, so
+     * we handle it here instead of only in the confirmation-return branch.
+     */
+    private mountWalleyIfNeeded;
+    private unmountWalley;
+    private renderWalleyPanel;
     private renderKlarnaPanel;
     /** Express layout — only the Klarna widget + a compact order summary. */
     private renderKlarnaExpress;
@@ -521,6 +532,8 @@ declare const VioTokens: {
         readonly sm: "2px";
         readonly md: "4px";
         readonly lg: "8px";
+        /** Sheet/drawer corners — the largest surface radius in the checkout. */
+        readonly xl: "16px";
         readonly full: "9999px";
     };
 };
@@ -535,10 +548,16 @@ declare const VioTokens: {
  * `injectTokens` installs above, regardless of import/injection order — no
  * specificity fights, no reaching for `!important`.
  *
- * A curated subset on purpose: colors + fonts are what a merchant/publisher
- * actually wants a "brand settings" panel for. Spacing/radius/sizes stay
- * internal — expose them here later if a real need shows up, don't
- * speculatively surface the whole token set as public API.
+ * A curated subset on purpose — colors, fonts, corner radius and the spacing
+ * steps the checkout actually uses. Radius and spacing were added once the
+ * need was real (brand panels in Vev/Replit): corner shape is the strongest
+ * identity lever after colour, and the spacing steps drive comfortable-vs-
+ * compact density. The rest of the token set (sizes, tracking, line heights)
+ * stays internal — don't speculatively surface it as public API.
+ *
+ * Panels are expected to present these as a few opinionated choices (e.g.
+ * "Sharp / Default / Rounded") rather than four raw pixel inputs; the API
+ * stays per-token so a panel can compose whatever presets it wants.
  *
  * Host integrations (the Vio Config panel in Vev, a future Replit CMS
  * panel, anything else) should call this ONE function — never set
@@ -558,6 +577,18 @@ interface VioThemeOverrides {
     colorBorderDefault?: string;
     fontSerif?: string;
     fontSans?: string;
+    /** Corner radius. `sm` = drag handles, `lg` = controls (chips, notices,
+     *  shipping options), `xl` = the sheet/drawer itself. Set all three to `0`
+     *  for a square look, or raise `xl` for a softer one. */
+    radiusSm?: string;
+    radiusMd?: string;
+    radiusLg?: string;
+    radiusXl?: string;
+    /** Spacing steps — drive checkout density (compact vs comfortable). */
+    spaceSm?: string;
+    spaceMd?: string;
+    spaceLg?: string;
+    spaceXl?: string;
 }
 /**
  * Apply (or clear) theme overrides. Pass `null`/`undefined` for a key to

package/dist/ui/index.d.ts

@@ -1,4 +1,4 @@
-export { V as VioCart, a as VioCheckout, b as VioProduct, c as VioProductCarousel, d as VioProductDetail, e as VioThemeOverrides, f as VioTokens, g as applyVioTheme } from '../tokens-CCZuuTN6.js';
+export { V as VioCart, a as VioCheckout, b as VioProduct, c as VioProductCarousel, d as VioProductDetail, e as VioThemeOverrides, f as VioTokens, g as applyVioTheme } from '../tokens-CrO2ciCS.js';
 import 'lit-html';
 import 'lit';
 

package/dist/ui/index.js

@@ -1,6 +1,6 @@
-import { registerVioElements } from '../chunk-GPMDZSC2.js';
-export { VioCart, VioCheckout, VioProduct, VioProductCarousel, VioProductDetail, VioTokens, applyVioTheme, registerVioElements } from '../chunk-GPMDZSC2.js';
-import '../chunk-4ZEN4J7I.js';
+import { registerVioElements } from '../chunk-OTL6QM3G.js';
+export { VioCart, VioCheckout, VioProduct, VioProductCarousel, VioProductDetail, VioTokens, applyVioTheme, registerVioElements } from '../chunk-OTL6QM3G.js';
+import '../chunk-SNIF67UB.js';
 
 // src/ui/index.ts
 registerVioElements();

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vio-live/web-sdk",
-  "version": "0.7.0",
-  "description": "Vio Web SDK — in-site shoppable + native checkout, designed for editorial commerce sites",
+  "version": "0.9.0",
+  "description": "Vio Web SDK \u2014 in-site shoppable + native checkout, designed for editorial commerce sites",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",