@inappstory/slide-api 0.1.40 → 0.1.41

package/dist/index.js

@@ -1987,6 +1987,65 @@ class Products {
     static get [Symbol.for("___CTOR_ARGS___")]() { return [`HTMLElement`, `Layer`, `typeof WidgetProducts.api`, `WidgetCallbacks`, `WidgetDeps`]; }
 }
 
+class ProductCarousel {
+    _elementNodeRef;
+    _layer;
+    _widgetApi;
+    _widgetCallbacks;
+    _widgetDeps;
+    static _className = "narrative-element-product-carousel";
+    static className() {
+        return ProductCarousel._className;
+    }
+    static isTypeOf(element) {
+        return element instanceof ProductCarousel;
+    }
+    constructor(_elementNodeRef, _layer, _widgetApi, _widgetCallbacks, _widgetDeps) {
+        this._elementNodeRef = _elementNodeRef;
+        this._layer = _layer;
+        this._widgetApi = _widgetApi;
+        this._widgetCallbacks = _widgetCallbacks;
+        this._widgetDeps = _widgetDeps;
+    }
+    mediaElementsLoadingPromises = [];
+    get nodeRef() {
+        return this._elementNodeRef;
+    }
+    init(localData) {
+        try {
+            this._widgetApi.init(this._elementNodeRef, localData, this._widgetCallbacks, this._widgetDeps);
+        }
+        catch (e) {
+            console.error(e);
+        }
+        return Promise.resolve(true);
+    }
+    onPause() { }
+    onResume() { }
+    onStart() {
+        this._widgetApi.onStart(this._elementNodeRef);
+    }
+    onStop() {
+        this._widgetApi.onStop(this._elementNodeRef);
+    }
+    onBeforeUnmount() {
+        return Promise.resolve();
+    }
+    handleClick() {
+        return false;
+    }
+    get isClickCapturedByWidget() {
+        return this._widgetApi.isClickCapturedByWidget(this._elementNodeRef);
+    }
+    get isLayerForcePaused() {
+        return this._widgetApi.isForcePaused(this._elementNodeRef);
+    }
+    get elementNodeRef() {
+        return this._elementNodeRef;
+    }
+    static get [Symbol.for("___CTOR_ARGS___")]() { return [`HTMLElement`, `Layer`, `typeof WidgetProductCarousel.api`, `WidgetCallbacks`, `WidgetDeps`]; }
+}
+
 class Quest {
     _elementNodeRef;
     _layer;
@@ -3466,6 +3525,10 @@ const tryCreateFromHtmlElement = (nodeRef, layer, widgetCallbacks, widgetDeps) =
                 return layoutApi.widgetVoteApi ? new Vote(nodeRef, layer, layoutApi.widgetVoteApi, widgetCallbacks, widgetDeps) : null;
             case Products.className():
                 return layoutApi.widgetProductsApi ? new Products(nodeRef, layer, layoutApi.widgetProductsApi, widgetCallbacks, widgetDeps) : null;
+            case ProductCarousel.className():
+                return layoutApi.widgetProductCarouselApi
+                    ? new ProductCarousel(nodeRef, layer, layoutApi.widgetProductCarouselApi, widgetCallbacks, widgetDeps)
+                    : null;
             case Tooltip.className():
                 return layoutApi.widgetTooltipApi ? new Tooltip(nodeRef, layer, layoutApi.widgetTooltipApi, widgetCallbacks, widgetDeps) : null;
             case Timer.className():
@@ -4019,6 +4082,14 @@ class Layer {
         }
         return null;
     }
+    get productCarouselElement() {
+        for (const element of this._elements) {
+            if (ProductCarousel.isTypeOf(element)) {
+                return element;
+            }
+        }
+        return null;
+    }
     isClickCapturedBySlider() {
         return (this.rangeSliderElement?.isClickCapturedBySlider ?? false) || (this.productsElement?.isClickCapturedByWidget ?? false);
     }
@@ -5438,6 +5509,12 @@ let SlideApi$1 = class SlideApi {
                 return result; // disable all clicks if event captured by products widget (slider or swipe down)
             }
         }
+        if (this.activeLayer.productCarouselElement) {
+            if (this.activeLayer.productCarouselElement.isClickCapturedByWidget) {
+                result.canClickNext = false;
+                return result; // disable all clicks if event captured by product carousel widget
+            }
+        }
         if (this.activeLayer.questElement) {
             const slideIndex = this.slide.slideIndex;
             const slideCount = this.slide.slideCount;
@@ -19949,6 +20026,10 @@ class BottomSheet extends RenderableComponent {
         }), h("div", {
             class: "ias-bottom-sheet__container",
             style: this.props.minHeight != null ? `min-height: ${this.props.minHeight + borderRadius}px` : "",
+            onclick: e => {
+                e.preventDefault();
+                e.stopPropagation();
+            },
         }, h("div", { class: "ias-bottom-sheet__content" }, 
         /* h("div", { class: "ias-bottom-sheet__header" }), */
         h("div", { class: "ias-bottom-sheet__body" }, ...(this.props?.children?.map(c => c.render()) ?? [])))));
@@ -20013,7 +20094,7 @@ class ProductDetailsGallery extends RenderableComponent {
     static get [Symbol.for("___CTOR_ARGS___")]() { return [`ProductDetailsGalleryProps`]; }
 }
 
