@vio-live/web-sdk 0.33.0 → 0.36.0

package/dist/core/index.d.ts

@@ -1,3 +1,5 @@
+import { D as DetailLayout, A as AppliedDetailLayout } from '../detail-layout-BI556w8p.js';
+export { a as DETAIL_SECTION_IDS, b as DetailLayoutAdjustment, c as DetailLayoutOrigin, d as DetailSectionId, E as ESSENTIAL_DETAIL_SECTIONS, e as defaultDetailLayout, f as effectiveDetailSections, n as normalizeDetailLayout, r as resolveDetailLayout } from '../detail-layout-BI556w8p.js';
 import { GraphQLClient } from 'graphql-request';
 
 /**
@@ -581,6 +583,20 @@ interface CartOrigin {
     contentUrl?: string;
     /** Its title (`content_title`, ≤ 255). */
     contentTitle?: string;
+    /**
+     * The layout of `<vio-product-detail>` the units were added from (0.34):
+     * its `id`, `revision`, and the experiment / variant it belongs to — set by
+     * the detail from the layout it showed at that moment, only for a
+     * non-default layout. Kept with the line (localStorage) and never rewritten
+     * by a later configuration; reported per unit on the events with items
+     * (`layout_id`, `layout_revision`, `experiment_id`, `experiment_variant_id`).
+     * Never sent to Commerce. `variantId` here is the EXPERIMENT variant, not the
+     * product variant (`CartLineItem.variantId`).
+     */
+    layoutId?: string;
+    layoutRevision?: string;
+    experimentId?: string;
+    variantId?: string;
 }
 /** One origin of a line and how many of its units came from it. */
 interface CartLineOrigin extends CartOrigin {
@@ -1041,6 +1057,16 @@ declare const ANALYTICS_EVENT_NAMES: readonly ["view_item_list", "select_item",
 type AnalyticsEventName = (typeof ANALYTICS_EVENT_NAMES)[number];
 /** Camel-case for DX; mapped to the snake_case wire format at build time. */
 interface AnalyticsContext {
+    /**
+     * The `<vio-product-detail>` layout shown (0.34), on `view_item` and only
+     * for a non-default layout: `layout_id`, `layout_revision`, `experiment_id`,
+     * `variant_id` in the event's `context` (next to `campaign_id` /
+     * `location_id`). `variantId` is the experiment variant.
+     */
+    layoutId?: string;
+    layoutRevision?: string;
+    experimentId?: string;
+    variantId?: string;
     campaignId?: number;
     broadcastId?: string;
     campaignComponentId?: number;
@@ -1075,9 +1101,22 @@ interface AnalyticsItemInput {
     productId: number | string;
     name?: string;
     brand?: string;
+    /** The PRODUCT variant (`variant_id` on the wire). */
     variantId?: number | string;
     price?: number;
     quantity?: number;
+    /**
+     * The `<vio-product-detail>` layout these units were added from (0.34), from
+     * the cart line's origin: `layout_id`, `layout_revision`, `experiment_id`,
+     * `experiment_variant_id` on the wire. When any of them is given, all four
+     * go out (`''` for the missing ones); the SDK's events with cart items give
+     * them always (`''` when the units came from no layout).
+     */
+    layoutId?: string;
+    layoutRevision?: string;
+    experimentId?: string;
+    /** The EXPERIMENT variant of the layout — not the product variant. */
+    experimentVariantId?: string;
 }
 interface AnalyticsCommerce {
     items?: AnalyticsItemInput[];
@@ -2084,7 +2123,12 @@ declare class CartManager extends EventTarget {
  * the page as origin + path (`contentUrl`) and its title, within Commerce's caps.
  */
 declare function normalizeOrigin(origin: CartOrigin | null | undefined): CartOrigin;
-/** Two origins are the same place when campaign, slot, content and kind of element all match (the page's URL and title are attributes of the place, not its identity). */
+/**
+ * Two origins are the same place when campaign, slot, content and kind of
+ * element all match (the page's URL and title are attributes of the place, not
+ * its identity) — and the same detail layout (0.34): units added under two
+ * layouts stay two origins, so each layout is credited with its own.
+ */
 declare function sameOrigin(a: CartOrigin, b: CartOrigin): boolean;
 /**
  * The origins of a line for reporting: what it carries, plus an empty origin
@@ -3459,6 +3503,24 @@ declare class VioFacade {
      * document.
      */
     content(): ContentRef;
+    /**
+     * Page-wide options of every `<vio-product-detail>` (0.34). `layout` orders
+     * the sections below the gallery — `{ id, revision, sections, experimentId?,
+     * variantId? }`; `null` goes back to the default; a detail's own `layout`
+     * wins. Open details re-render at once, later ones open with it. A key left
+     * out of the call is left as it is. See README «Section order and layout
+     * tracking».
+     */
+    configureDetail(options?: {
+        layout?: DetailLayout | null;
+        descriptionLabel?: string | null;
+    }): void;
+    /**
+     * The layout a `<vio-product-detail>` without its own `layout` applies now:
+     * the page's (`source: 'global'`) or the default. A detail's own is
+     * `el.appliedLayout`. A copy; never throws.
+     */
+    detailLayout(): AppliedDetailLayout;
     get isInitialized(): boolean;
     get config(): ResolvedConfig;
     /** Multi-sponsor cart manager. Reactive — listen via addEventListener('change', ...). */
@@ -3777,7 +3839,7 @@ declare function writeInternal(internal: boolean, storage?: StorageLike | null |
  *
  * RELEASE CHECKLIST: bump together with package.json (see CONTRIBUTING).
  */
-declare const SDK_VERSION = "0.33.0";
+declare const SDK_VERSION = "0.36.0";
 
 /**
  * Vipps MobilePay's own button, the way the design guidelines ask for it.
@@ -3806,4 +3868,4 @@ declare function vippsButtonAttributes(verb?: 'buy' | 'pay' | 'express' | 'conti
     language?: string;
 }): Record<string, string>;
 
-export { ADD_ITEM_MUTATION, type AddManualOptions, type AddProductOptions, type AnalyticsCommerce, type AnalyticsContext, type AnalyticsEventName, type AnalyticsItemInput, AnalyticsManager, type AnalyticsStartOptions, type ApplePayConfig, type ApplePayResult, type Attribution, BUYER_REF_MAX_LENGTH, type BootstrapCampaign, type BootstrapCampaignEntry, type BootstrapCampaignStatus, type BootstrapResponse, type BootstrapSlot, CHECKOUT_ATTRIBUTION_CAPS, CHECKOUT_SPONSOR_STORAGE_KEY, CLIENT_LANDING_URL_MAX_LENGTH, CONTENT_URL_MAX_LENGTH, CREATE_CART_MUTATION, CREATE_CHECKOUT_MUTATION, CREATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, CREATE_PAYMENT_STRIPE_MUTATION, CREATE_PAYMENT_VIPPS_MUTATION, type CampaignHint, type CartChangeDetail, type CartLineItem, type CartLineOrigin, CartManager, type CartOrigin, type CartQueryOptions, type CartSlice, type CartUpdatedDetail, type CheckoutAddress, type CheckoutAttributionInput, type CheckoutAttributionWire, type CheckoutChangeDetail, CheckoutManager, type CheckoutManagerDeps, type CheckoutOpenDetail, type CheckoutReference, type CheckoutSponsor, type CheckoutState, type ClientContext, CommerceClient, Configuration, type ContentRef, type CreatePaymentVippsResponse, type CreatePaymentVippsVariables, DELETE_ITEM_MUTATION, type EntryContextWire, type Environment, GET_AVAILABLE_PAYMENT_METHODS_QUERY, GET_CART_QUERY, GET_CHECKOUT_QUERY, GET_LINE_ITEMS_BY_SUPPLIER_QUERY, GET_VIPPS_STATUS_QUERY, GRAPHQL_INT_MAX, type GatewayFeature, type GetVippsStatusVariables, INTERNAL_KEY, INTERNAL_PARAM, type ImageSize, LINE_ORIGIN_CAPS, type Landing, type LineOriginWire, type LineOriginWireOptions, type ManifestLocation, type ManifestRequest, type ManifestResult, type OrderReference, type OriginPage, type PaymentCompleteDetail, type PaymentMethod, type PaymentSelectDetail, type PaymentSuccessDetail, type PaymentSuccessResult, type PlacementComponent, type Product, type ProductCategory, type ProductImage, type ProductOption, type ProductPrice, type ProductVariant, type PurchaseIds, type RegisterSlotOptions, type ResolvedConfig, SDK_VERSION, type SlotInput, type SlotKind, type Sponsor, type SponsorCartState, type SponsorCommerceBlock, type SponsorIdentity, type SurfacePrivacyMode, type SurfaceResponse, type TrackOptions, UPDATE_CHECKOUT_MUTATION, UPDATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, UPDATE_ITEM_MUTATION, UPDATE_ITEM_WITH_ORIGIN_MUTATION, UPDATE_SHIPPINGS_BY_SUPPLIER_MUTATION, VIPPS_BUTTON_SCRIPT, VIPPS_BUTTON_TAG, Vio, VioApi, VioApiError, type VioConfig, type VioItem, type VioPlatform, type VippsPaymentState, type VippsStatusResult, activeCampaignEntry, addItem, autoSlotDisplayName, autoSlotId, buyerRefOf, campaignCandidates, capContentUrl, cartSlicesFrom, checkApplePayAvailability, checkoutAttributionOf, componentKindOf, createCart, createCheckout, createCommerceClient, createPaymentStripe, createPaymentVipps, createVioApi, deleteItem, displayPrice, dominantCampaignOf, ensureVippsButton, entryContextOf, executeCartGraphQL, formatPrice, gatewayHas, getAvailablePaymentMethods, getCart, getCartGraphQLOptions, getCheckout, getCheckoutReference, getCustomerSessionId, getGlobalCurrency, getLineItemsBySupplier, getVippsStatus, isUnknownFeatureError, isUnknownTokenError, landingUrl, lineOriginWire, lineOrigins, normalizeBuyerRef, normalizeOrigin, normalizeScope, normalizeSlotKind, originAndPath, primaryImageUrl, purchaseFromPaymentSuccess, purchaseIdsOf, readInternal, resetGatewayFeatures, resolveCampaignId, resolveClientContext, resolveContent, resolveInternal, resolveLanding, resolveSlotCampaign, sameOrigin, showApplePaySheet, sponsorCampaignEntry, sponsorIdentityFrom, storedLanding, toCampaignId, updateCheckout, updateItem, updateShippingsBySupplier, vippsButtonAttributes, withGatewayFeature, writeInternal };
+export { ADD_ITEM_MUTATION, type AddManualOptions, type AddProductOptions, type AnalyticsCommerce, type AnalyticsContext, type AnalyticsEventName, type AnalyticsItemInput, AnalyticsManager, type AnalyticsStartOptions, type ApplePayConfig, type ApplePayResult, AppliedDetailLayout, type Attribution, BUYER_REF_MAX_LENGTH, type BootstrapCampaign, type BootstrapCampaignEntry, type BootstrapCampaignStatus, type BootstrapResponse, type BootstrapSlot, CHECKOUT_ATTRIBUTION_CAPS, CHECKOUT_SPONSOR_STORAGE_KEY, CLIENT_LANDING_URL_MAX_LENGTH, CONTENT_URL_MAX_LENGTH, CREATE_CART_MUTATION, CREATE_CHECKOUT_MUTATION, CREATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, CREATE_PAYMENT_STRIPE_MUTATION, CREATE_PAYMENT_VIPPS_MUTATION, type CampaignHint, type CartChangeDetail, type CartLineItem, type CartLineOrigin, CartManager, type CartOrigin, type CartQueryOptions, type CartSlice, type CartUpdatedDetail, type CheckoutAddress, type CheckoutAttributionInput, type CheckoutAttributionWire, type CheckoutChangeDetail, CheckoutManager, type CheckoutManagerDeps, type CheckoutOpenDetail, type CheckoutReference, type CheckoutSponsor, type CheckoutState, type ClientContext, CommerceClient, Configuration, type ContentRef, type CreatePaymentVippsResponse, type CreatePaymentVippsVariables, DELETE_ITEM_MUTATION, DetailLayout, type EntryContextWire, type Environment, GET_AVAILABLE_PAYMENT_METHODS_QUERY, GET_CART_QUERY, GET_CHECKOUT_QUERY, GET_LINE_ITEMS_BY_SUPPLIER_QUERY, GET_VIPPS_STATUS_QUERY, GRAPHQL_INT_MAX, type GatewayFeature, type GetVippsStatusVariables, INTERNAL_KEY, INTERNAL_PARAM, type ImageSize, LINE_ORIGIN_CAPS, type Landing, type LineOriginWire, type LineOriginWireOptions, type ManifestLocation, type ManifestRequest, type ManifestResult, type OrderReference, type OriginPage, type PaymentCompleteDetail, type PaymentMethod, type PaymentSelectDetail, type PaymentSuccessDetail, type PaymentSuccessResult, type PlacementComponent, type Product, type ProductCategory, type ProductImage, type ProductOption, type ProductPrice, type ProductVariant, type PurchaseIds, type RegisterSlotOptions, type ResolvedConfig, SDK_VERSION, type SlotInput, type SlotKind, type Sponsor, type SponsorCartState, type SponsorCommerceBlock, type SponsorIdentity, type SurfacePrivacyMode, type SurfaceResponse, type TrackOptions, UPDATE_CHECKOUT_MUTATION, UPDATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, UPDATE_ITEM_MUTATION, UPDATE_ITEM_WITH_ORIGIN_MUTATION, UPDATE_SHIPPINGS_BY_SUPPLIER_MUTATION, VIPPS_BUTTON_SCRIPT, VIPPS_BUTTON_TAG, Vio, VioApi, VioApiError, type VioConfig, type VioItem, type VioPlatform, type VippsPaymentState, type VippsStatusResult, activeCampaignEntry, addItem, autoSlotDisplayName, autoSlotId, buyerRefOf, campaignCandidates, capContentUrl, cartSlicesFrom, checkApplePayAvailability, checkoutAttributionOf, componentKindOf, createCart, createCheckout, createCommerceClient, createPaymentStripe, createPaymentVipps, createVioApi, deleteItem, displayPrice, dominantCampaignOf, ensureVippsButton, entryContextOf, executeCartGraphQL, formatPrice, gatewayHas, getAvailablePaymentMethods, getCart, getCartGraphQLOptions, getCheckout, getCheckoutReference, getCustomerSessionId, getGlobalCurrency, getLineItemsBySupplier, getVippsStatus, isUnknownFeatureError, isUnknownTokenError, landingUrl, lineOriginWire, lineOrigins, normalizeBuyerRef, normalizeOrigin, normalizeScope, normalizeSlotKind, originAndPath, primaryImageUrl, purchaseFromPaymentSuccess, purchaseIdsOf, readInternal, resetGatewayFeatures, resolveCampaignId, resolveClientContext, resolveContent, resolveInternal, resolveLanding, resolveSlotCampaign, sameOrigin, showApplePaySheet, sponsorCampaignEntry, sponsorIdentityFrom, storedLanding, toCampaignId, updateCheckout, updateItem, updateShippingsBySupplier, vippsButtonAttributes, withGatewayFeature, writeInternal };

package/dist/core/index.js

@@ -1,4 +1,4 @@
-import '../chunk-QGJUBVH3.js';
-export { ADD_ITEM_MUTATION, AnalyticsManager, BUYER_REF_MAX_LENGTH, CHECKOUT_ATTRIBUTION_CAPS, CHECKOUT_SPONSOR_STORAGE_KEY, CLIENT_LANDING_URL_MAX_LENGTH, CONTENT_URL_MAX_LENGTH, CREATE_CART_MUTATION, CREATE_CHECKOUT_MUTATION, CREATE_CHECKOUT_WITH_ATTRIBUTION_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, GRAPHQL_INT_MAX, INTERNAL_KEY, INTERNAL_PARAM, LINE_ORIGIN_CAPS, SDK_VERSION, UPDATE_CHECKOUT_MUTATION, UPDATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, UPDATE_ITEM_MUTATION, UPDATE_ITEM_WITH_ORIGIN_MUTATION, UPDATE_SHIPPINGS_BY_SUPPLIER_MUTATION, VIPPS_BUTTON_SCRIPT, VIPPS_BUTTON_TAG, Vio, VioApi, VioApiError, activeCampaignEntry, addItem, autoSlotDisplayName, autoSlotId, buyerRefOf, campaignCandidates, capContentUrl, cartSlicesFrom, checkApplePayAvailability, checkoutAttributionOf, componentKindOf, createCart, createCheckout, createCommerceClient, createPaymentStripe, createPaymentVipps, createVioApi, deleteItem, displayPrice, dominantCampaignOf, ensureVippsButton, entryContextOf, executeCartGraphQL, formatPrice, gatewayHas, getAvailablePaymentMethods, getCart, getCartGraphQLOptions, getCheckout, getCheckoutReference, getCustomerSessionId, getGlobalCurrency, getLineItemsBySupplier, getVippsStatus, isUnknownFeatureError, isUnknownTokenError, landingUrl, lineOriginWire, lineOrigins, normalizeBuyerRef, normalizeOrigin, normalizeScope, normalizeSlotKind, originAndPath, primaryImageUrl, purchaseFromPaymentSuccess, purchaseIdsOf, readInternal, resetGatewayFeatures, resolveCampaignId, resolveClientContext, resolveContent, resolveInternal, resolveLanding, resolveSlotCampaign, sameOrigin, showApplePaySheet, sponsorCampaignEntry, sponsorIdentityFrom, storedLanding, toCampaignId, updateCheckout, updateItem, updateShippingsBySupplier, vippsButtonAttributes, withGatewayFeature, writeInternal } from '../chunk-ZORYG4W3.js';
+import '../chunk-3YFJFDSN.js';
+export { ADD_ITEM_MUTATION, AnalyticsManager, BUYER_REF_MAX_LENGTH, CHECKOUT_ATTRIBUTION_CAPS, CHECKOUT_SPONSOR_STORAGE_KEY, CLIENT_LANDING_URL_MAX_LENGTH, CONTENT_URL_MAX_LENGTH, CREATE_CART_MUTATION, CREATE_CHECKOUT_MUTATION, CREATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, CREATE_PAYMENT_STRIPE_MUTATION, CREATE_PAYMENT_VIPPS_MUTATION, CartManager, CheckoutManager, CommerceClient, Configuration, DELETE_ITEM_MUTATION, DETAIL_SECTION_IDS, ESSENTIAL_DETAIL_SECTIONS, GET_AVAILABLE_PAYMENT_METHODS_QUERY, GET_CART_QUERY, GET_CHECKOUT_QUERY, GET_LINE_ITEMS_BY_SUPPLIER_QUERY, GET_VIPPS_STATUS_QUERY, GRAPHQL_INT_MAX, INTERNAL_KEY, INTERNAL_PARAM, LINE_ORIGIN_CAPS, SDK_VERSION, UPDATE_CHECKOUT_MUTATION, UPDATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, UPDATE_ITEM_MUTATION, UPDATE_ITEM_WITH_ORIGIN_MUTATION, UPDATE_SHIPPINGS_BY_SUPPLIER_MUTATION, VIPPS_BUTTON_SCRIPT, VIPPS_BUTTON_TAG, Vio, VioApi, VioApiError, activeCampaignEntry, addItem, autoSlotDisplayName, autoSlotId, buyerRefOf, campaignCandidates, capContentUrl, cartSlicesFrom, checkApplePayAvailability, checkoutAttributionOf, componentKindOf, createCart, createCheckout, createCommerceClient, createPaymentStripe, createPaymentVipps, createVioApi, defaultDetailLayout, deleteItem, displayPrice, dominantCampaignOf, effectiveDetailSections, ensureVippsButton, entryContextOf, executeCartGraphQL, formatPrice, gatewayHas, getAvailablePaymentMethods, getCart, getCartGraphQLOptions, getCheckout, getCheckoutReference, getCustomerSessionId, getGlobalCurrency, getLineItemsBySupplier, getVippsStatus, isUnknownFeatureError, isUnknownTokenError, landingUrl, lineOriginWire, lineOrigins, normalizeBuyerRef, normalizeDetailLayout, normalizeOrigin, normalizeScope, normalizeSlotKind, originAndPath, primaryImageUrl, purchaseFromPaymentSuccess, purchaseIdsOf, readInternal, resetGatewayFeatures, resolveCampaignId, resolveClientContext, resolveContent, resolveDetailLayout, resolveInternal, resolveLanding, resolveSlotCampaign, sameOrigin, showApplePaySheet, sponsorCampaignEntry, sponsorIdentityFrom, storedLanding, toCampaignId, updateCheckout, updateItem, updateShippingsBySupplier, vippsButtonAttributes, withGatewayFeature, writeInternal } from '../chunk-6PQFXUOW.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/detail-layout-BI556w8p.d.ts

@@ -0,0 +1,76 @@
+/**
+ * The order of the sections of `<vio-product-detail>` below the gallery, and
+ * which layout a detail really applied (0.34).
+ *
+ * A layout is `{ id, revision, sections, experimentId?, variantId? }`, set for
+ * the whole page with `Vio.configureDetail({ layout })` or per element with its
+ * `layout` property / attribute (the element wins). This module holds the
+ * page-wide one and the ONE rule that turns a requested layout into the
+ * sections a detail renders (`resolveDetailLayout`). Pure but for the global
+ * store, which lives on `globalThis` so every bundle of the SDK on a page
+ * (Vev chunks) shares it, like the `Vio` facade.
+ *
+ * The applied layout of a non-default layout travels with analytics: the
+ * `view_item` of the detail and, through the cart line origins, every unit
+ * the detail added (see `layoutOriginOf`). Never to Commerce.
+ */
+/** Section ids of the detail, in the default order (exactly the DOM before 0.34). */
+declare const DETAIL_SECTION_IDS: readonly ["brand", "title", "stock", "price", "options", "purchase", "highlights", "description", "shippingReturns"];
+type DetailSectionId = (typeof DETAIL_SECTION_IDS)[number];
+/** Sections a layout cannot leave out: appended, in default relative order, when missing. */
+declare const ESSENTIAL_DETAIL_SECTIONS: ReadonlyArray<DetailSectionId>;
+/** What a host asks for. */
+interface DetailLayout {
+    id: string;
+    revision: string;
+    sections: string[];
+    experimentId?: string;
+    variantId?: string;
+}
+interface DetailLayoutAdjustment {
+    section: string;
+    reason: 'unknown' | 'duplicate' | 'added-essential';
+}
+/** What a detail applied — `el.appliedLayout`, `Vio.detailLayout()`, `vio:detail-layout-applied`. */
+interface AppliedDetailLayout {
+    id: string;
+    revision: string;
+    experimentId?: string;
+    variantId?: string;
+    /** The sections rendered, in order. */
+    sections: DetailSectionId[];
+    /** What the SDK changed in the requested list, and why. */
+    adjusted: DetailLayoutAdjustment[];
+    source: 'element' | 'global' | 'default';
+}
+/** The layout fields a cart line origin carries (CartOrigin) — only for a non-default layout. */
+interface DetailLayoutOrigin {
+    layoutId?: string;
+    layoutRevision?: string;
+    experimentId?: string;
+    variantId?: string;
+}
+/** The default applied layout (no configuration). */
+declare function defaultDetailLayout(): AppliedDetailLayout;
+/**
+ * A requested layout as the SDK uses it, or `null` when it cannot be used
+ * (not an object, an invalid `id`, `sections` not an array — warned once).
+ * An invalid `revision` / `experimentId` / `variantId` is treated as absent.
+ */
+declare function normalizeDetailLayout(raw: unknown): DetailLayout | null;
+/**
+ * The sections a requested list renders: unknown ids out, duplicates out
+ * (the first wins), then the missing essentials (`title`, `price`,
+ * `options`, `purchase`) appended in their default relative order.
+ */
+declare function effectiveDetailSections(requested: ReadonlyArray<string>): {
+    sections: DetailSectionId[];
+    adjusted: DetailLayoutAdjustment[];
+};
+/**
+ * The layout a detail applies: its own (valid) layout, else the page's
+ * (`Vio.configureDetail`), else the default.
+ */
+declare function resolveDetailLayout(elementLayout: unknown, globalLayout?: unknown): AppliedDetailLayout;
+
+export { type AppliedDetailLayout as A, type DetailLayout as D, ESSENTIAL_DETAIL_SECTIONS as E, DETAIL_SECTION_IDS as a, type DetailLayoutAdjustment as b, type DetailLayoutOrigin as c, type DetailSectionId as d, defaultDetailLayout as e, effectiveDetailSections as f, normalizeDetailLayout as n, resolveDetailLayout as r };

package/dist/index.d.ts

@@ -1,2 +1,3 @@
 export { ADD_ITEM_MUTATION, AddManualOptions, AddProductOptions, AnalyticsCommerce, AnalyticsContext, AnalyticsEventName, AnalyticsItemInput, AnalyticsManager, AnalyticsStartOptions, ApplePayConfig, ApplePayResult, Attribution, BUYER_REF_MAX_LENGTH, BootstrapCampaign, BootstrapCampaignEntry, BootstrapCampaignStatus, BootstrapResponse, BootstrapSlot, CHECKOUT_ATTRIBUTION_CAPS, CHECKOUT_SPONSOR_STORAGE_KEY, CLIENT_LANDING_URL_MAX_LENGTH, CONTENT_URL_MAX_LENGTH, CREATE_CART_MUTATION, CREATE_CHECKOUT_MUTATION, CREATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, CREATE_PAYMENT_STRIPE_MUTATION, CREATE_PAYMENT_VIPPS_MUTATION, CampaignHint, CartChangeDetail, CartLineItem, CartLineOrigin, CartManager, CartOrigin, CartQueryOptions, CartSlice, CartUpdatedDetail, CheckoutAddress, CheckoutAttributionInput, CheckoutAttributionWire, CheckoutChangeDetail, CheckoutManager, CheckoutManagerDeps, CheckoutOpenDetail, CheckoutReference, CheckoutSponsor, CheckoutState, ClientContext, CommerceClient, Configuration, ContentRef, CreatePaymentVippsResponse, CreatePaymentVippsVariables, DELETE_ITEM_MUTATION, EntryContextWire, Environment, GET_AVAILABLE_PAYMENT_METHODS_QUERY, GET_CART_QUERY, GET_CHECKOUT_QUERY, GET_LINE_ITEMS_BY_SUPPLIER_QUERY, GET_VIPPS_STATUS_QUERY, GRAPHQL_INT_MAX, GatewayFeature, GetVippsStatusVariables, INTERNAL_KEY, INTERNAL_PARAM, ImageSize, LINE_ORIGIN_CAPS, Landing, LineOriginWire, LineOriginWireOptions, ManifestLocation, ManifestRequest, ManifestResult, OrderReference, OriginPage, PaymentCompleteDetail, PaymentMethod, PaymentSelectDetail, PaymentSuccessDetail, PaymentSuccessResult, PlacementComponent, Product, ProductCategory, ProductImage, ProductOption, ProductPrice, ProductVariant, PurchaseIds, RegisterSlotOptions, ResolvedConfig, SDK_VERSION, SlotInput, SlotKind, Sponsor, SponsorCartState, SponsorCommerceBlock, SponsorIdentity, SurfacePrivacyMode, SurfaceResponse, TrackOptions, UPDATE_CHECKOUT_MUTATION, UPDATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, UPDATE_ITEM_MUTATION, UPDATE_ITEM_WITH_ORIGIN_MUTATION, UPDATE_SHIPPINGS_BY_SUPPLIER_MUTATION, VIPPS_BUTTON_SCRIPT, VIPPS_BUTTON_TAG, Vio, VioApi, VioApiError, VioConfig, VioItem, VioPlatform, VippsPaymentState, VippsStatusResult, activeCampaignEntry, addItem, autoSlotDisplayName, autoSlotId, buyerRefOf, campaignCandidates, capContentUrl, cartSlicesFrom, checkApplePayAvailability, checkoutAttributionOf, componentKindOf, createCart, createCheckout, createCommerceClient, createPaymentStripe, createPaymentVipps, createVioApi, deleteItem, displayPrice, dominantCampaignOf, ensureVippsButton, entryContextOf, executeCartGraphQL, formatPrice, gatewayHas, getAvailablePaymentMethods, getCart, getCartGraphQLOptions, getCheckout, getCheckoutReference, getCustomerSessionId, getGlobalCurrency, getLineItemsBySupplier, getVippsStatus, isUnknownFeatureError, isUnknownTokenError, landingUrl, lineOriginWire, lineOrigins, normalizeBuyerRef, normalizeOrigin, normalizeScope, normalizeSlotKind, originAndPath, primaryImageUrl, purchaseFromPaymentSuccess, purchaseIdsOf, readInternal, resetGatewayFeatures, resolveCampaignId, resolveClientContext, resolveContent, resolveInternal, resolveLanding, resolveSlotCampaign, sameOrigin, showApplePaySheet, sponsorCampaignEntry, sponsorIdentityFrom, storedLanding, toCampaignId, updateCheckout, updateItem, updateShippingsBySupplier, vippsButtonAttributes, withGatewayFeature, writeInternal } from './core/index.js';
+export { A as AppliedDetailLayout, a as DETAIL_SECTION_IDS, D as DetailLayout, b as DetailLayoutAdjustment, c as DetailLayoutOrigin, d as DetailSectionId, E as ESSENTIAL_DETAIL_SECTIONS, e as defaultDetailLayout, f as effectiveDetailSections, n as normalizeDetailLayout, r as resolveDetailLayout } from './detail-layout-BI556w8p.js';
 import 'graphql-request';

package/dist/index.js

@@ -1,4 +1,4 @@
-import './chunk-QGJUBVH3.js';
-export { ADD_ITEM_MUTATION, AnalyticsManager, BUYER_REF_MAX_LENGTH, CHECKOUT_ATTRIBUTION_CAPS, CHECKOUT_SPONSOR_STORAGE_KEY, CLIENT_LANDING_URL_MAX_LENGTH, CONTENT_URL_MAX_LENGTH, CREATE_CART_MUTATION, CREATE_CHECKOUT_MUTATION, CREATE_CHECKOUT_WITH_ATTRIBUTION_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, GRAPHQL_INT_MAX, INTERNAL_KEY, INTERNAL_PARAM, LINE_ORIGIN_CAPS, SDK_VERSION, UPDATE_CHECKOUT_MUTATION, UPDATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, UPDATE_ITEM_MUTATION, UPDATE_ITEM_WITH_ORIGIN_MUTATION, UPDATE_SHIPPINGS_BY_SUPPLIER_MUTATION, VIPPS_BUTTON_SCRIPT, VIPPS_BUTTON_TAG, Vio, VioApi, VioApiError, activeCampaignEntry, addItem, autoSlotDisplayName, autoSlotId, buyerRefOf, campaignCandidates, capContentUrl, cartSlicesFrom, checkApplePayAvailability, checkoutAttributionOf, componentKindOf, createCart, createCheckout, createCommerceClient, createPaymentStripe, createPaymentVipps, createVioApi, deleteItem, displayPrice, dominantCampaignOf, ensureVippsButton, entryContextOf, executeCartGraphQL, formatPrice, gatewayHas, getAvailablePaymentMethods, getCart, getCartGraphQLOptions, getCheckout, getCheckoutReference, getCustomerSessionId, getGlobalCurrency, getLineItemsBySupplier, getVippsStatus, isUnknownFeatureError, isUnknownTokenError, landingUrl, lineOriginWire, lineOrigins, normalizeBuyerRef, normalizeOrigin, normalizeScope, normalizeSlotKind, originAndPath, primaryImageUrl, purchaseFromPaymentSuccess, purchaseIdsOf, readInternal, resetGatewayFeatures, resolveCampaignId, resolveClientContext, resolveContent, resolveInternal, resolveLanding, resolveSlotCampaign, sameOrigin, showApplePaySheet, sponsorCampaignEntry, sponsorIdentityFrom, storedLanding, toCampaignId, updateCheckout, updateItem, updateShippingsBySupplier, vippsButtonAttributes, withGatewayFeature, writeInternal } from './chunk-ZORYG4W3.js';
+import './chunk-3YFJFDSN.js';
+export { ADD_ITEM_MUTATION, AnalyticsManager, BUYER_REF_MAX_LENGTH, CHECKOUT_ATTRIBUTION_CAPS, CHECKOUT_SPONSOR_STORAGE_KEY, CLIENT_LANDING_URL_MAX_LENGTH, CONTENT_URL_MAX_LENGTH, CREATE_CART_MUTATION, CREATE_CHECKOUT_MUTATION, CREATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, CREATE_PAYMENT_STRIPE_MUTATION, CREATE_PAYMENT_VIPPS_MUTATION, CartManager, CheckoutManager, CommerceClient, Configuration, DELETE_ITEM_MUTATION, DETAIL_SECTION_IDS, ESSENTIAL_DETAIL_SECTIONS, GET_AVAILABLE_PAYMENT_METHODS_QUERY, GET_CART_QUERY, GET_CHECKOUT_QUERY, GET_LINE_ITEMS_BY_SUPPLIER_QUERY, GET_VIPPS_STATUS_QUERY, GRAPHQL_INT_MAX, INTERNAL_KEY, INTERNAL_PARAM, LINE_ORIGIN_CAPS, SDK_VERSION, UPDATE_CHECKOUT_MUTATION, UPDATE_CHECKOUT_WITH_ATTRIBUTION_MUTATION, UPDATE_ITEM_MUTATION, UPDATE_ITEM_WITH_ORIGIN_MUTATION, UPDATE_SHIPPINGS_BY_SUPPLIER_MUTATION, VIPPS_BUTTON_SCRIPT, VIPPS_BUTTON_TAG, Vio, VioApi, VioApiError, activeCampaignEntry, addItem, autoSlotDisplayName, autoSlotId, buyerRefOf, campaignCandidates, capContentUrl, cartSlicesFrom, checkApplePayAvailability, checkoutAttributionOf, componentKindOf, createCart, createCheckout, createCommerceClient, createPaymentStripe, createPaymentVipps, createVioApi, defaultDetailLayout, deleteItem, displayPrice, dominantCampaignOf, effectiveDetailSections, ensureVippsButton, entryContextOf, executeCartGraphQL, formatPrice, gatewayHas, getAvailablePaymentMethods, getCart, getCartGraphQLOptions, getCheckout, getCheckoutReference, getCustomerSessionId, getGlobalCurrency, getLineItemsBySupplier, getVippsStatus, isUnknownFeatureError, isUnknownTokenError, landingUrl, lineOriginWire, lineOrigins, normalizeBuyerRef, normalizeDetailLayout, normalizeOrigin, normalizeScope, normalizeSlotKind, originAndPath, primaryImageUrl, purchaseFromPaymentSuccess, purchaseIdsOf, readInternal, resetGatewayFeatures, resolveCampaignId, resolveClientContext, resolveContent, resolveDetailLayout, resolveInternal, resolveLanding, resolveSlotCampaign, sameOrigin, showApplePaySheet, sponsorCampaignEntry, sponsorIdentityFrom, storedLanding, toCampaignId, updateCheckout, updateItem, updateShippingsBySupplier, vippsButtonAttributes, withGatewayFeature, writeInternal } from './chunk-6PQFXUOW.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/react/index.d.ts

@@ -1,8 +1,9 @@
 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-B7GVA_qB.js';
-export { e as VioThemeOverrides, f as VioTokens, g as applyVioTheme } from '../tokens-B7GVA_qB.js';
+import { V as VioCart$1, a as VioCheckout$1, b as VioProduct$1, c as VioProductCarousel$1, d as VioProductDetail$1 } from '../tokens-BGzSC3vK.js';
+export { e as VioThemeOverrides, f as VioTokens, g as applyVioTheme } from '../tokens-BGzSC3vK.js';
 import 'lit-html';
 import 'lit';
+import '../detail-layout-BI556w8p.js';
 
 declare const VioProduct: _lit_react.ReactWebComponent<VioProduct$1, {
     onProductClick: string;
@@ -12,6 +13,7 @@ declare const VioProductCarousel: _lit_react.ReactWebComponent<VioProductCarouse
 declare const VioProductDetail: _lit_react.ReactWebComponent<VioProductDetail$1, {
     onAddedToCart: string;
     onCheckoutOpen: string;
+    onLayoutApplied: string;
 }>;
 declare const VioCart: _lit_react.ReactWebComponent<VioCart$1, {
     onPaymentSuccess: string;

package/dist/react/index.js

@@ -1,6 +1,6 @@
-import { registerVioElements, VioProduct, VioProductCarousel, VioProductDetail, VioCart, VioCheckout } from '../chunk-T5B74YBQ.js';
-export { VioTokens, applyVioTheme } from '../chunk-T5B74YBQ.js';
-import '../chunk-ZORYG4W3.js';
+import { registerVioElements, VioProduct, VioProductCarousel, VioProductDetail, VioCart, VioCheckout } from '../chunk-DEREQRCM.js';
+export { VioTokens, applyVioTheme } from '../chunk-DEREQRCM.js';
+import '../chunk-6PQFXUOW.js';
 import * as React from 'react';
 
 // node_modules/@lit/react/node/create-component.js
@@ -40,7 +40,8 @@ var VioProductDetail2 = t({
   elementClass: VioProductDetail,
   events: {
     onAddedToCart: "vio:added-to-cart",
-    onCheckoutOpen: "vio:checkout-open"
+    onCheckoutOpen: "vio:checkout-open",
+    onLayoutApplied: "vio:detail-layout-applied"
   }
 });
 var VioCart2 = t({

package/dist/react/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../node_modules/@lit/react/src/create-component.ts","../../src/react/index.ts"],"names":["reservedReactProperties","Set","createComponent","react","React","tagName","elementClass","events","displayName","eventProps","Object","keys","ReactComponent","forwardRef","props","ref","useRef","Map","elementRef","reactProps","elementProps","k","v","entries","has","prototype","createElement","name","globalThis","litSsrReactEnabled","length","useCallback","node","current","VioProduct","VioProductCarousel","VioProductDetail","VioCart","VioCheckout"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nimport type React from 'react';\n\nconst NODE_MODE = false;\nconst DEV_MODE = true;\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype DistributiveOmit<T, K extends string | number | symbol> = T extends any\n  ? K extends keyof T\n    ? Omit<T, K>\n    : T\n  : T;\ntype PropsWithoutRef<T> = DistributiveOmit<T, 'ref'>;\n\n/**\n * Creates a type to be used for the props of a web component used directly in\n * React JSX.\n *\n * Example:\n *\n * ```ts\n * declare module \"react\" {\n *   namespace JSX {\n *     interface IntrinsicElements {\n *       'x-foo': WebComponentProps<XFoo>;\n *     }\n *   }\n * }\n * ```\n */\nexport type WebComponentProps<I extends HTMLElement> = React.DetailedHTMLProps<\n  React.HTMLAttributes<I>,\n  I\n> &\n  ElementProps<I>;\n\n/**\n * Type of the React component wrapping the web component. This is the return\n * type of `createComponent`.\n */\nexport type ReactWebComponent<\n  I extends HTMLElement,\n  E extends EventNames = {},\n> = React.ForwardRefExoticComponent<\n  // TODO(augustjk): Remove and use `React.PropsWithoutRef` when\n  // https://github.com/preactjs/preact/issues/4124 is fixed.\n  PropsWithoutRef<ComponentProps<I, E>> & React.RefAttributes<I>\n>;\n\n// Props derived from custom element class. Currently has limitations of making\n// all properties optional and also surfaces life cycle methods in autocomplete.\n// TODO(augustjk) Consider omitting keyof LitElement to remove \"internal\"\n// lifecycle methods or allow user to explicitly provide props.\ntype ElementProps<I> = Partial<Omit<I, keyof HTMLElement>>;\n\n// Acceptable props to the React component.\ntype ComponentProps<I, E extends EventNames = {}> = Omit<\n  React.HTMLAttributes<I>,\n  // Prefer type of provided event handler props or those on element over\n  // built-in HTMLAttributes\n  keyof E | keyof ElementProps<I>\n> &\n  EventListeners<E> &\n  ElementProps<I>;\n\n/**\n * Type used to cast an event name with an event type when providing the\n * `events` option to `createComponent` for better typing of the event handler\n * prop.\n *\n * Example:\n *\n * ```ts\n * const FooComponent = createComponent({\n *   ...\n *   events: {\n *     onfoo: 'foo' as EventName<FooEvent>,\n *   }\n * });\n * ```\n *\n * `onfoo` prop will have the type `(e: FooEvent) => void`.\n */\nexport type EventName<T extends Event = Event> = string & {\n  __eventType: T;\n};\n\n// A key value map matching React prop names to event names.\ntype EventNames = Record<string, EventName | string>;\n\n// A map of expected event listener types based on EventNames.\ntype EventListeners<R extends EventNames> = {\n  [K in keyof R]?: R[K] extends EventName\n    ? (e: R[K]['__eventType']) => void\n    : (e: Event) => void;\n};\n\nexport interface Options<I extends HTMLElement, E extends EventNames = {}> {\n  react: typeof React;\n  tagName: string;\n  elementClass: Constructor<I>;\n  events?: E;\n  displayName?: string;\n}\n\ntype Constructor<T> = {new (): T};\n\nconst reservedReactProperties = new Set([\n  'children',\n  'localName',\n  'ref',\n  'style',\n  'className',\n]);\n\nconst listenedEvents = new WeakMap<Element, Map<string, EventListenerObject>>();\n\n/**\n * Adds an event listener for the specified event to the given node. In the\n * React setup, there should only ever be one event listener. Thus, for\n * efficiency only one listener is added and the handler for that listener is\n * updated to point to the given listener function.\n */\nconst addOrUpdateEventListener = (\n  node: Element,\n  event: string,\n  listener: (event?: Event) => void\n) => {\n  let events = listenedEvents.get(node);\n  if (events === undefined) {\n    listenedEvents.set(node, (events = new Map()));\n  }\n  let handler = events.get(event);\n  if (listener !== undefined) {\n    // If necessary, add listener and track handler\n    if (handler === undefined) {\n      events.set(event, (handler = {handleEvent: listener}));\n      node.addEventListener(event, handler);\n      // Otherwise just update the listener with new value\n    } else {\n      handler.handleEvent = listener;\n    }\n    // Remove listener if one exists and value is undefined\n  } else if (handler !== undefined) {\n    events.delete(event);\n    node.removeEventListener(event, handler);\n  }\n};\n\n/**\n * Sets properties and events on custom elements. These properties and events\n * have been pre-filtered so we know they should apply to the custom element.\n */\nconst setProperty = <E extends Element>(\n  node: E,\n  name: string,\n  value: unknown,\n  old: unknown,\n  events?: EventNames\n) => {\n  const event = events?.[name];\n  // Dirty check event value.\n  if (event !== undefined) {\n    if (value !== old) {\n      addOrUpdateEventListener(node, event, value as (e?: Event) => void);\n    }\n    return;\n  }\n  // But don't dirty check properties; elements are assumed to do this.\n  node[name as keyof E] = value as E[keyof E];\n\n  // This block is to replicate React's behavior for attributes of native\n  // elements where `undefined` or `null` values result in attributes being\n  // removed.\n  // https://github.com/facebook/react/blob/899cb95f52cc83ab5ca1eb1e268c909d3f0961e7/packages/react-dom-bindings/src/client/DOMPropertyOperations.js#L107-L141\n  //\n  // It's only needed here for native HTMLElement properties that reflect\n  // attributes of the same name but don't have that behavior like \"id\" or\n  // \"draggable\".\n  if (\n    (value === undefined || value === null) &&\n    name in HTMLElement.prototype\n  ) {\n    node.removeAttribute(name);\n  }\n};\n\n/**\n * Creates a React component for a custom element. Properties are distinguished\n * from attributes automatically, and events can be configured so they are added\n * to the custom element as event listeners.\n *\n * @param options An options bag containing the parameters needed to generate a\n * wrapped web component.\n *\n * @param options.react The React module, typically imported from the `react`\n * npm package.\n * @param options.tagName The custom element tag name registered via\n * `customElements.define`.\n * @param options.elementClass The custom element class registered via\n * `customElements.define`.\n * @param options.events An object listing events to which the component can\n * listen. The object keys are the event property names passed in via React\n * props and the object values are the names of the corresponding events\n * generated by the custom element. For example, given `{onactivate:\n * 'activate'}` an event function may be passed via the component's `onactivate`\n * prop and will be called when the custom element fires its `activate` event.\n * @param options.displayName A React component display name, used in debugging\n * messages. Default value is inferred from the name of custom element class\n * registered via `customElements.define`.\n */\nexport const createComponent = <\n  I extends HTMLElement,\n  E extends EventNames = {},\n>({\n  react: React,\n  tagName,\n  elementClass,\n  events,\n  displayName,\n}: Options<I, E>): ReactWebComponent<I, E> => {\n  const eventProps = new Set(Object.keys(events ?? {}));\n\n  if (DEV_MODE && !NODE_MODE) {\n    for (const p of reservedReactProperties) {\n      if (p in elementClass.prototype && !(p in HTMLElement.prototype)) {\n        // Note, this effectively warns only for `ref` since the other\n        // reserved props are on HTMLElement.prototype. To address this\n        // would require crawling down the prototype, which doesn't feel worth\n        // it since implementing these properties on an element is extremely\n        // rare.\n        console.warn(\n          `${tagName} contains property ${p} which is a React reserved ` +\n            `property. It will be used by React and not set on the element.`\n        );\n      }\n    }\n  }\n\n  type Props = ComponentProps<I, E>;\n\n  const ReactComponent = React.forwardRef<I, Props>((props, ref) => {\n    const prevElemPropsRef = React.useRef(new Map());\n    const elementRef = React.useRef<I | null>(null);\n\n    // Props to be passed to React.createElement\n    const reactProps: Record<string, unknown> = {};\n    // Props to be set on element with setProperty\n    const elementProps: Record<string, unknown> = {};\n\n    for (const [k, v] of Object.entries(props)) {\n      if (reservedReactProperties.has(k)) {\n        // React does *not* handle `className` for custom elements so\n        // coerce it to `class` so it's handled correctly.\n        reactProps[k === 'className' ? 'class' : k] = v;\n        continue;\n      }\n\n      if (eventProps.has(k) || k in elementClass.prototype) {\n        elementProps[k] = v;\n        continue;\n      }\n\n      reactProps[k] = v;\n    }\n\n    // useLayoutEffect produces warnings during server rendering.\n    if (!NODE_MODE) {\n      // This one has no dependency array so it'll run on every re-render.\n      React.useLayoutEffect(() => {\n        if (elementRef.current === null) {\n          return;\n        }\n        const newElemProps = new Map();\n        for (const key in elementProps) {\n          setProperty(\n            elementRef.current,\n            key,\n            props[key],\n            prevElemPropsRef.current.get(key),\n            events\n          );\n          prevElemPropsRef.current.delete(key);\n          newElemProps.set(key, props[key]);\n        }\n        // \"Unset\" any props from previous render that no longer exist.\n        // Setting to `undefined` seems like the correct thing to \"unset\"\n        // but currently React will set it as `null`.\n        // See https://github.com/facebook/react/issues/28203\n        for (const [key, value] of prevElemPropsRef.current) {\n          setProperty(elementRef.current, key, undefined, value, events);\n        }\n        prevElemPropsRef.current = newElemProps;\n      });\n\n      // Empty dependency array so this will only run once after first render.\n      React.useLayoutEffect(() => {\n        elementRef.current?.removeAttribute('defer-hydration');\n      }, []);\n    }\n\n    if (NODE_MODE) {\n      // If component is to be server rendered with `@lit/ssr-react`, pass\n      // element properties in a special bag to be set by the server-side\n      // element renderer.\n      if (\n        (React.createElement.name === 'litPatchedCreateElement' ||\n          globalThis.litSsrReactEnabled) &&\n        Object.keys(elementProps).length\n      ) {\n        // This property needs to remain unminified.\n        reactProps['_$litProps$'] = elementProps;\n      }\n    } else {\n      // Suppress hydration warning for server-rendered attributes.\n      // This property needs to remain unminified.\n      reactProps['suppressHydrationWarning'] = true;\n    }\n\n    return React.createElement(tagName, {\n      ...reactProps,\n      ref: React.useCallback(\n        (node: I) => {\n          elementRef.current = node;\n          if (typeof ref === 'function') {\n            ref(node);\n          } else if (ref !== null) {\n            ref.current = node;\n          }\n        },\n        [ref]\n      ),\n    });\n  });\n\n  ReactComponent.displayName = displayName ?? elementClass.name;\n\n  return ReactComponent;\n};\n","/**\n * Vio React adapter — typed React wrappers for the `<vio-*>` web components.\n *\n * Built on `@lit/react`'s `createComponent`, which gives each wrapper:\n *   - typed props derived from the element's reactive properties, and\n *   - typed event props (the `vio:*` CustomEvents below) as `onX` callbacks.\n *\n * Importing this entry also REGISTERS the custom elements (via the\n * `registerVioElements()` call below), so you do NOT need a separate\n * `import '@vio-live/web-sdk/ui'` when you use these.\n *\n * React 18+ is an (optional) peer dependency — only required if you import this\n * entry. `@lit/react` is bundled in, so consumers install nothing extra.\n *\n *   import { Vio } from '@vio-live/web-sdk'\n *   import { VioProductCarousel } from '@vio-live/web-sdk/react'\n *   Vio.init({ apiKey, apiBase, graphqlBase, stripePublishableKey })\n *   <VioProductCarousel onProductAdd={(e) => console.log(e.detail)} />\n *\n * Slots (ADR-0027): the element property is `vioSlot` (attribute `vio-slot`),\n * so in React it is `<VioProductCarousel vioSlot=\"hero\" />`. `@lit/react`\n * passes every reactive property of the element class through as a prop and\n * sets it on the element after mount — the elements re-register the slot from\n * `updated()`, so the late set is fine. `slot` itself is React's/HTML's own\n * attribute (shadow DOM slotting) — do not use it for this.\n * Typed in `index.props.test.ts` (compile-time, checked by `npm run typecheck`).\n */\n\nimport * as React from 'react'\nimport { createComponent } from '@lit/react'\nimport {\n  registerVioElements,\n  VioProduct as VioProductEl,\n  VioProductCarousel as VioProductCarouselEl,\n  VioProductDetail as VioProductDetailEl,\n  VioCart as VioCartEl,\n  VioCheckout as VioCheckoutEl,\n} from '../ui/elements.js'\n// Not just for the re-export below — the import itself injects the default\n// design tokens as CSS custom properties on `:root` (see tokens.ts). Without\n// it, `elements.js` alone never pulls tokens.ts in, so this entry (the one\n// the Vev bundle actually goes through) never ran that injection.\nimport '../ui/tokens.js'\n\n// Register the underlying custom elements when this entry is imported.\nregisterVioElements()\n\nexport const VioProduct = createComponent({\n  react: React,\n  tagName: 'vio-product',\n  elementClass: VioProductEl,\n  events: {\n    onProductClick: 'vio:product-click',\n    onProductAdd: 'vio:product-add',\n  },\n})\n\nexport const VioProductCarousel = createComponent({\n  react: React,\n  tagName: 'vio-product-carousel',\n  elementClass: VioProductCarouselEl,\n  events: {},\n})\n\nexport const VioProductDetail = createComponent({\n  react: React,\n  tagName: 'vio-product-detail',\n  elementClass: VioProductDetailEl,\n  events: {\n    onAddedToCart: 'vio:added-to-cart',\n    onCheckoutOpen: 'vio:checkout-open',\n  },\n})\n\nexport const VioCart = createComponent({\n  react: React,\n  tagName: 'vio-cart',\n  elementClass: VioCartEl,\n  events: {\n    onPaymentSuccess: 'vio:payment-success',\n    onCheckoutOpen: 'vio:checkout-open',\n  },\n})\n\nexport const VioCheckout = createComponent({\n  react: React,\n  tagName: 'vio-checkout',\n  elementClass: VioCheckoutEl,\n  events: {\n    onPaymentSuccess: 'vio:payment-success',\n  },\n})\n\nexport { VioTokens, applyVioTheme, type VioThemeOverrides } from '../ui/tokens.js'\n"]}
+{"version":3,"sources":["../../node_modules/@lit/react/src/create-component.ts","../../src/react/index.ts"],"names":["reservedReactProperties","Set","createComponent","react","React","tagName","elementClass","events","displayName","eventProps","Object","keys","ReactComponent","forwardRef","props","ref","useRef","Map","elementRef","reactProps","elementProps","k","v","entries","has","prototype","createElement","name","globalThis","litSsrReactEnabled","length","useCallback","node","current","VioProduct","VioProductCarousel","VioProductDetail","VioCart","VioCheckout"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nimport type React from 'react';\n\nconst NODE_MODE = false;\nconst DEV_MODE = true;\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype DistributiveOmit<T, K extends string | number | symbol> = T extends any\n  ? K extends keyof T\n    ? Omit<T, K>\n    : T\n  : T;\ntype PropsWithoutRef<T> = DistributiveOmit<T, 'ref'>;\n\n/**\n * Creates a type to be used for the props of a web component used directly in\n * React JSX.\n *\n * Example:\n *\n * ```ts\n * declare module \"react\" {\n *   namespace JSX {\n *     interface IntrinsicElements {\n *       'x-foo': WebComponentProps<XFoo>;\n *     }\n *   }\n * }\n * ```\n */\nexport type WebComponentProps<I extends HTMLElement> = React.DetailedHTMLProps<\n  React.HTMLAttributes<I>,\n  I\n> &\n  ElementProps<I>;\n\n/**\n * Type of the React component wrapping the web component. This is the return\n * type of `createComponent`.\n */\nexport type ReactWebComponent<\n  I extends HTMLElement,\n  E extends EventNames = {},\n> = React.ForwardRefExoticComponent<\n  // TODO(augustjk): Remove and use `React.PropsWithoutRef` when\n  // https://github.com/preactjs/preact/issues/4124 is fixed.\n  PropsWithoutRef<ComponentProps<I, E>> & React.RefAttributes<I>\n>;\n\n// Props derived from custom element class. Currently has limitations of making\n// all properties optional and also surfaces life cycle methods in autocomplete.\n// TODO(augustjk) Consider omitting keyof LitElement to remove \"internal\"\n// lifecycle methods or allow user to explicitly provide props.\ntype ElementProps<I> = Partial<Omit<I, keyof HTMLElement>>;\n\n// Acceptable props to the React component.\ntype ComponentProps<I, E extends EventNames = {}> = Omit<\n  React.HTMLAttributes<I>,\n  // Prefer type of provided event handler props or those on element over\n  // built-in HTMLAttributes\n  keyof E | keyof ElementProps<I>\n> &\n  EventListeners<E> &\n  ElementProps<I>;\n\n/**\n * Type used to cast an event name with an event type when providing the\n * `events` option to `createComponent` for better typing of the event handler\n * prop.\n *\n * Example:\n *\n * ```ts\n * const FooComponent = createComponent({\n *   ...\n *   events: {\n *     onfoo: 'foo' as EventName<FooEvent>,\n *   }\n * });\n * ```\n *\n * `onfoo` prop will have the type `(e: FooEvent) => void`.\n */\nexport type EventName<T extends Event = Event> = string & {\n  __eventType: T;\n};\n\n// A key value map matching React prop names to event names.\ntype EventNames = Record<string, EventName | string>;\n\n// A map of expected event listener types based on EventNames.\ntype EventListeners<R extends EventNames> = {\n  [K in keyof R]?: R[K] extends EventName\n    ? (e: R[K]['__eventType']) => void\n    : (e: Event) => void;\n};\n\nexport interface Options<I extends HTMLElement, E extends EventNames = {}> {\n  react: typeof React;\n  tagName: string;\n  elementClass: Constructor<I>;\n  events?: E;\n  displayName?: string;\n}\n\ntype Constructor<T> = {new (): T};\n\nconst reservedReactProperties = new Set([\n  'children',\n  'localName',\n  'ref',\n  'style',\n  'className',\n]);\n\nconst listenedEvents = new WeakMap<Element, Map<string, EventListenerObject>>();\n\n/**\n * Adds an event listener for the specified event to the given node. In the\n * React setup, there should only ever be one event listener. Thus, for\n * efficiency only one listener is added and the handler for that listener is\n * updated to point to the given listener function.\n */\nconst addOrUpdateEventListener = (\n  node: Element,\n  event: string,\n  listener: (event?: Event) => void\n) => {\n  let events = listenedEvents.get(node);\n  if (events === undefined) {\n    listenedEvents.set(node, (events = new Map()));\n  }\n  let handler = events.get(event);\n  if (listener !== undefined) {\n    // If necessary, add listener and track handler\n    if (handler === undefined) {\n      events.set(event, (handler = {handleEvent: listener}));\n      node.addEventListener(event, handler);\n      // Otherwise just update the listener with new value\n    } else {\n      handler.handleEvent = listener;\n    }\n    // Remove listener if one exists and value is undefined\n  } else if (handler !== undefined) {\n    events.delete(event);\n    node.removeEventListener(event, handler);\n  }\n};\n\n/**\n * Sets properties and events on custom elements. These properties and events\n * have been pre-filtered so we know they should apply to the custom element.\n */\nconst setProperty = <E extends Element>(\n  node: E,\n  name: string,\n  value: unknown,\n  old: unknown,\n  events?: EventNames\n) => {\n  const event = events?.[name];\n  // Dirty check event value.\n  if (event !== undefined) {\n    if (value !== old) {\n      addOrUpdateEventListener(node, event, value as (e?: Event) => void);\n    }\n    return;\n  }\n  // But don't dirty check properties; elements are assumed to do this.\n  node[name as keyof E] = value as E[keyof E];\n\n  // This block is to replicate React's behavior for attributes of native\n  // elements where `undefined` or `null` values result in attributes being\n  // removed.\n  // https://github.com/facebook/react/blob/899cb95f52cc83ab5ca1eb1e268c909d3f0961e7/packages/react-dom-bindings/src/client/DOMPropertyOperations.js#L107-L141\n  //\n  // It's only needed here for native HTMLElement properties that reflect\n  // attributes of the same name but don't have that behavior like \"id\" or\n  // \"draggable\".\n  if (\n    (value === undefined || value === null) &&\n    name in HTMLElement.prototype\n  ) {\n    node.removeAttribute(name);\n  }\n};\n\n/**\n * Creates a React component for a custom element. Properties are distinguished\n * from attributes automatically, and events can be configured so they are added\n * to the custom element as event listeners.\n *\n * @param options An options bag containing the parameters needed to generate a\n * wrapped web component.\n *\n * @param options.react The React module, typically imported from the `react`\n * npm package.\n * @param options.tagName The custom element tag name registered via\n * `customElements.define`.\n * @param options.elementClass The custom element class registered via\n * `customElements.define`.\n * @param options.events An object listing events to which the component can\n * listen. The object keys are the event property names passed in via React\n * props and the object values are the names of the corresponding events\n * generated by the custom element. For example, given `{onactivate:\n * 'activate'}` an event function may be passed via the component's `onactivate`\n * prop and will be called when the custom element fires its `activate` event.\n * @param options.displayName A React component display name, used in debugging\n * messages. Default value is inferred from the name of custom element class\n * registered via `customElements.define`.\n */\nexport const createComponent = <\n  I extends HTMLElement,\n  E extends EventNames = {},\n>({\n  react: React,\n  tagName,\n  elementClass,\n  events,\n  displayName,\n}: Options<I, E>): ReactWebComponent<I, E> => {\n  const eventProps = new Set(Object.keys(events ?? {}));\n\n  if (DEV_MODE && !NODE_MODE) {\n    for (const p of reservedReactProperties) {\n      if (p in elementClass.prototype && !(p in HTMLElement.prototype)) {\n        // Note, this effectively warns only for `ref` since the other\n        // reserved props are on HTMLElement.prototype. To address this\n        // would require crawling down the prototype, which doesn't feel worth\n        // it since implementing these properties on an element is extremely\n        // rare.\n        console.warn(\n          `${tagName} contains property ${p} which is a React reserved ` +\n            `property. It will be used by React and not set on the element.`\n        );\n      }\n    }\n  }\n\n  type Props = ComponentProps<I, E>;\n\n  const ReactComponent = React.forwardRef<I, Props>((props, ref) => {\n    const prevElemPropsRef = React.useRef(new Map());\n    const elementRef = React.useRef<I | null>(null);\n\n    // Props to be passed to React.createElement\n    const reactProps: Record<string, unknown> = {};\n    // Props to be set on element with setProperty\n    const elementProps: Record<string, unknown> = {};\n\n    for (const [k, v] of Object.entries(props)) {\n      if (reservedReactProperties.has(k)) {\n        // React does *not* handle `className` for custom elements so\n        // coerce it to `class` so it's handled correctly.\n        reactProps[k === 'className' ? 'class' : k] = v;\n        continue;\n      }\n\n      if (eventProps.has(k) || k in elementClass.prototype) {\n        elementProps[k] = v;\n        continue;\n      }\n\n      reactProps[k] = v;\n    }\n\n    // useLayoutEffect produces warnings during server rendering.\n    if (!NODE_MODE) {\n      // This one has no dependency array so it'll run on every re-render.\n      React.useLayoutEffect(() => {\n        if (elementRef.current === null) {\n          return;\n        }\n        const newElemProps = new Map();\n        for (const key in elementProps) {\n          setProperty(\n            elementRef.current,\n            key,\n            props[key],\n            prevElemPropsRef.current.get(key),\n            events\n          );\n          prevElemPropsRef.current.delete(key);\n          newElemProps.set(key, props[key]);\n        }\n        // \"Unset\" any props from previous render that no longer exist.\n        // Setting to `undefined` seems like the correct thing to \"unset\"\n        // but currently React will set it as `null`.\n        // See https://github.com/facebook/react/issues/28203\n        for (const [key, value] of prevElemPropsRef.current) {\n          setProperty(elementRef.current, key, undefined, value, events);\n        }\n        prevElemPropsRef.current = newElemProps;\n      });\n\n      // Empty dependency array so this will only run once after first render.\n      React.useLayoutEffect(() => {\n        elementRef.current?.removeAttribute('defer-hydration');\n      }, []);\n    }\n\n    if (NODE_MODE) {\n      // If component is to be server rendered with `@lit/ssr-react`, pass\n      // element properties in a special bag to be set by the server-side\n      // element renderer.\n      if (\n        (React.createElement.name === 'litPatchedCreateElement' ||\n          globalThis.litSsrReactEnabled) &&\n        Object.keys(elementProps).length\n      ) {\n        // This property needs to remain unminified.\n        reactProps['_$litProps$'] = elementProps;\n      }\n    } else {\n      // Suppress hydration warning for server-rendered attributes.\n      // This property needs to remain unminified.\n      reactProps['suppressHydrationWarning'] = true;\n    }\n\n    return React.createElement(tagName, {\n      ...reactProps,\n      ref: React.useCallback(\n        (node: I) => {\n          elementRef.current = node;\n          if (typeof ref === 'function') {\n            ref(node);\n          } else if (ref !== null) {\n            ref.current = node;\n          }\n        },\n        [ref]\n      ),\n    });\n  });\n\n  ReactComponent.displayName = displayName ?? elementClass.name;\n\n  return ReactComponent;\n};\n","/**\n * Vio React adapter — typed React wrappers for the `<vio-*>` web components.\n *\n * Built on `@lit/react`'s `createComponent`, which gives each wrapper:\n *   - typed props derived from the element's reactive properties, and\n *   - typed event props (the `vio:*` CustomEvents below) as `onX` callbacks.\n *\n * Importing this entry also REGISTERS the custom elements (via the\n * `registerVioElements()` call below), so you do NOT need a separate\n * `import '@vio-live/web-sdk/ui'` when you use these.\n *\n * React 18+ is an (optional) peer dependency — only required if you import this\n * entry. `@lit/react` is bundled in, so consumers install nothing extra.\n *\n *   import { Vio } from '@vio-live/web-sdk'\n *   import { VioProductCarousel } from '@vio-live/web-sdk/react'\n *   Vio.init({ apiKey, apiBase, graphqlBase, stripePublishableKey })\n *   <VioProductCarousel onProductAdd={(e) => console.log(e.detail)} />\n *\n * Slots (ADR-0027): the element property is `vioSlot` (attribute `vio-slot`),\n * so in React it is `<VioProductCarousel vioSlot=\"hero\" />`. `@lit/react`\n * passes every reactive property of the element class through as a prop and\n * sets it on the element after mount — the elements re-register the slot from\n * `updated()`, so the late set is fine. `slot` itself is React's/HTML's own\n * attribute (shadow DOM slotting) — do not use it for this.\n * Typed in `index.props.test.ts` (compile-time, checked by `npm run typecheck`).\n */\n\nimport * as React from 'react'\nimport { createComponent } from '@lit/react'\nimport {\n  registerVioElements,\n  VioProduct as VioProductEl,\n  VioProductCarousel as VioProductCarouselEl,\n  VioProductDetail as VioProductDetailEl,\n  VioCart as VioCartEl,\n  VioCheckout as VioCheckoutEl,\n} from '../ui/elements.js'\n// Not just for the re-export below — the import itself injects the default\n// design tokens as CSS custom properties on `:root` (see tokens.ts). Without\n// it, `elements.js` alone never pulls tokens.ts in, so this entry (the one\n// the Vev bundle actually goes through) never ran that injection.\nimport '../ui/tokens.js'\n\n// Register the underlying custom elements when this entry is imported.\nregisterVioElements()\n\nexport const VioProduct = createComponent({\n  react: React,\n  tagName: 'vio-product',\n  elementClass: VioProductEl,\n  events: {\n    onProductClick: 'vio:product-click',\n    onProductAdd: 'vio:product-add',\n  },\n})\n\nexport const VioProductCarousel = createComponent({\n  react: React,\n  tagName: 'vio-product-carousel',\n  elementClass: VioProductCarouselEl,\n  events: {},\n})\n\nexport const VioProductDetail = createComponent({\n  react: React,\n  tagName: 'vio-product-detail',\n  elementClass: VioProductDetailEl,\n  events: {\n    onAddedToCart: 'vio:added-to-cart',\n    onCheckoutOpen: 'vio:checkout-open',\n    onLayoutApplied: 'vio:detail-layout-applied',\n  },\n})\n\nexport const VioCart = createComponent({\n  react: React,\n  tagName: 'vio-cart',\n  elementClass: VioCartEl,\n  events: {\n    onPaymentSuccess: 'vio:payment-success',\n    onCheckoutOpen: 'vio:checkout-open',\n  },\n})\n\nexport const VioCheckout = createComponent({\n  react: React,\n  tagName: 'vio-checkout',\n  elementClass: VioCheckoutEl,\n  events: {\n    onPaymentSuccess: 'vio:payment-success',\n  },\n})\n\nexport { VioTokens, applyVioTheme, type VioThemeOverrides } from '../ui/tokens.js'\n"]}