@streamscloud/embeddable 6.3.3 → 6.3.4

package/dist/short-videos/short-video-viewer/cmp.attachments-inline.svelte

@@ -1,76 +1,18 @@
 <script lang="ts">import { Icon, IconColor } from '../../ui/icon';
 import { ImageRounded } from '../../ui/image';
 import IconTargetArrow from '@fluentui/svg-icons/icons/target_arrow_20_regular.svg?raw';
-import { onMount } from 'svelte';
-let { model, on } = $props();
+let { model } = $props();
 const attachmentsToShow = $derived.by(() => {
-    const products = model.products
-        .filter((p) => !!p.image)
-        .map((p) => ({
-        isAd: false,
-        image: p.image,
-        link: p.link,
-        productId: p.id
-    }));
-    const ads = (model.ad ? [model.ad] : [])
-        .filter((a) => !!a.image)
-        .map((a) => {
-        var _a;
-        return ({
-            isAd: true,
-            image: a.image,
-            link: ((_a = a.ctaButton) === null || _a === void 0 ? void 0 : _a.url) || null,
-            productId: null
-        });
-    });
+    const products = model.products.filter((p) => !!p.image).map((p) => ({ isAd: false, image: p.image, link: p.link }));
+    const ads = (model.ad ? [model.ad] : []).filter((a) => !!a.image).map((a) => { var _a; return ({ isAd: true, image: a.image, link: ((_a = a.ctaButton) === null || _a === void 0 ? void 0 : _a.url) || null }); });
     return [...products, ...ads];
 });
-const handleAttachmentClick = (attachment) => {
-    if (attachment.productId && (on === null || on === void 0 ? void 0 : on.productClick)) {
-        on.productClick(attachment.productId);
-    }
-    if (attachment.link) {
-        window.open(attachment.link, '_blank');
-    }
-};
-let attachmentElements = {};
-onMount(() => {
-    if (on === null || on === void 0 ? void 0 : on.productImpression) {
-        // Track product impressions when they come into view
-        const observer = new IntersectionObserver((entries) => {
-            entries.forEach((entry) => {
-                if (entry.isIntersecting && entry.intersectionRatio >= 0.5) {
-                    const productId = entry.target.getAttribute('data-product-id');
-                    if (productId) {
-                        on.productImpression(productId, model.id);
-                        observer.unobserve(entry.target); // Only track once per session
-                    }
-                }
-            });
-        }, { threshold: 0.5 });
-        // Observe all product elements
-        Object.entries(attachmentElements).forEach(([key, element]) => {
-            if (element && key.startsWith('product-')) {
-                observer.observe(element);
-            }
-        });
-        return () => {
-            observer.disconnect();
-        };
-    }
-});
 </script>
 
 <div class="attachments-inline-container">
   <div class="attachments-inline">