-const ADD_TO_CART_TIMEOUT = 60000;
+const ADD_TO_CART_TIMEOUT$1 = 60000;
 
 class ProductDetailsPurchaseAction extends RenderableComponent {
     button;
@@ -20038,7 +20119,13 @@ class ProductDetailsPurchaseAction extends RenderableComponent {
             await this.addToCart();
         }
         catch (error) {
-            this.handleAddToCartError(error);
+            if (error instanceof Error) {
+                this.handleAddToCartError(error);
+            }
+            else if (typeof error === "string") {
+                // Native SDKs return a string
+                this.handleAddToCartError(new Error(error));
+            }
         }
         finally {
             this.hideLoader();
@@ -20055,7 +20142,7 @@ class ProductDetailsPurchaseAction extends RenderableComponent {
         this.props.onAddToCartError({ error });
     }
     async addToCart() {
-        await Promise.race([this.props.onAddToCart(), new Promise((resolve, reject) => setTimeout(reject, ADD_TO_CART_TIMEOUT))]);
+        await Promise.race([this.props.onAddToCart(), new Promise((resolve, reject) => setTimeout(reject, ADD_TO_CART_TIMEOUT$1))]);
     }
     static get [Symbol.for("___CTOR_ARGS___")]() { return [`ProductDetailsPurchaseActionProps`]; }
 }
@@ -20458,13 +20545,15 @@ class ProductCheckout extends RenderableComponent {
         }, h("button", {
             class: "ias-product-checkout__button ias-product-checkout__button--close",
             textContent: this.props.translations.continueBtn,
-            onclick: () => {
+            onclick: e => {
+                e.stopPropagation();
                 this.props.onClose();
             },
         }), h("button", {
             class: "ias-product-checkout__button ias-product-checkout__button--checkout",
             textContent: this.props.translations.goToCartBtn,
-            onclick: () => {
+            onclick: e => {
+                e.stopPropagation();
                 this.props.onCheckout();
             },
         })));
@@ -20521,6 +20610,7 @@ class ProductComponentsFactory {
         const bs = new BottomSheet({
             onClose: () => {
                 bs.destroy();
+                props.onClose?.();
             },
             children: [],
             minHeight: props.minHeight,
@@ -20543,10 +20633,7 @@ class ProductComponentsFactory {
             },
         });
     }
-    createProductCheckout(bottomSheet, offers) {
-        const offersByIds = {};
-        for (const offer of offers)
-            offersByIds[offer.offerId] = offer;
+    createProductCheckout(bottomSheet) {
         return new ProductCheckout({
             onClose: () => bottomSheet.close(),
             onCheckout: () => {
@@ -20560,7 +20647,6 @@ class ProductComponentsFactory {
             onClick: async () => {
                 try {
                     const state = await this.widgetDeps.slideApiDeps.productCartGetState();
-                    console.log({ cart: state });
                     this.widgetDeps.slideApiDeps.showToast(JSON.stringify(state.offers.map(({ offerId, name, quantity }) => ({
                         offerId,
                         name,
@@ -20630,10 +20716,16 @@ class ProductDetailsBottomSheet extends RenderableComponent {
         super(props);
         this.widgetDeps = widgetDeps;
         this.factory = new ProductComponentsFactory(this.widgetDeps, this.props);
-        this.bottomSheet = this.factory.createBottomSheet({ minHeight: props.height });
+        this.bottomSheet = this.factory.createBottomSheet({
+            minHeight: props.height,
+            onClose: () => {
+                this._root?.remove();
+                this.props.onClose?.();
+            },
+        });
     }
     renderTemplate() {
-        return this.bottomSheet.render();
+        return h("div", { class: "ias-products-container-view" }, this.bottomSheet.render());
     }
     open(params) {
         this.showProductDetails(params);
@@ -20652,17 +20744,17 @@ class ProductDetailsBottomSheet extends RenderableComponent {
             onAddToCart: async (payload) => {
                 await this.productCartUpdate({
                     offerDtos,
-                    product: payload.product,
+                    offerId: payload.product.offerId,
                     quantity: payload.quantity,
                 });
-                this.showProductCheckout({ offerDtos });
+                this.showProductCheckout();
             },
             isCartSupported,
         });
         this.updateBottomSheetContent(productDetails);
     }
-    showProductCheckout({ offerDtos }) {
-        const productCheckout = this.factory.createProductCheckout(this.bottomSheet, offerDtos);
+    showProductCheckout() {
+        const productCheckout = this.factory.createProductCheckout(this.bottomSheet);
         this.updateBottomSheetContent(productCheckout);
     }
     updateBottomSheetContent(content) {
@@ -20672,10 +20764,10 @@ class ProductDetailsBottomSheet extends RenderableComponent {
             children,
         });
     }
-    async productCartUpdate({ offerDtos, product, quantity }) {
-        const offerDto = offerDtos.find(offerDto => product.offerId === offerDto.offerId);
+    async productCartUpdate({ offerDtos, offerId, quantity }) {
+        const offerDto = offerDtos.find(offerDto => offerId === offerDto.offerId);
         if (!offerDto)
-            throw new Error(`[IAS]: Not found offer for ID ${product.offerId}`);
+            throw new Error(`[IAS]: Not found offer for ID ${offerId}`);
         const cartOffer = ProductOfferMapper.fromOfferDtoToProductCartOffer(offerDto, quantity);
         const delay = async () => new Promise(resolve => setTimeout(resolve, 300));
         const [productCart] = await Promise.all([
@@ -20695,6 +20787,271 @@ class ProductDetailsBottomSheet extends RenderableComponent {
     static get [Symbol.for("___CTOR_ARGS___")]() { return [`WidgetDeps`, `ProductDetailsBottomSheetProps`]; }
 }
 
+class ProductCheckoutBottomSheet extends RenderableComponent {
+    widgetDeps;
+    factory;
+    bottomSheet;
+    constructor(widgetDeps, props) {
+        super(props);
+        this.widgetDeps = widgetDeps;
+        this.factory = new ProductComponentsFactory(this.widgetDeps, this.props);
+        this.bottomSheet = this.factory.createBottomSheet({
+            onClose: () => {
+                this._root?.remove();
+                this.props.onClose?.();
+            },
+        });
+    }
+    renderTemplate() {
+        return h("div", { class: "ias-products-container-view" }, this.bottomSheet.render());
+    }
+    open() {
+        const productCheckout = this.factory.createProductCheckout(this.bottomSheet);
+        this.updateBottomSheetContent(productCheckout);
+        this.bottomSheet.open();
+    }
+    async productCartUpdate({ offerDtos, offerId, quantity }) {
+        const offerDto = offerDtos.find(offerDto => offerId === offerDto.offerId);
+        if (!offerDto)
+            throw new Error(`[IAS]: Not found offer for ID ${offerId}`);
+        const cartOffer = ProductOfferMapper.fromOfferDtoToProductCartOffer(offerDto, quantity);
+        const delay = async () => new Promise(resolve => setTimeout(resolve, 300));
+        const [productCart] = await Promise.all([
+            this.widgetDeps.slideApiDeps.productCartUpdate({
+                offer: cartOffer,
+            }),
+            delay(),
+        ]);
+        return productCart.offers;
+    }
+    updateBottomSheetContent(content) {
+        const cartButton = this.factory.createProductCartButton();
+        const children = process.env.NODE_ENV === "staging" ? [cartButton, content] : [content];
+        this.bottomSheet.updateProps({
+            children,
+        });
+    }
+    static get [Symbol.for("___CTOR_ARGS___")]() { return [`WidgetDeps`, `ProductCheckoutBottomSheetProps`]; }
+}
+
+class ProductOffersRequestError extends Error {
+    status;
+    code;
+    cause;
+    constructor(message, params) {
+        super(message);
+        this.name = this.constructor.name;
+        this.status = params?.status;
+        this.code = params?.code;
+        this.cause = params?.cause;
+    }
+    static get [Symbol.for("___CTOR_ARGS___")]() { return [`string`, `{ status?: number; code?: string; cause?: unknown }`]; }
+}
+class ProductOffersNetworkError extends ProductOffersRequestError {
+}
+class ProductOffersServiceError extends ProductOffersRequestError {
+}
+class ProductOfferRepository {
+    widgetDeps;
+    getLinkTarget;
+    getMsgNetworkError;
+    getMsgServiceError;
+    static rawOffersCache = new Map();
+    static pendingFetches = new Map();
+    static RAW_CACHE_TTL_MS = 60_000;
+    offers = [];
+    constructor(widgetDeps, getLinkTarget, getMsgNetworkError, getMsgServiceError) {
+        this.widgetDeps = widgetDeps;
+        this.getLinkTarget = getLinkTarget;
+        this.getMsgNetworkError = getMsgNetworkError;
+        this.getMsgServiceError = getMsgServiceError;
+    }
+    getCurrentModels() {
+        return this.offers;
+    }
+    clear() {
+        this.offers = [];
+    }
+    async getOrFetchProducts() {
+        if (this.offers.length > 0)
+            return this.offers;
+        const cacheKey = this.getCacheKey();
+        const cached = ProductOfferRepository.getRawFromCache(cacheKey);
+        if (cached != null && cached.length > 0) {
+            const cloned = cached.slice();
+            this.offers = cloned;
+            return this.offers;
+        }
+        const result = await this.fetchProductsRaw(cacheKey);
+        if (result.models.length > 0) {
+            const offers = result.models.slice();
+            const { objectUrls } = await ProductOfferRepository.hydrateOfferImageBlobs(offers, this.getMsgNetworkError());
+            ProductOfferRepository.rawOffersCache.set(cacheKey, {
+                cachedAtMs: Date.now(),
+                offers,
+                objectUrls,
+            });
+            this.offers = offers;
+            return this.offers;
+        }
+        throw new ProductOffersServiceError(result.message);
+    }
+    async fetchProductsRaw(cacheKey) {
+        const existing = ProductOfferRepository.pendingFetches.get(cacheKey);
+        if (existing)
+            return existing;
+        const request = (async () => {
+            try {
+                const linkTarget = this.getOfferIdsOrThrow();
+                const path = this.buildOffersPath(linkTarget);
+                const headers = this.getOffersHeaders();
+                const profileKey = "fetch-products";
+                const response = await this.widgetDeps.slideApiDeps.sendApiRequest(path, "GET", null, headers, null, profileKey);
+                return this.parseOffersResponse(response.status, response.data);
+            }
+            catch (error) {
+                console.error(error);
+                throw error;
+            }
+            finally {
+                ProductOfferRepository.pendingFetches.delete(cacheKey);
+            }
+        })();
+        const delayed = Promise.all([request, new Promise(t => setTimeout(t, 200))]).then(([result]) => result);
+        ProductOfferRepository.pendingFetches.set(cacheKey, delayed);
+        return delayed;
+    }
+    getOfferIdsOrThrow() {
+        const linkTarget = this.getLinkTarget();
+        if (!linkTarget.length) {
+            throw new ProductOffersServiceError(this.getMsgServiceError() ?? "", { code: "EMPTY_OFFER_IDS" });
+        }
+        return linkTarget;
+    }
+    buildOffersPath(offerIds) {
+        const qs = this.buildOffersQueryString(offerIds);
+        return `product/offer?${qs}`;
+    }
+    buildOffersQueryString(offerIds) {
+        let qs = `id=${offerIds.join(",")}&expand=images,subOffersApi`;
+        const sdkClientVariables = this.widgetDeps.getSdkClientVariables();
+        if (sdkClientVariables?.pos != null) {
+            qs += `&pos=${String(sdkClientVariables.pos)}`;
+        }
+        return qs;
+    }
+    getOffersHeaders() {
+        return {
+            accept: "application/json",
+            "Content-Type": "application/json",
+        };
+    }
+    parseOffersResponse(status, data) {
+        if (status === 200 || status === 201) {
+            if (Array.isArray(data) && data.length > 0) {
+                return { message: "", models: data };
+            }
+            throw new ProductOffersServiceError(this.getMsgServiceError() ?? "", { status, code: "EMPTY_RESPONSE" });
+        }
+        // WinInet-like network errors sometimes bubble up as "status"
+        if (status === 12163 || status === 12002) {
+            throw new ProductOffersNetworkError(this.getMsgNetworkError() ?? "", { status, code: "NETWORK" });
+        }
+        // All other statuses are treated as a general service error.
+        throw new ProductOffersServiceError(this.getMsgServiceError() ?? "", { status, code: "SERVICE_ERROR" });
+    }
+    getCacheKey() {
+        const ids = [...this.getLinkTarget()].sort((a, b) => a - b).join(",");
+        const sdkClientVariables = this.widgetDeps.getSdkClientVariables();
+        const pos = sdkClientVariables?.pos != null ? String(sdkClientVariables.pos) : "";
+        return `offers:${ids}:pos:${pos}`;
+    }
+    static revokeObjectUrls(urls) {
+        for (const u of urls) {
+            try {
+                URL.revokeObjectURL(u);
+            }
+            catch {
+                // ignore
+            }
+        }
+    }
+    static collectDistinctImageUrls(offers, into) {
+        for (const o of offers) {
+            if (o.coverUrl) {
+                into.add(o.coverUrl);
+            }
+            if (o.images?.length) {
+                for (const img of o.images) {
+                    if (img.url) {
+                        into.add(img.url);
+                    }
+                }
+            }
+            if (o.subOffersApi?.length) {
+                this.collectDistinctImageUrls(o.subOffersApi, into);
+            }
+        }
+    }
+    static applyImageBlobMap(offers, originalToBlob) {
+        for (const o of offers) {
+            const coverOrig = o.coverUrl;
+            if (coverOrig) {
+                const blobUrl = originalToBlob.get(coverOrig);
+                if (blobUrl) {
+                    o.coverUrl = blobUrl;
+                }
+            }
+            if (o.images?.length) {
+                for (const img of o.images) {
+                    const urlOrig = img.url;
+                    const blobUrl = originalToBlob.get(urlOrig);
+                    if (blobUrl) {
+                        img.url = blobUrl;
+                    }
+                }
+            }
+            if (o.subOffersApi?.length) {
+                this.applyImageBlobMap(o.subOffersApi, originalToBlob);
+            }
+        }
+    }
+    /**
+     * Fetches `coverUrl` and `images[].url` as blobs and replaces them with `blob:` URLs.
+     * Products are considered unresolved until this completes successfully.
+     */
+    static async hydrateOfferImageBlobs(offers, networkErrorMessage) {
+        const distinct = new Set();
+        ProductOfferRepository.collectDistinctImageUrls(offers, distinct);
+        const objectUrls = [];
+        const originalToBlob = new Map();
+        await Promise.all([...distinct].map(async (original) => {
+            const response = await fetch(original, { mode: "cors" });
+            if (!response.ok) {
+                throw new ProductOffersNetworkError(networkErrorMessage ?? "", { status: response.status, code: "IMAGE_BLOB_FETCH" });
+            }
+            const blob = await response.blob();
+            const blobUrl = URL.createObjectURL(blob);
+            objectUrls.push(blobUrl);
+            originalToBlob.set(original, blobUrl);
+        }));
+        ProductOfferRepository.applyImageBlobMap(offers, originalToBlob);
+        return { objectUrls };
+    }
+    static getRawFromCache(cacheKey) {
+        const item = this.rawOffersCache.get(cacheKey);
+        if (!item)
+            return null;
+        if (Date.now() - item.cachedAtMs > this.RAW_CACHE_TTL_MS) {
+            ProductOfferRepository.revokeObjectUrls(item.objectUrls);
+            this.rawOffersCache.delete(cacheKey);
+            return null;
+        }
+        return item.offers;
+    }
+    static get [Symbol.for("___CTOR_ARGS___")]() { return [`WidgetDeps`, `() => Array<number>`, `() => string | undefined`, `() => string | undefined`]; }
+}
+
 /**
  * adult: null
  * availability: 1
@@ -20750,6 +21107,7 @@ class WidgetProducts extends WidgetBase {
         this.isScreenSupportsTouch = isScreenSupportsTouch(this.env);
         this.msgNetworkError = getTagData(this.element, "msgNetworkError");
         this.msgServiceError = getTagData(this.element, "msgServiceError");
+        this.repository = new ProductOfferRepository(this.widgetDeps, () => this.linkTarget, () => this.msgNetworkError, () => this.msgServiceError);
     }
     /**
      * Start or restart widget
@@ -20845,107 +21203,6 @@ class WidgetProducts extends WidgetBase {
             console.error(error);
         }
     }
-    async getOrFetchProducts() {
-        if (this.currentModels.length > 0)
-            return this.currentModels;
-        const result = await this.fetchProducts();
-        if (result.models.length > 0) {
-            this.currentModels = result.models;
-            return result.models;
-        }
-        throw new Error(result.message);
-    }
-    async fetchProducts() {
-        const fetchAndCacheMedia = async () => {
-            if (!this.linkTarget.length) {
-                return { message: this.msgServiceError ?? "", models: [] };
-            }
-            let qs = `id=${this.linkTarget.join(",")}&expand=images,subOffersApi`;
-            const sdkClientVariables = this.widgetDeps.getSdkClientVariables();
-            if (sdkClientVariables != null && sdkClientVariables.pos != null) {
-                qs += `&pos=${String(sdkClientVariables.pos)}`;
-            }
-            const path = `product/offer?${qs}`;
-            const headers = {
-                accept: "application/json",
-                "Content-Type": "application/json",
-            };
-            const profileKey = "fetch-products";
-            try {
-                const response = await this.widgetDeps.slideApiDeps.sendApiRequest(path, "GET", null, headers, null, profileKey);
-                // console.log({response});
-                const status = response.status;
-                if (status === 200 || status === 201) {
-                    if (response.data && Array.isArray(response.data) && response.data.length > 0) {
-                        try {
-                            await this.cacheOffersMediaResources(response.data);
-                        }
-                        catch (error) {
-                            console.error(error);
-                        }
-                        return { message: "", models: response.data };
-                    }
-                    else {
-                        return { message: this.msgServiceError ?? "", models: [] };
-                    }
-                }
-                else if (status === 12163 || status === 12002) {
-                    return { message: this.msgNetworkError ?? "", models: [] };
-                }
-                else {
-                    return { message: this.msgServiceError ?? "", models: [] };
-                }
-            }
-            catch (error) {
-                console.error(error);
-                return { message: this.msgServiceError ?? "", models: [] };
-            }
-        };
-        return Promise.all([
-            fetchAndCacheMedia(),
-            new Promise(t => {
-                return setTimeout(t, 200);
-            }),
-        ]).then(([result]) => result);
-    }
-    cacheOffersMediaResources(offers) {
-        const cacheItem = (offer) => {
-            return new Promise(resolve => {
-                if (offer.coverUrl != null) {
-                    this.env
-                        .fetch(offer.coverUrl)
-                        .then(response => {
-                        if (response != null && response.ok) {
-                            response
-                                .blob()
-                                .then(blob => {
-                                offer.coverUrl = URL.createObjectURL(blob);
-                                resolve();
-                            })
-                                .catch(resolve);
-                        }
-                        else {
-                            resolve();
-                        }
-                    })
-                        .catch(resolve);
-                }
-                else {
-                    resolve();
-                }
-            });
-        };
-        const promises = offers.map(cacheItem);
-        return Promise.all(promises);
-    }
-    revokeOffersMediaResources(offers) {
-        offers.forEach(offer => {
-            if (offer.coverUrl != null) {
-                // todo check if coverUrl really is object URL
-                URL.revokeObjectURL(offer.coverUrl);
-            }
-        });
-    }
     initSwipeGestureDetector() {
         if (this.isOpen) {
             if (this.swipeGestureDetector == null) {
@@ -20973,7 +21230,7 @@ class WidgetProducts extends WidgetBase {
     get isForcePaused() {
         return this.isOpen;
     }
-    currentModels = [];
+    repository;
     async openProductsView() {
         if (this.isOpen || this.isLoading) {
             return;
@@ -20987,7 +21244,7 @@ class WidgetProducts extends WidgetBase {
         }
         try {
             this.isLoading = true;
-            const models = await this.getOrFetchProducts();
+            const models = await this.repository.getOrFetchProducts();
             this.productsView = this.createProductsView(models, this.closeProductsView.bind(this));
             this.productsView.classList.add("ias-products-container-view--visible");
             this.slide.appendChild(this.productsView);
@@ -21026,12 +21283,11 @@ class WidgetProducts extends WidgetBase {
         const onClosed = () => {
             this.productsView?.removeEventListener("animationend", onClosed);
             this.productsView?.parentElement?.removeChild(this.productsView);
-            this.revokeOffersMediaResources(this.currentModels);
             if (!this.disableTimer) {
                 this.onWidgetRequireResumeUI();
             }
             this.isOpen = false;
-            this.currentModels = [];
+            this.repository.clear();
         };
         this.productsView?.addEventListener("animationend", onClosed);
     }
@@ -21295,6 +21551,446 @@ class WidgetProducts extends WidgetBase {
     static get [Symbol.for("___CTOR_ARGS___")]() { return [`HTMLElement`, `Partial`, `WidgetCallbacks`, `WidgetDeps`]; }
 }
 
+const ADD_TO_CART_TIMEOUT = 60000;
+class BottomSheetMountingError extends Error {
+    constructor() {
+        super("[IAS]: products bottom sheet mounting error");
+        this.name = "BottomSheetMountingError";
+    }
+    static get [Symbol.for("___CTOR_ARGS___")]() { return []; }
+}
+class WidgetProductCarousel extends WidgetBase {
+    static DEFAULTS = {
+        slide: null,
+        activateAfterCreate: false,
+        create: false,
+        localData: {},
+    };
+    static widgetClassName = "narrative-element-product-carousel";
+    captionView;
+    offerIds = [];
+    msgNetworkError;
+    msgServiceError;
+    isScreenSupportsTouch;
+    isLoading = false;
+    repository;
+    canClick = false;
+    isBottomSheetOpened = false;
+    isClickCapturedByScroll = false;
+    $carousel = null;
+    $track = null;
+    isTouchListenersInit = false;
+    constructor(element, options, widgetCallbacks, widgetDeps) {
+        super(element, options, widgetCallbacks, widgetDeps);
+        this.captionView = this.element.querySelector(".narrative-element-text-lines");
+        this.isScreenSupportsTouch = isScreenSupportsTouch(this.env);
+        this.ajustGeometryMargin();
+        const offerIds = decodeURIComponent(getTagData(element, "offerIds") ?? "[]");
+        try {
+            const parsed = JSON.parse(offerIds);
+            if (Array.isArray(parsed)) {
+                this.offerIds = parsed.filter(FilterNumber);
+            }
+        }
+        catch (e) {
+            console.error(e);
+        }
+        this.msgNetworkError = getTagData(this.element, "msgNetworkError");
+        this.msgServiceError = getTagData(this.element, "msgServiceError");
+        this.repository = new ProductOfferRepository(this.widgetDeps, () => this.offerIds, () => this.msgNetworkError, () => this.msgServiceError);
+    }
+    onRefreshUserData(localData) {
+        super.onRefreshUserData(localData);
+        this.isLoading = false;
+        this.renderCarousel();
+    }
+    onStart() {
+        super.onStart();
+        this.canClick = true;
+        this.initTouchListeners();
+    }
+    onStop() {
+        super.onStop();
+        this.isClickCapturedByScroll = false;
+        this.isBottomSheetOpened = false;
+        this.canClick = false;
+        this.isTouchListenersInit = false;
+        this.enableHostUIInteraction();
+        this.widgetDeps.slideRoot.removeEventListener("touchstart", this.handleMouseDown);
+        this.widgetDeps.slideRoot.removeEventListener("mousedown", this.handleMouseDown);
+        this.widgetDeps.slideRoot.removeEventListener("touchend", this.handleMouseUp);
+        this.widgetDeps.slideRoot.removeEventListener("mouseup", this.handleMouseUp);
+    }
+    getIsClickCapturedByWidget() {
+        return this.isClickCapturedByScroll || this.isBottomSheetOpened;
+    }
+    get isForcePaused() {
+        return this.isBottomSheetOpened;
+    }
+    /** Offset compensation for an elongated viewport */
+    ajustGeometryMargin() {
+        this.element.parentElement.style.padding = "0 var(--x-offset, 0px)";
+    }
+    isTransparentElement() {
+        if (!this.element)
+            return false;
+        try {
+            const color = window.getComputedStyle(this.element).color;
+            return color === "transparent" || color === "rgba(0, 0, 0, 0)" || color === "rgba(0,0,0,0)";
+        }
+        catch (err) {
+            console.error(err);
+        }
+        return false;
+    }
+    async renderCarousel() {
+        if (this.isLoading)
+            return;
+        if (!this.offerIds.length)
+            throw new Error("[IAS]: empty offer ids list");
+        this.isLoading = true;
+        if (!this.isTransparentElement()) {
+            this.element.classList.add("loader");
+        }
+        try {
+            const models = await this.repository.getOrFetchProducts();
+            this.renderInlineCarousel(models);
+        }
+        catch (error) {
+            if (error instanceof Error) {
+                this.widgetDeps.slideApiDeps.showToast(error.message);
+            }
+        }
+        finally {
+            this.isLoading = false;
+            this.element.classList.remove("loader");
+        }
+    }
+    initTouchListeners() {
+        if (!this.isTouchListenersInit) {
+            this.widgetDeps.slideRoot.addEventListener("touchstart", this.handleMouseDown);
+            this.widgetDeps.slideRoot.addEventListener("mousedown", this.handleMouseDown);
+            this.isTouchListenersInit = true;
+        }
+    }
+    handleMouseDown = (e) => {
+        let scrollView = e.target;
+        if (!scrollView.classList.contains("ias-products-inline-carousel-scroll-view")) {
+            scrollView = scrollView.closest(".ias-products-inline-carousel-scroll-view");
+        }
+        if (!scrollView) {
+            return;
+        }
+        this.isClickCapturedByScroll = true;
+        this.widgetDeps.slideApiDeps.disableHorizontalSwipeGesture();
+        this.widgetDeps.slideApiDeps.disableVerticalSwipeGesture();
+        this.widgetDeps.slideRoot.addEventListener("touchend", this.handleMouseUp);
+        this.widgetDeps.slideRoot.addEventListener("mouseup", this.handleMouseUp);
+    };
+    handleMouseUp = () => {
+        this.widgetDeps.slideRoot.removeEventListener("touchend", this.handleMouseUp);
+        this.widgetDeps.slideRoot.removeEventListener("mouseup", this.handleMouseUp);
+        this.env.requestAnimationFrame(() => {
+            this.widgetDeps.slideApiDeps.enableHorizontalSwipeGesture();
+            this.widgetDeps.slideApiDeps.enableVerticalSwipeGesture();
+            this.isClickCapturedByScroll = false;
+        });
+    };
+    createCarousel() {
+        this.$carousel = h("div", { class: "ias-products-inline-carousel" });
+        this.element.appendChild(this.$carousel);
+        this.$carousel.dir = this.layoutDirection;
+        this.$track = h("div", { class: "ias-products-inline-carousel-scroll-view", ontouchstart: () => { }, onmousedown: () => { } });
+        this.$carousel.appendChild(this.$track);
+        return { carousel: this.$carousel, track: this.$track };
+    }
+    renderInlineCarousel(offers) {
+        if (this.$carousel)
+            return;
+        const { carousel, track } = this.createCarousel();
+        track.innerHTML = "";
+        offers.forEach(offer => {
+            track.appendChild(this.renderCard(offer));
+        });
+        const controls = this.renderCarouselControls();
+        this.env.requestAnimationFrame(() => {
+            if (track.scrollWidth > track.clientWidth && controls) {
+                carousel.appendChild(controls);
+            }
+        });
+    }
+    renderCarouselControls() {
+        if (this.isScreenSupportsTouch)
+            return null;
+        const scrollControlStartIconView = h("div", { class: "ias-product-carousel-scroll-control-start-icon-view" });
+        const scrollControlEndIconView = h("div", { class: "ias-product-carousel-scroll-control-end-icon-view" });
+        const scrollControlStartView = h("div", {
+            class: "ias-product-carousel-scroll-control-start-view",
+            onclick: (e) => {
+                if (!this.canClick)
+                    return;
+                e.preventDefault();
+                e.stopPropagation();
+                if (this.layoutDirection === "ltr") {
+                    this.navigatePrev();
+                }
+                else {
+                    this.navigateNext();
+                }
+            },
+        }, scrollControlStartIconView);
+        const scrollControlEndView = h("div", {
+            class: "ias-product-carousel-scroll-control-end-view",
+            onclick: (e) => {
+                if (!this.canClick)
+                    return;
+                e.preventDefault();
+                e.stopPropagation();
+                if (this.layoutDirection === "ltr") {
+                    this.navigateNext();
+                }
+                else {
+                    this.navigatePrev();
+                }
+            },
+        }, scrollControlEndIconView);
+        return h("div", { class: "ias-product-carousel-scroll-controls-view" }, scrollControlStartView, scrollControlEndView);
+    }
+    navigatePrev() {
+        this.setScrollLeft(this.getScrollLeft() - this.getScrollViewportWidth());
+    }
+    navigateNext() {
+        this.setScrollLeft(this.getScrollLeft() + this.getScrollViewportWidth());
+    }
+    setScrollLeft(value) {
+        if (this.$track != null) {
+            this.$track.scrollLeft = Math.round(value);
+        }
+    }
+    getScrollLeft() {
+        if (this.$track != null) {
+            return this.$track.scrollLeft;
+        }
+        return 0;
+    }
+    getScrollViewportWidth() {
+        if (this.$track != null) {
+            return this.$track.clientWidth;
+        }
+        return 0;
+    }
+    renderCard(offer) {
+        const contentEl = this.renderCardContent(offer);
+        const card = h("div", { class: "ias-product-card" }, this.renderCardImage(offer), contentEl);
+        card.onclick = e => {
+            if (this.isBottomSheetOpened || !this.canClick)
+                return;
+            e.stopPropagation();
+            e.preventDefault();
+            if (!this.disableTimer) {
+                this.onWidgetRequirePauseUI();
+            }
+            this.statEventWidgetCardClick(offer);
+            this.showProductDetails({ offer, card });
+        };
+        return card;
+    }
+    showProductDetails = ({ offer, card }) => {
+        const bs = new ProductDetailsBottomSheet(this.widgetDeps, this.getBottomSheetParams());
+        const bsNode = bs.render();
+        if (!bsNode)
+            throw new BottomSheetMountingError();
+        this.slide.appendChild(bsNode);
+        bs.open({ offer, isCartSupported: this.isCartSupported() });
+        this.isBottomSheetOpened = true;
+        this.disableHostUIInteraction();
+    };
+    renderCardImage(offer) {
+        const coverUrl = offer.coverUrl ?? "";
+        const title = offer.name ?? "";
+        const img = coverUrl
+            ? h("img", {
+                src: coverUrl,
+                alt: title,
+                /* loading: "lazy", */
+            })
+            : null;
+        return h("div", { class: "ias-product-card__image" }, img, h("div", {
+            class: "ias-product-card__image-mask",
+        }));
+    }
+    renderCardContent(offer) {
+        const titleEl = this.renderCardTitle(offer);
+        const pricesEl = this.renderCardPrices(offer);
+        const purchaseButtonEl = this.renderPurchaseButton(offer);
+        const rowEl = h("div", { class: "ias-product-card__row" }, pricesEl, purchaseButtonEl);
+        return h("div", { class: "ias-product-card__content" }, titleEl, rowEl);
+    }
+    renderCardTitle(offer) {
+        const title = offer.name ?? "";
+        return h("h3", { class: "ias-product-card__title", textContent: title });
+    }
+    renderCardPrices(offer) {
+        const priceEl = offer.price != null && offer.currency != null
+            ? h("span", {
+                class: "ias-product-card__price",
+                innerHTML: formatter.asCurrency(offer.price, offer.currency),
+            })
+            : null;
+        const oldPriceEl = offer.oldPrice != null && offer.currency != null
+            ? h("span", {
+                class: "ias-product-card__price ias-product-card__price--old",
+                innerHTML: formatter.asCurrency(offer.oldPrice, offer.currency),
+            })
+            : null;
+        return h("div", { class: "ias-product-card__prices" }, priceEl, oldPriceEl);
+    }
+    renderPurchaseButton(offer) {
+        const isCartSupported = this.isCartSupported();
+        if (!isCartSupported && !offer.url)
+            return null;
+        const button = h("button", {
+            class: "ias-product-card__purchase-button",
+            type: "button",
+            textContent: getTagData(this.element, "msgBuyNow") ?? "Buy now",
+            onclick: e => {
+                if (!this.canClick)
+                    return;
+                if (!this.disableTimer) {
+                    this.onWidgetRequirePauseUI();
+                }
+                e.stopPropagation();
+                this.statEventWidgetCardClick(offer);
+                if (isCartSupported) {
+                    this.addToCart(offer, button);
+                }
+                else if (offer.url) {
+                    this.widgetDeps.slideApiDeps.openUrl({ type: "link", link: { type: "url", target: offer.url } });
+                }
+            },
+        });
+        return button;
+    }
+    async withTimeout(promise, timeout) {
+        await Promise.race([promise, new Promise((resolve, reject) => setTimeout(reject, timeout))]);
+    }
+    async addToCart(offerDto, button) {
+        if (this.isLoading || this.isBottomSheetOpened)
+            return;
+        try {
+            this.isLoading = true;
+            button.classList.add("loader");
+            const bs = new ProductCheckoutBottomSheet(this.widgetDeps, this.getBottomSheetParams());
+            await this.withTimeout(bs.productCartUpdate({
+                offerDtos: this.repository.getCurrentModels(),
+                offerId: offerDto.offerId,
+                quantity: 1,
+            }), ADD_TO_CART_TIMEOUT);
+            const bsNode = bs.render();
+            if (!bsNode)
+                throw new BottomSheetMountingError();
+            this.slide.appendChild(bsNode);
+            bs.open();
+            this.isBottomSheetOpened = true;
+            this.disableHostUIInteraction();
+        }
+        catch (error) {
+            if (error instanceof Error) {
+                this.widgetDeps.slideApiDeps.showToast(error.message);
+            }
+            else if (typeof error === "string") {
+                // Native SDKs return a string
+                this.widgetDeps.slideApiDeps.showToast(error);
+            }
+        }
+        finally {
+            button.classList.remove("loader");
+            this.isLoading = false;
+        }
+    }
+    getBottomSheetParams() {
+        return {
+            translations: {
+                color: getTagData(this.element, "msgColor") ?? "",
+                size: getTagData(this.element, "msgSize") ?? "",
+                addToCart: getTagData(this.element, "msgAddToCart") ?? "",
+                successAddToCart: getTagData(this.element, "msgSuccess") ?? "",
+                successSubAddToCart: getTagData(this.element, "msgSuccessSub") ?? "",
+                errorAddToCart: getTagData(this.element, "msgError") ?? "",
+                goToCartBtn: getTagData(this.element, "msgGoToCart") ?? "",
+                continueBtn: getTagData(this.element, "msgContinue") ?? "",
+                openUrl: getTagData(this.element, "msgOpenUrl") ?? "",
+            },
+            onClose: () => {
+                if (!this.disableTimer) {
+                    this.onWidgetRequireResumeUI();
+                }
+                this.isBottomSheetOpened = false;
+                this.enableHostUIInteraction();
+            },
+        };
+    }
+    statEventWidgetCardClick(offer) {
+        try {
+            const captionViewText = this.captionView?.textContent ?? "";
+            this.sendStatisticEventToApp("w-product-carousel-card-click", {
+                ...this.statisticEventBaseFieldsShortForm,
+                wi: this.elementId,
+                wl: captionViewText,
+                wv: offer.offerId,
+                wvi: offer.id,
+            }, {
+                ...this.statisticEventBaseFieldsFullForm,
+                widget_id: this.elementId,
+                widget_label: captionViewText,
+                widget_value: offer.offerId,
+                widget_value_id: offer.id,
+            }, {
+                forceEnableStatisticV2: true,
+            });
+        }
+        catch (error) {
+            console.error(error);
+        }
+    }
+    isCartSupported() {
+        const isCartEnabled = getTagData(this.element, "isCartEnabled") === "true";
+        return this.widgetDeps.slideApiDeps.isSdkSupportProductCart && isCartEnabled;
+    }
+    disableHostUIInteraction() {
+        this.widgetDeps.slideApiDeps.disableHorizontalSwipeGesture();
+        this.widgetDeps.slideApiDeps.disableVerticalSwipeGesture();
+        this.widgetDeps.slideApiDeps.disableBackpress();
+    }
+    enableHostUIInteraction() {
+        this.widgetDeps.slideApiDeps.enableHorizontalSwipeGesture();
+        this.widgetDeps.slideApiDeps.enableVerticalSwipeGesture();
+        this.widgetDeps.slideApiDeps.enableBackpress();
+    }
+    static api = {
+        widgetClassName: WidgetProductCarousel.widgetClassName,
+        onRefreshUserData: WidgetProductCarousel.onRefreshUserData,
+        init: function (element, localData, widgetCallbacks, widgetDeps) {
+            WidgetProductCarousel.initWidget(element, localData, (el, options) => new WidgetProductCarousel(el, options, widgetCallbacks, widgetDeps));
+        },
+        onStart: function (element) {
+            WidgetProductCarousel.getInstance(element)?.onStart();
+        },
+        onStop: function (element) {
+            WidgetProductCarousel.getInstance(element)?.onStop();
+        },
+        isClickCapturedByWidget: function (element) {
+            const widget = WidgetProductCarousel.getInstance(element);
+            return widget?.getIsClickCapturedByWidget() ?? false;
+        },
+        isForcePaused: function (element) {
+            const widget = WidgetProductCarousel.getInstance(element);
+            return widget?.isForcePaused ?? false;
+        },
+    };
+    static get [Symbol.for("___CTOR_ARGS___")]() { return [`HTMLElement`, `Partial`, `WidgetCallbacks`, `WidgetDeps`]; }
+}
+
 class WidgetQuest extends WidgetBase {
     static DEFAULTS = {
         slide: null,
@@ -24230,48 +24926,130 @@ var ResultDisplayFormat;
     ResultDisplayFormat["Percentage"] = "percentage";
 })(ResultDisplayFormat || (ResultDisplayFormat = {}));
 
-const MIN_DURATION = 2000;
-const MAX_EXTRA_DURATION = 1500;
-const MIN_SCALE = 0.8;
-const SCALE_VARIATION = 0.4;
-const MAX_DRIFT_X = 40; // [-40, 40]
-const MAX_DELAY = 300;
+/**
+ * Tuning for {@link ReactionFloatEffect}: layout, motion, and styling.
+ *
+ * - `minScale` + `scaleVariations` → CSS `--scale` (emoji size). The largest variation is used with `minScale` to size slots in `getSlotWidth`.
+ * - `maxDelay` → upper bound (ms) for random stagger before each spawn in `animate`.
+ * - `yThreshold` → fraction of `container.clientHeight` for `--y-threshold` (vertical float threshold).
+ * - `jitterFactor` → scales horizontal random offset in `getStartX` (jitter is forced to 0 on the first and last column).
+ * - `fastReactionProbability` → chance to pick the fast branch in `getDuration`.
+ * - `fastMinDuration` / `fastExtraDuration` → fast path duration is `fastMinDuration + random * fastExtraDuration` (ms).
+ * - `slowMinDuration` / `slowExtraDuration` → slow path duration (same pattern, ms).
+ * - `reactionClassName` → class on the measurement probe and on each reaction node (metrics + CSS).
+ */
+const config = {
+    minScale: 0.75,
+    scaleVariations: [0, 0.12, 0.25],
+    maxDelay: 400,
+    yThreshold: 0.6,
+    jitterFactor: 0.6,
+    fastReactionProbability: 0.6,
+    fastMinDuration: 910,
+    fastExtraDuration: 325,
+    slowMinDuration: 1560,
+    slowExtraDuration: 520,
+    reactionClassName: "narrative-element-reaction--float-effect-v2",
+};
 class ReactionFloatEffect {
     container;
     emoji;
     count;
+    reactionWidth;
+    slotWidth;
+    slotsCount;
     constructor(options) {
         this.container = options.container;
         this.emoji = options.emoji;
         this.count = options.count ?? 6;
+        this.reactionWidth = this.getReactionWidth();
+        this.slotWidth = this.getSlotWidth();
+        this.slotsCount = this.getSlotsCount(this.slotWidth);
+    }
+    getReactionWidth() {
+        const el = document.createElement("span");
+        el.textContent = this.emoji;
+        el.style.position = "absolute";
+        el.style.visibility = "hidden";
+        el.classList.add(config.reactionClassName);
+        this.container.appendChild(el);
+        const rect = el.getBoundingClientRect();
+        el.remove();
+        return rect.width;
+    }
+    getSlotsCount(slotWidth) {
+        return Math.max(1, Math.floor(this.container.clientWidth / slotWidth));
+    }
+    getSlotWidth() {
+        const scale = config.minScale + Math.max(...config.scaleVariations);
+        return this.reactionWidth * scale;
     }
     animate() {
         for (let i = 0; i < this.count; i++) {
-            const delay = Math.random() * MAX_DELAY;
+            const delay = Math.random() * config.maxDelay;
+            const slotIndex = i % this.slotsCount;
             setTimeout(() => {
-                this.spawnReaction();
+                this.spawnReaction(slotIndex);
             }, delay);
         }
     }
-    spawnReaction() {
-        const el = document.createElement("span");
-        el.className = "narrative-element-reaction--float-effect";
-        el.textContent = this.emoji;
-        const containerWidth = this.container.clientWidth;
-        const thresholdY = this.container.clientHeight / 2;
-        const startX = Math.random() * containerWidth;
-        const driftX = Math.random() * MAX_DRIFT_X * 2 - MAX_DRIFT_X;
-        const duration = MIN_DURATION + Math.random() * MAX_EXTRA_DURATION;
-        const randomScale = MIN_SCALE + Math.random() * SCALE_VARIATION;
-        el.style.left = `${startX}px`;
-        el.style.setProperty("--drift", `${driftX}px`);
-        el.style.setProperty("--y-threshold", `${thresholdY}px`);
-        el.style.setProperty("--duration", `${duration}ms`);
-        el.style.setProperty("--scale", `${randomScale}`);
-        this.container.appendChild(el);
+    spawnReaction(slotIndex) {
+        const reaction = this.createReaction();
+        const options = this.getOptions(slotIndex);
+        this.setStyle(reaction, options);
+        this.container.appendChild(reaction);
+        this.removeReactionWithDelay(reaction, options.duration);
+        return reaction;
+    }
+    createReaction() {
+        const reaction = document.createElement("span");
+        reaction.className = config.reactionClassName;
+        reaction.textContent = this.emoji;
+        return reaction;
+    }
+    getOptions(slotIndex) {
+        const thresholdY = this.getThresholdY();
+        const scale = this.getScale();
+        const startX = this.getStartX(slotIndex);
+        const duration = this.getDuration();
+        return { thresholdY, scale, startX, duration };
+    }
+    getStartX(slotIndex) {
+        const slotsRowCenteringOffset = (this.container.clientWidth - this.slotsCount * this.slotWidth) / 2;
+        const baseX = slotIndex * this.slotWidth + slotsRowCenteringOffset + this.slotWidth / 2;
+        return baseX + this.getJitter(slotIndex);
+    }
+    getJitter(slotIndex) {
+        const jitter = (Math.random() - 0.5) * this.slotWidth * config.jitterFactor;
+        if (slotIndex === 0 && jitter < 0) {
+            return -jitter;
+        }
+        if (slotIndex === this.slotsCount - 1 && jitter > 0) {
+            return -jitter;
+        }
+        return jitter;
+    }
+    getDuration() {
+        const isFast = Math.random() < config.fastReactionProbability;
+        return isFast ? config.fastMinDuration + Math.random() * config.fastExtraDuration : config.slowMinDuration + Math.random() * config.slowExtraDuration;
+    }
+    getThresholdY() {
+        return config.yThreshold * this.container.clientHeight;
+    }
+    getScale() {
+        const scaleVariation = config.scaleVariations[Math.floor(Math.random() * (config.scaleVariations.length - 1))];
+        return config.minScale + scaleVariation;
+    }
+    setStyle(reaction, options) {
+        reaction.style.left = `${options.startX}px`;
+        reaction.style.setProperty("--y-threshold", `${options.thresholdY}px`);
+        reaction.style.setProperty("--duration", `${options.duration}ms`);
+        reaction.style.setProperty("--scale", `${options.scale}`);
+    }
+    removeReactionWithDelay(reaction, delay) {
         setTimeout(() => {
-            el.remove();
-        }, duration);
+            reaction.remove();
+        }, delay);
     }
     static get [Symbol.for("___CTOR_ARGS___")]() { return [`ReactionFloatEffectOptions`]; }
 }
@@ -24338,7 +25116,7 @@ class WidgetReactions extends WidgetBase {
         const geometryParent = this.element.closest(".narrative-slide-elements");
         if (!geometryParent)
             return;
-        new ReactionFloatEffect({ container: geometryParent, emoji, count: 15 /* fontSize: getComputedStyle(this.reactions[0]).fontSize */ }).animate();
+        new ReactionFloatEffect({ container: geometryParent, emoji, count: 20 /* fontSize: getComputedStyle(this.reactions[0]).fontSize */ }).animate();
     }
     initFromLocalData({ selectedIndex, widgetDoneAt, reaction }) {
         try {
@@ -24580,6 +25358,9 @@ class EsModuleLayoutApi {
     get widgetProductsApi() {
         return WidgetProducts.api;
     }
+    get widgetProductCarouselApi() {
+        return WidgetProductCarousel.api;
+    }
     get widgetTooltipApi() {
         return WidgetTooltip.api;
     }