-    {#each attachmentsToShow as attachment, index (attachment)}
-      <div
-        class="attachments-inline__item"
-        onclick={() => handleAttachmentClick(attachment)}
-        onkeydown={() => {}}
-        role="none"
-        bind:this={attachmentElements[attachment.productId ? `product-${attachment.productId}` : `ad-${index}`]}
-        data-product-id={attachment.productId || undefined}>
+    {#each attachmentsToShow as attachment (attachment)}
+      <div class="attachments-inline__item" onclick={() => attachment.link && window.open(attachment.link, '_blank')} onkeydown={() => {}} role="none">
         <ImageRounded src={attachment.image} alt="" />
         {#if attachment.isAd}
           <div class="attachments-inline__item-icon">

package/dist/short-videos/short-video-viewer/cmp.attachments-inline.svelte.d.ts

@@ -1,10 +1,6 @@
 import type { ShortVideoViewerModel } from './types';
 type Props = {
     model: ShortVideoViewerModel;
-    on?: {
-        productClick?: (productId: string) => void;
-        productImpression?: (productId: string, videoId: string) => void;
-    };
 };
 declare const Cmp: import("svelte").Component<Props, {}, "">;
 type Cmp = ReturnType<typeof Cmp>;

package/dist/short-videos/short-video-viewer/cmp.attachments.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">import { AdCard } from '../../ads/ad-card';
-import { default as ShortVideoProductCard } from './cmp.short-video-product-card.svelte';
+import { ProductCard } from '../../products/product-card';
 import { ShortVideoAttachmentsLocalization } from './short-video-attachments-localization';
 import {} from './types';
 let { shortVideo, localization: localizationInit = 'en', on } = $props();
@@ -14,14 +14,7 @@ const localization = $derived(new ShortVideoAttachmentsLocalization(localization
 
     {#if shortVideo.products.length}
       {#each shortVideo.products as product (product.id)}
-        <ShortVideoProductCard
-          product={product}
-          videoId={shortVideo.id}
-          localization={localization.productLocalization}
-          on={{
-            productClick: on?.productClick,
-            impression: on?.productImpression
-          }} />
+        <ProductCard product={product} localization={localization.productLocalization} on={on} />
       {/each}
     {/if}
   </div>

package/dist/short-videos/short-video-viewer/cmp.attachments.svelte.d.ts

@@ -6,7 +6,6 @@ type Props = {
     localization?: IShortVideoAttachmentsLocalization | Locale;
     on?: {
         productClick?: (productId: string) => void;
-        productImpression?: (productId: string, videoId: string) => void;
     };
 };
 declare const Cmp: import("svelte").Component<Props, {}, "">;

package/dist/short-videos/short-video-viewer/cmp.short-video-viewer.svelte

@@ -36,12 +36,7 @@ $effect(() => {
 
   <div class="short-video-viewer__actions-panel" class:short-video-viewer__actions-panel--inside-frame={true}>
     {#if uiManager.showAttachments}
-      <AttachmentsInline
-        model={model}
-        on={{
-          productClick: on?.productClick,
-          productImpression: on?.productImpression
-        }} />
+      <AttachmentsInline model={model} />
     {/if}
     {#if uiManager.showControls}
       <ShortVideoControls model={model} socialInteractionsHandler={socialInteractionsHandler} on={{ attachmentsClicked: uiManager.toggleEnableAttachments }} />

package/dist/short-videos/short-video-viewer/cmp.short-video-viewer.svelte.d.ts

@@ -10,8 +10,6 @@ type Props = {
     localization?: IShortVideoViewerLocalization | Locale;
     on?: {
         progress?: (progress: number) => void;
-        productClick?: (productId: string) => void;
-        productImpression?: (productId: string, videoId: string) => void;
     };
 };
 declare const Cmp: import("svelte").Component<Props, {}, "">;

package/dist/short-videos/short-videos-player/cmp.short-videos-player.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">import { MediaCenter, MediaCenterMode } from '../../media-center/media-center';
 import { createShadowRoot } from '../../ui/shadow-dom';
 import { mount, unmount } from 'svelte';
-let { dataProvider, socialInteractionsHandler, localization, showStreamsCloudWatermark, disableBackground, analyticsHandler, on, mediaCenterDataProvider } = $props();
+let { dataProvider, socialInteractionsHandler, localization, showStreamsCloudWatermark, disableBackground, on, mediaCenterDataProvider } = $props();
 const initHost = (node) => {
     const shadowRoot = createShadowRoot(node);
     const mounted = mount(MediaCenter, {
@@ -16,7 +16,6 @@ const initHost = (node) => {
                     disableBackground,
                     localization,
                     showStreamsCloudWatermark,
-                    analyticsHandler,
                     on
                 }
             }

package/dist/short-videos/short-videos-player/index.d.ts

@@ -3,9 +3,9 @@ import type { ShortVideoViewerModel } from '../short-video-viewer';
 import type { IPlayerItemsProvider } from '../../ui/player';
 import { default as ShortVideosPlayer } from './cmp.short-videos-player.svelte';
 import type { IShortVideosPlayerLocalization } from './short-videos-player-localization';
-import { type PlayerSettings, type IShortVideoAnalyticsHandler } from './types';
+import { type PlayerSettings } from './types';
 export { ShortVideosPlayer };
-export type { IShortVideosPlayerLocalization, IMediaCenterDataProvider, IPlayerItemsProvider, IShortVideoAnalyticsHandler };
+export type { IShortVideosPlayerLocalization, IMediaCenterDataProvider, IPlayerItemsProvider };
 /**
  * Opens the short videos player modal.
  *

package/dist/short-videos/short-videos-player/index.js

@@ -3,7 +3,6 @@ import { InternalMediaCenterDataProvider } from '../../media-center/data-provide
 import { MediaCenter, MediaCenterMode } from '../../media-center/media-center';
 import { ModalShadowHost } from '../../ui/shadow-dom';
 import { default as ShortVideosPlayer } from './cmp.short-videos-player.svelte';
-import { InternalShortVideoAnalyticsHandler } from './internal-short-video-analytics-handler';
 import { InternalShortVideoPlayerProvider } from './internal-short-video-player-provider';
 import {} from './types';
 import { mount, unmount } from 'svelte';
@@ -22,10 +21,6 @@ export function openShortVideosPlayer(init) {
     if (!mediaCenterDataProvider && init.mediaPageId) {
         mediaCenterDataProvider = new InternalMediaCenterDataProvider(init.mediaPageId, graphqlOrigin);
     }
-    let analyticsHandler = init.analyticsHandler;
-    if (!analyticsHandler && !init.shortVideosProvider && initiator) {
-        analyticsHandler = new InternalShortVideoAnalyticsHandler(graphqlOrigin);
-    }
     const shadowHost = new ModalShadowHost();
     const mounted = mount(MediaCenter, {
         target: shadowHost.shadowRoot,
@@ -39,7 +34,6 @@ export function openShortVideosPlayer(init) {
                     disableBackground,
                     localization,
                     showStreamsCloudWatermark,
-                    analyticsHandler,
                     on: {
                         playerClosed: async () => {
                             await unmount(mounted);

package/dist/short-videos/short-videos-player/internal-short-video-player-provider.d.ts

@@ -3,6 +3,7 @@ import type { IPlayerItemsProvider } from '../../ui/player';
 export declare class InternalShortVideoPlayerProvider implements IPlayerItemsProvider<ShortVideoViewerModel> {
     initialData: IPlayerItemsProvider<ShortVideoViewerModel>['initialData'];
     private ids;
+    private idOrder;
     private initialId?;
     private graphql;
     private dataLoader;

package/dist/short-videos/short-videos-player/internal-short-video-player-provider.js

@@ -4,21 +4,25 @@ import { CursorDataLoader } from '../../core/data-loaders';
 import { createLocalGQLClient } from '../../core/graphql';
 import { mapToShortVideoViewerModel } from '../short-video-viewer';
 import { GetShortVideosDocument } from './operations.generated';
+const CHUNK_SIZE = 20;
 export class InternalShortVideoPlayerProvider {
     initialData;
     ids;
+    idOrder = new Map();
     initialId;
     graphql;
     dataLoader = new CursorDataLoader({
         loadPage: async (continuationToken) => {
+            const startIdIndex = continuationToken.value ? parseInt(continuationToken.value, 10) : 0;
+            const endIdIndex = Math.min(startIdIndex + CHUNK_SIZE, this.ids.length);
+            const idsChunk = this.ids.slice(startIdIndex, endIdIndex);
             try {
                 const payload = await this.graphql
                     .query(GetShortVideosDocument, {
                     input: {
-                        limit: 20,
-                        continuationToken,
+                        limit: idsChunk.length,
                         filter: {
-                            ids: this.ids
+                            ids: idsChunk
                         }
                     },
                     image_scale: ImageScale.OriginalEncoded
@@ -28,9 +32,14 @@ export class InternalShortVideoPlayerProvider {
                 if (!data) {
                     return null;
                 }
+                const items = data.items.map(mapToShortVideoViewerModel).sort((a, b) => {
+                    const ia = this.idOrder.get(a.id) ?? Number.MAX_SAFE_INTEGER;
+                    const ib = this.idOrder.get(b.id) ?? Number.MAX_SAFE_INTEGER;
+                    return ia - ib;
+                });
                 return {
-                    items: data.items.map(mapToShortVideoViewerModel),
-                    continuationToken: ContinuationToken.fromPayload(data.continuationToken)
+                    items,
+                    continuationToken: ContinuationToken.fromPayload(endIdIndex < this.ids.length ? endIdIndex.toString() : null)
                 };
             }
             catch {
@@ -42,6 +51,7 @@ export class InternalShortVideoPlayerProvider {
         const { ids, graphqlOrigin, initiator, initialId } = input;
         this.graphql = createLocalGQLClient(graphqlOrigin, initiator ? { 'x-initiator': initiator } : undefined);
         this.ids = ids;
+        ids.forEach((id, idx) => this.idOrder.set(id, idx));
         this.initialId = initialId;
         this.initialData = { prefetchedItems: [], startIndex: 0 };
     }

package/dist/short-videos/short-videos-player/short-videos-player-view.svelte

@@ -19,7 +19,7 @@ import { InternalShortVideoPlayerProvider } from './internal-short-video-player-
 import { ShortVideosPlayerLocalization } from './short-videos-player-localization';
 import { ShortVideosPlayerUiManager } from './ui-manager.svelte';
 import { untrack } from 'svelte';
-let { dataProvider, socialInteractionsHandler, localization: localizationInit = 'en', showStreamsCloudWatermark, disableBackground, analyticsHandler, on, categoriesSwitcher, playerLogo = null, fadeContent = false } = $props();
+let { dataProvider, socialInteractionsHandler, localization: localizationInit = 'en', showStreamsCloudWatermark, disableBackground, on, categoriesSwitcher, playerLogo = null, fadeContent = false } = $props();
 const localization = $derived(new ShortVideosPlayerLocalization(localizationInit));
 let everTouched = $state(false);
 let background = $state(null);
@@ -56,7 +56,6 @@ const onItemActivated = (id) => {
         return;
     }
     background = resolveVideoCover(shortVideo);
-    analyticsHandler === null || analyticsHandler === void 0 ? void 0 : analyticsHandler.trackShortVideoView(id);
     (_a = on === null || on === void 0 ? void 0 : on.videoActivated) === null || _a === void 0 ? void 0 : _a.call(on, id);
 };
 const resolveVideoCover = (shortVideo) => {
@@ -88,12 +87,6 @@ const onPlayerClose = () => {
     var _a;
     (_a = on === null || on === void 0 ? void 0 : on.playerClosed) === null || _a === void 0 ? void 0 : _a.call(on);
 };
-const onShortVideoProductClick = (productId, videoId) => {
-    analyticsHandler === null || analyticsHandler === void 0 ? void 0 : analyticsHandler.trackShortVideoProductClicked(productId, videoId);
-};
-const onShortVideoProductImpression = (productId, videoId) => {
-    analyticsHandler === null || analyticsHandler === void 0 ? void 0 : analyticsHandler.trackShortVideoProductImpression(productId, videoId);
-};
 </script>
 
 <svelte:document onkeydown={(e) => handleEsc(e, onPlayerClose)} />
@@ -134,11 +127,7 @@ const onShortVideoProductImpression = (productId, videoId) => {
                 autoplay="on-appearance"
                 showAttachments={uiManager.showShortVideoOverlay}
                 showControls={uiManager.showShortVideoOverlay}
-                localization={localization.shortVideoViewerLocalization}
-                on={{
-                  productClick: (productId: string) => onShortVideoProductClick(productId, item.id),
-                  productImpression: (productId: string, videoId: string) => onShortVideoProductImpression(productId, videoId)
-                }} />
+                localization={localization.shortVideoViewerLocalization} />
             {/snippet}
           </PlayerSlider>
           {#if uiManager.isMobileView && buffer.loaded.length > 1 && !everTouched}

package/dist/short-videos/short-videos-player/types.d.ts

@@ -2,22 +2,14 @@ import type { Locale } from '../../core/locale';
 import type { ShortVideoViewerModel, IPostSocialInteractionsHandler } from '../short-video-viewer';
 import type { IPlayerItemsProvider } from '../../ui/player';
 import type { IShortVideosPlayerLocalization } from './short-videos-player-localization';
-export interface IShortVideoAnalyticsHandler {
-    setOrganizationId: (organizationId: string) => void;
-    trackShortVideoView: (videoId: string) => void;
-    trackShortVideoProductImpression: (productId: string, videoId: string) => void;
-    trackShortVideoProductClicked: (productId: string, videoId: string) => void;
-}
 export type ShortVideoPlayerProps = PlayerSettings & {
     dataProvider: IPlayerItemsProvider<ShortVideoViewerModel>;
-    analyticsHandler?: IShortVideoAnalyticsHandler;
 };
 export type PlayerSettings = {
     socialInteractionsHandler?: IPostSocialInteractionsHandler;
     disableBackground?: boolean;
     localization?: IShortVideosPlayerLocalization | Locale;
     showStreamsCloudWatermark?: boolean;
-    analyticsHandler?: IShortVideoAnalyticsHandler;
     on?: {
         playerClosed?: () => void;
         videoActivated?: (id: string) => void;

package/dist/streams/layout/cmp.slot-content.svelte

@@ -1,7 +1,6 @@
 <script lang="ts">import { Utils } from '../../core/utils';
 import { StreamElementView } from './element-views';
 import { StreamComponentDataType } from './enums';
-import { onMount } from 'svelte';
 let { model, localization, on } = $props();
 const component = $derived.by(() => {
     return model.components.find((c) => (model.data ? c.dataType === model.data.type : c.dataType === StreamComponentDataType.NoData));
@@ -40,23 +39,6 @@ const handleProductClick = (e) => {
         window.open(productModel.link, '_blank', 'noopener noreferrer');
     }
 };
-let productElement = $state();
-onMount(() => {
-    if (productElement && (productModel === null || productModel === void 0 ? void 0 : productModel.id) && (on === null || on === void 0 ? void 0 : on.productImpression)) {
-        const observer = new IntersectionObserver((entries) => {
-            entries.forEach((entry) => {
-                if (entry.isIntersecting && entry.intersectionRatio >= 0.5) {
-                    on.productImpression(productModel.id);
-                    observer.unobserve(entry.target);
-                }
-            });
-        }, { threshold: 0.5 });
-        observer.observe(productElement);
-        return () => {
-            observer.disconnect();
-        };
-    }
-});
 </script>
 
 {#snippet slotContent()}
@@ -67,19 +49,11 @@ onMount(() => {
   {/if}
 {/snippet}
 {#if productModel?.link}
-  <a
-    class="stream-slot-content-product-link"
-    href={productModel.link}
-    onclick={handleProductClick}
-    target="_blank"
-    rel="noopener noreferrer"
-    bind:this={productElement}>
+  <a class="stream-slot-content-product-link" href={productModel.link} onclick={handleProductClick} target="_blank" rel="noopener noreferrer">
     {@render slotContent()}
   </a>
 {:else}
-  <div bind:this={productElement}>
-    {@render slotContent()}
-  </div>
+  {@render slotContent()}
 {/if}
 
 <style>@keyframes fadeIn {

package/dist/streams/layout/cmp.slot-content.svelte.d.ts

@@ -6,7 +6,6 @@ type Props = {
     localization: IStreamElementLocalization | Locale;
     on?: {
         productClick: (productId: string) => void;
-        productImpression?: (productId: string) => void;
         progress?: (videoId: string, progress: number) => void;
     };
 };

package/dist/streams/stream-page-viewer/cmp.stream-page-viewer.svelte.d.ts

@@ -6,7 +6,6 @@ type Props = {
     localization: IStreamPageViewerLocalization | Locale;
     on?: {
         productClick: (productId: string) => void;
-        productImpression?: (productId: string) => void;
         progress?: (videoId: string, progress: number) => void;
     };
 };

package/dist/streams/stream-player/controls.svelte

@@ -82,8 +82,7 @@ const changeShowShortVideoAttachments = () => {
             shortVideo={shortVideo}
             localization={localization.shortVideoAttachmentsLocalization}
             on={{
-              productClick: on.productClick,
-              productImpression: on.productImpression
+              productClick: on.productClick
             }} />
         </div>
       {/if}

package/dist/streams/stream-player/controls.svelte.d.ts

@@ -10,7 +10,6 @@ type Props = {
     on: {
         closePlayer: () => void;
         productClick?: (productId: string) => void;
-        productImpression?: (productId: string) => void;
     };
 };
 declare const Controls: import("svelte").Component<Props, {}, "">;

package/dist/streams/stream-player/internal-stream-analytics-handler.d.ts

@@ -4,13 +4,9 @@ export declare class InternalStreamAnalyticsHandler implements IStreamAnalyticsH
     setOrganizationId: (organizationId: string) => void;
     trackStreamView: (streamId: string) => void;
     trackStreamPageView: (pageId: string, streamId: string) => void;
+    trackStreamProductClicked: (productId: string, streamId: string) => void;
     trackStreamEngagementTime: (streamId: string, engagementTime: number) => void;
     trackStreamScrollDepth: (streamId: string, scrollDepth: number) => void;
-    trackStreamProductImpression: (productId: string, streamId: string) => void;
-    trackStreamProductClicked: (productId: string, streamId: string) => void;
     reportPageVideoViews: (videoId: string, streamId: string) => void;
-    trackShortVideoView: (videoId: string) => void;
-    trackShortVideoProductImpression: (productId: string, videoId: string) => void;
-    trackShortVideoProductClicked: (productId: string, videoId: string) => void;
     trackShortVideoProgress: (pageId: string, videoId: string, progress: number, streamId: string) => void;
 }

package/dist/streams/stream-player/internal-stream-analytics-handler.js

@@ -9,13 +9,9 @@ export class InternalStreamAnalyticsHandler {
     setOrganizationId = (organizationId) => AppEventsTracker.setOrganizationId(organizationId);
     trackStreamView = (streamId) => AppEventsTracker.trackStreamView(streamId);
     trackStreamPageView = (pageId, streamId) => AppEventsTracker.trackStreamPageView(pageId, streamId);
+    trackStreamProductClicked = (productId, streamId) => AppEventsTracker.trackStreamProductClicked(productId, streamId);
     trackStreamEngagementTime = (streamId, engagementTime) => AppEventsTracker.trackStreamEngagementTime(streamId, engagementTime);
     trackStreamScrollDepth = (streamId, scrollDepth) => AppEventsTracker.trackStreamScrollDepth(streamId, scrollDepth);
-    trackStreamProductImpression = (productId, streamId) => AppEventsTracker.trackStreamProductImpression(productId, streamId);
-    trackStreamProductClicked = (productId, streamId) => AppEventsTracker.trackStreamProductClicked(productId, streamId);
     reportPageVideoViews = (videoId, streamId) => AppEventsTracker.reportPageVideoViews(videoId, streamId);
-    trackShortVideoView = (videoId) => AppEventsTracker.trackShortVideoView(videoId);
-    trackShortVideoProductImpression = (productId, videoId) => AppEventsTracker.trackShortVideoProductImpression(productId, videoId);
-    trackShortVideoProductClicked = (productId, videoId) => AppEventsTracker.trackShortVideoProductClick(productId, videoId);
     trackShortVideoProgress = (pageId, videoId, progress, streamId) => AppEventsTracker.trackShortVideoProgress(pageId, videoId, progress, streamId);
 }

package/dist/streams/stream-player/stream-player.svelte

@@ -134,9 +134,6 @@ const onPageActivated = (id) => {
     background = (page === null || page === void 0 ? void 0 : page.cover) || null;
     if (page) {
         analyticsHandler === null || analyticsHandler === void 0 ? void 0 : analyticsHandler.trackStreamPageView(id, streamId);
-        if (page.type === 'short-video' && page.shortVideo) {
-            analyticsHandler === null || analyticsHandler === void 0 ? void 0 : analyticsHandler.trackShortVideoView(page.shortVideo.id);
-        }
         const currentIndex = buffer === null || buffer === void 0 ? void 0 : buffer.loaded.findIndex((p) => p.id === id);
         if (currentIndex !== undefined && currentIndex > maxPageIndexViewed) {
             maxPageIndexViewed = currentIndex;
@@ -146,15 +143,6 @@ const onPageActivated = (id) => {
 const onProductCardClick = (productId) => {
     analyticsHandler === null || analyticsHandler === void 0 ? void 0 : analyticsHandler.trackStreamProductClicked(productId, streamId);
 };
-const onShortVideoProductClick = (productId, videoId) => {
-    analyticsHandler === null || analyticsHandler === void 0 ? void 0 : analyticsHandler.trackShortVideoProductClicked(productId, videoId);
-};
-const onStreamProductImpression = (productId) => {
-    analyticsHandler === null || analyticsHandler === void 0 ? void 0 : analyticsHandler.trackStreamProductImpression(productId, streamId);
-};
-const onShortVideoProductImpression = (productId, videoId) => {
-    analyticsHandler === null || analyticsHandler === void 0 ? void 0 : analyticsHandler.trackShortVideoProductImpression(productId, videoId);
-};
 const onPlayerClose = () => {
     var _a;
     stopActivityTracking();
@@ -203,16 +191,13 @@ const onProgress = (pageId, videoId, progress) => {
                   localization={localization.streamPageViewerLocalization}
                   on={{
                     progress: (videoId: String, progress: Number) => onProgress(item.id, videoId, progress),
-                    productClick: (productId: String) => onProductCardClick(productId),
-                    productImpression: (productId: String) => onStreamProductImpression(productId)
+                    productClick: (productId: String) => onProductCardClick(productId)
                   }} />
               {:else if item.type === 'short-video'}
                 <ShortVideoViewer
                   model={mapToShortVideoViewerModel(item.shortVideo)}
                   on={{
-                    progress: (progress) => onProgress(item.id, item.shortVideo.id, progress),
-                    productClick: (productId: string) => onShortVideoProductClick(productId, item.shortVideo.id),
-                    productImpression: (productId: string, videoId: string) => onShortVideoProductImpression(productId, videoId)
+                    progress: (progress) => onProgress(item.id, item.shortVideo.id, progress)
                   }}
                   autoplay="on-appearance"
                   socialInteractionsHandler={postSocialInteractionsHandler}
@@ -246,8 +231,7 @@ const onProgress = (pageId, videoId, progress) => {
         postSocialInteractionsHandler={postSocialInteractionsHandler}
         on={{
           closePlayer: () => onPlayerClose(),
-          productClick: (productId: String) => onProductCardClick(productId),
-          productImpression: (productId: String) => onStreamProductImpression(productId)
+          productClick: (productId: String) => onProductCardClick(productId)
         }} />
     {/if}
   </div>

package/dist/streams/stream-player/types.d.ts

@@ -44,13 +44,9 @@ export interface IStreamAnalyticsHandler {
     setOrganizationId: (organizationId: string) => void;
     trackStreamView: (streamId: string) => void;
     trackStreamPageView: (pageId: string, streamId: string) => void;
-    trackStreamProductImpression: (productId: string, streamId: string) => void;
     trackStreamProductClicked: (productId: string, streamId: string) => void;
     trackStreamEngagementTime: (streamId: string, engagementTime: number) => void;
     trackStreamScrollDepth: (streamId: string, scrollDepth: number) => void;
     reportPageVideoViews: (videoId: string, streamId: string) => void;
-    trackShortVideoView: (videoId: string) => void;
-    trackShortVideoProductImpression: (productId: string, videoId: string) => void;
-    trackShortVideoProductClicked: (productId: string, videoId: string) => void;
     trackShortVideoProgress: (pageId: string, videoId: string, progress: number, streamId: string) => void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamscloud/embeddable",
-  "version": "6.3.3",
+  "version": "6.3.4",
   "author": "StreamsCloud",
   "repository": {
     "type": "git",
@@ -108,7 +108,7 @@
   },
   "peerDependencies": {
     "@fluentui/svg-icons": "^1.1.292",
-    "@streamscloud/streams-analytics-collector": "^2.0.9",
+    "@streamscloud/streams-analytics-collector": "^2.0.1",
     "@urql/core": "^5.1.1",
     "dompurify": "^3.2.6",
     "mobile-detect": "^1.4.5",

package/dist/short-videos/short-video-viewer/cmp.short-video-product-card.svelte

@@ -1,26 +0,0 @@
-<script lang="ts">import { ProductCard } from '../../products/product-card';
-import { onMount } from 'svelte';
-let { product, videoId, localization, includeBeforeNowPrefix, inert = false, on } = $props();
-let productElement;
-const productData = product;
-onMount(() => {
-    if (productElement && (on === null || on === void 0 ? void 0 : on.impression)) {
-        const observer = new IntersectionObserver((entries) => {
-            entries.forEach((entry) => {
-                if (entry.isIntersecting && entry.intersectionRatio >= 0.5) {
-                    on.impression(product.id, videoId);
-                    observer.unobserve(entry.target);
-                }
-            });
-        }, { threshold: 0.5 });
-        observer.observe(productElement);
-        return () => {
-            observer.disconnect();
-        };
-    }
-});
-</script>
-
-<div bind:this={productElement}>
-  <ProductCard product={productData} localization={localization} includeBeforeNowPrefix={includeBeforeNowPrefix} inert={inert} on={on} />
-</div>

package/dist/short-videos/short-video-viewer/cmp.short-video-product-card.svelte.d.ts

@@ -1,17 +0,0 @@
-import type { Locale } from '../../core/locale';
-import type { IProductCardLocalization } from '../../products/product-card/product-card-localization';
-import type { ShortVideoProductCardModel } from './types';
-type Props = {
-    product: ShortVideoProductCardModel;
-    videoId: string;
-    localization?: IProductCardLocalization | Locale;
-    includeBeforeNowPrefix?: boolean;
-    inert?: boolean;
-    on?: {
-        productClick?: (id: string) => void;
-        impression?: (productId: string, videoId: string) => void;
-    };
-};
-declare const Cmp: import("svelte").Component<Props, {}, "">;
-type Cmp = ReturnType<typeof Cmp>;
-export default Cmp;

package/dist/short-videos/short-videos-player/internal-short-video-analytics-handler.d.ts

@@ -1,8 +0,0 @@
-import type { IShortVideoAnalyticsHandler } from './types';
-export declare class InternalShortVideoAnalyticsHandler implements IShortVideoAnalyticsHandler {
-    constructor(graphqlOrigin: string | undefined);
-    setOrganizationId: (organizationId: string) => void;
-    trackShortVideoView: (videoId: string) => void;
-    trackShortVideoProductImpression: (productId: string, videoId: string) => void;
-    trackShortVideoProductClicked: (productId: string, videoId: string) => void;
-}

package/dist/short-videos/short-videos-player/internal-short-video-analytics-handler.js

@@ -1,13 +0,0 @@
-import { getOrCreateProfileId } from '../../core/analytics.profile-id';
-import { constructGraphQLUrl } from '../../core/graphql';
-import { AppEventsTracker } from '@streamscloud/streams-analytics-collector';
-export class InternalShortVideoAnalyticsHandler {
-    constructor(graphqlOrigin) {
-        AppEventsTracker.setEndpoint(constructGraphQLUrl(graphqlOrigin));
-        AppEventsTracker.setProfileId(getOrCreateProfileId());
-    }
-    setOrganizationId = (organizationId) => AppEventsTracker.setOrganizationId(organizationId);
-    trackShortVideoView = (videoId) => AppEventsTracker.trackShortVideoView(videoId);
-    trackShortVideoProductImpression = (productId, videoId) => AppEventsTracker.trackShortVideoProductImpression(productId, videoId);
-    trackShortVideoProductClicked = (productId, videoId) => AppEventsTracker.trackShortVideoProductClick(productId, videoId);
-}

package/dist/streams/cmp.stream-product-card.svelte

@@ -1,25 +0,0 @@
-<script lang="ts">import { ProductCard } from '../products/product-card';
-import { onMount } from 'svelte';
-let { product, streamId, localization, includeBeforeNowPrefix, inert = false, on } = $props();
-let productElement;
-onMount(() => {
-    if (productElement && (on === null || on === void 0 ? void 0 : on.impression)) {
-        const observer = new IntersectionObserver((entries) => {
-            entries.forEach((entry) => {
-                if (entry.isIntersecting && entry.intersectionRatio >= 0.5) {
-                    on.impression(product.id, streamId);
-                    observer.unobserve(entry.target);
-                }
-            });
-        }, { threshold: 0.5 });
-        observer.observe(productElement);
-        return () => {
-            observer.disconnect();
-        };
-    }
-});
-</script>
-
-<div bind:this={productElement}>
-  <ProductCard product={product} localization={localization} includeBeforeNowPrefix={includeBeforeNowPrefix} inert={inert} on={on} />
-</div>

package/dist/streams/cmp.stream-product-card.svelte.d.ts

@@ -1,17 +0,0 @@
-import type { Locale } from '../core/locale';
-import type { IProductCardLocalization } from '../products/product-card/product-card-localization';
-import type { ProductCardModel } from '../products/product-card/types';
-type Props = {
-    product: ProductCardModel;
-    streamId: string;
-    localization?: IProductCardLocalization | Locale;
-    includeBeforeNowPrefix?: boolean;
-    inert?: boolean;
-    on?: {
-        productClick?: (id: string) => void;
-        impression?: (productId: string, streamId: string) => void;
-    };
-};
-declare const Cmp: import("svelte").Component<Props, {}, "">;
-type Cmp = ReturnType<typeof Cmp>;
-export default Cmp;