@streamscloud/embeddable 8.2.0 → 9.0.0

package/dist/products/product-card/mapper.js

@@ -1,12 +1,12 @@
 import { getMediaItemImageUrl } from '../../core/media';
 import { shouldUseSalePrice } from '../price-helper';
-export const mapToProductCard = (payload, referenceDate) => {
+export const mapToProductCard = (payload, options) => {
     const effectiveSalePrice = payload.priceAndAvailability.productSalePrices?.find((x) => shouldUseSalePrice({
         price: payload.priceAndAvailability.price,
         salePrice: x.salePrice,
         effectiveDateFrom: x.salePriceEffectiveDateFrom,
         effectiveDateTo: x.salePriceEffectiveDateTo,
-        referenceDate
+        referenceDate: options?.referenceDate
     }));
     return {
         id: payload.id,

package/dist/short-videos/data-providers/index.d.ts

@@ -0,0 +1 @@
+export { InternalShortVideoPlayerItemsProvider } from './internal-short-video-player-items-provider';

package/dist/short-videos/data-providers/index.js

@@ -0,0 +1 @@
+export { InternalShortVideoPlayerItemsProvider } from './internal-short-video-player-items-provider';

package/dist/short-videos/{short-videos-player/internal-short-video-player-provider.d.ts → data-providers/internal-short-video-player-items-provider.d.ts}

@@ -1,7 +1,7 @@
+import { type PostPlayerModel } from '../../posts/posts-player';
 import type { IPlayerItemsProvider } from '../../ui/player-slider';
-import type { ShortVideoPlayerModel } from './types';
-export declare class InternalShortVideoPlayerProvider implements IPlayerItemsProvider<ShortVideoPlayerModel> {
-    initialData: IPlayerItemsProvider<ShortVideoPlayerModel>['initialData'];
+export declare class InternalShortVideoPlayerItemsProvider implements IPlayerItemsProvider<PostPlayerModel> {
+    initialData: IPlayerItemsProvider<PostPlayerModel>['initialData'];
     private ids;
     private idOrder;
     private initialId?;
@@ -13,6 +13,6 @@ export declare class InternalShortVideoPlayerProvider implements IPlayerItemsPro
         graphqlOrigin?: string;
         initialId?: string;
     });
-    loadMore: () => Promise<ShortVideoPlayerModel[]>;
+    loadMore: () => Promise<PostPlayerModel[]>;
     prefetch: () => Promise<void>;
 }

package/dist/short-videos/{short-videos-player/internal-short-video-player-provider.js → data-providers/internal-short-video-player-items-provider.js}

@@ -2,10 +2,10 @@ import { ImageScale } from '../..';
 import { ContinuationToken } from '../../core/continuation-token';
 import { CursorDataLoader } from '../../core/data-loaders';
 import { createLocalGQLClient } from '../../core/graphql';
-import { mapToShortVideoPlayerModel } from './mapper';
+import { mapToPostPlayerModel } from '../../posts/posts-player';
 import { GetShortVideosDocument } from './operations.generated';
 const CHUNK_SIZE = 20;
-export class InternalShortVideoPlayerProvider {
+export class InternalShortVideoPlayerItemsProvider {
     initialData;
     ids;
     idOrder = new Map();
@@ -32,7 +32,7 @@ export class InternalShortVideoPlayerProvider {
                 if (!data) {
                     return null;
                 }
-                const items = data.items.map(mapToShortVideoPlayerModel).sort((a, b) => {
+                const items = data.items.map(mapToPostPlayerModel).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;

package/dist/short-videos/{short-videos-player → data-providers}/operations.generated.d.ts

@@ -86,82 +86,4 @@ export type GetShortVideosQuery = {
         }>;
     };
 };
-export type ShortVideosPlayerPayloadFragment = {
-    id: string;
-    enableSocialInteractions: boolean;
-    ownerProfile: {
-        id: string;
-        type: SchemaTypes.ProfileType;
-    };
-    allProducts: Array<{
-        id: string;
-        title: string;
-        shortDescription: string | null;
-        link: string | null;
-        media: Array<{
-            url: string;
-            thumbnailUrl: string | null;
-            type: SchemaTypes.MediaType;
-        }>;
-        brand: {
-            name: string;
-        } | null;
-        priceAndAvailability: {
-            currency: SchemaTypes.Currency;
-            price: number;
-            productSalePrices: Array<{
-                salePrice: number;
-                salePriceEffectiveDateFrom: any | null;
-                salePriceEffectiveDateTo: any | null;
-            }> | null;
-        };
-    }>;
-    ad: {
-        id: string;
-        title: string;
-        description: string | null;
-        price: number | null;
-        priceInfo: string | null;
-        currency: SchemaTypes.Currency | null;
-        type: SchemaTypes.AdType;
-        ctaButton: {
-            background: string;
-            textColor: string;
-            text: string;
-            url: string;
-            border: string;
-        } | null;
-        media: Array<{
-            url: string;
-            thumbnailUrl: string | null;
-            type: SchemaTypes.MediaType;
-        }>;
-    } | null;
-    postData: {
-        media: Array<{
-            url: string;
-            thumbnailUrl: string | null;
-            type: SchemaTypes.MediaType;
-        }>;
-        articleData: {
-            title: string;
-            kicker: string | null;
-            articleId: string;
-        } | null;
-        mediaData: {
-            text: string | null;
-        } | null;
-        momentData: {
-            text: string | null;
-        } | null;
-        shortVideoData: {
-            text: string | null;
-        } | null;
-        videoData: {
-            title: string | null;
-            text: string | null;
-        } | null;
-    };
-};
-export declare const ShortVideosPlayerPayloadFragmentDoc: DocumentNode<ShortVideosPlayerPayloadFragment, unknown>;
 export declare const GetShortVideosDocument: DocumentNode<GetShortVideosQuery, GetShortVideosQueryVariables>;

package/dist/short-videos/{short-videos-player → data-providers}/operations.generated.js

@@ -1,232 +1,3 @@
-export const ShortVideosPlayerPayloadFragmentDoc = {
-    kind: 'Document',
-    definitions: [
-        {
-            kind: 'FragmentDefinition',
-            name: { kind: 'Name', value: 'ShortVideosPlayerPayloadFragment' },
-            typeCondition: { kind: 'NamedType', name: { kind: 'Name', value: 'Post' } },
-            selectionSet: {
-                kind: 'SelectionSet',
-                selections: [
-                    { kind: 'FragmentSpread', name: { kind: 'Name', value: 'PostViewerPayloadFragment' } },
-                    {
-                        kind: 'Field',
-                        name: { kind: 'Name', value: 'ownerProfile' },
-                        selectionSet: {
-                            kind: 'SelectionSet',
-                            selections: [
-                                { kind: 'Field', name: { kind: 'Name', value: 'id' } },
-                                { kind: 'Field', name: { kind: 'Name', value: 'type' } }
-                            ]
-                        }
-                    }
-                ]
-            }
-        },
-        {
-            kind: 'FragmentDefinition',
-            name: { kind: 'Name', value: 'PostViewerPayloadFragment' },
-            typeCondition: { kind: 'NamedType', name: { kind: 'Name', value: 'Post' } },
-            selectionSet: {
-                kind: 'SelectionSet',
-                selections: [
-                    { kind: 'Field', name: { kind: 'Name', value: 'id' } },
-                    { kind: 'Field', name: { kind: 'Name', value: 'enableSocialInteractions' } },
-                    {
-                        kind: 'Field',
-                        name: { kind: 'Name', value: 'allProducts' },
-                        selectionSet: {
-                            kind: 'SelectionSet',
-                            selections: [
-                                { kind: 'Field', name: { kind: 'Name', value: 'id' } },
-                                { kind: 'Field', name: { kind: 'Name', value: 'title' } },
-                                { kind: 'Field', name: { kind: 'Name', value: 'shortDescription' } },
-                                { kind: 'Field', name: { kind: 'Name', value: 'link' } },
-                                {
-                                    kind: 'Field',
-                                    name: { kind: 'Name', value: 'media' },
-                                    selectionSet: {
-                                        kind: 'SelectionSet',
-                                        selections: [
-                                            {
-                                                kind: 'Field',
-                                                name: { kind: 'Name', value: 'url' },
-                                                arguments: [{ kind: 'Argument', name: { kind: 'Name', value: 'scale' }, value: { kind: 'EnumValue', value: 'SMALL' } }]
-                                            },
-                                            {
-                                                kind: 'Field',
-                                                name: { kind: 'Name', value: 'thumbnailUrl' },
-                                                arguments: [{ kind: 'Argument', name: { kind: 'Name', value: 'scale' }, value: { kind: 'EnumValue', value: 'SMALL' } }]
-                                            },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'type' } }
-                                        ]
-                                    }
-                                },
-                                {
-                                    kind: 'Field',
-                                    name: { kind: 'Name', value: 'brand' },
-                                    selectionSet: { kind: 'SelectionSet', selections: [{ kind: 'Field', name: { kind: 'Name', value: 'name' } }] }
-                                },
-                                {
-                                    kind: 'Field',
-                                    name: { kind: 'Name', value: 'priceAndAvailability' },
-                                    selectionSet: {
-                                        kind: 'SelectionSet',
-                                        selections: [
-                                            { kind: 'Field', name: { kind: 'Name', value: 'currency' } },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'price' } },
-                                            {
-                                                kind: 'Field',
-                                                name: { kind: 'Name', value: 'productSalePrices' },
-                                                selectionSet: {
-                                                    kind: 'SelectionSet',
-                                                    selections: [
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'salePrice' } },
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'salePriceEffectiveDateFrom' } },
-                                                        { kind: 'Field', name: { kind: 'Name', value: 'salePriceEffectiveDateTo' } }
-                                                    ]
-                                                }
-                                            }
-                                        ]
-                                    }
-                                }
-                            ]
-                        }
-                    },
-                    {
-                        kind: 'Field',
-                        name: { kind: 'Name', value: 'ad' },
-                        selectionSet: {
-                            kind: 'SelectionSet',
-                            selections: [
-                                { kind: 'Field', name: { kind: 'Name', value: 'id' } },
-                                { kind: 'Field', name: { kind: 'Name', value: 'title' } },
-                                { kind: 'Field', name: { kind: 'Name', value: 'description' } },
-                                { kind: 'Field', name: { kind: 'Name', value: 'price' } },
-                                { kind: 'Field', name: { kind: 'Name', value: 'priceInfo' } },
-                                { kind: 'Field', name: { kind: 'Name', value: 'currency' } },
-                                {
-                                    kind: 'Field',
-                                    name: { kind: 'Name', value: 'ctaButton' },
-                                    selectionSet: {
-                                        kind: 'SelectionSet',
-                                        selections: [
-                                            { kind: 'Field', name: { kind: 'Name', value: 'background' } },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'textColor' } },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'text' } },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'url' } },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'border' } }
-                                        ]
-                                    }
-                                },
-                                { kind: 'Field', name: { kind: 'Name', value: 'type' } },
-                                {
-                                    kind: 'Field',
-                                    name: { kind: 'Name', value: 'media' },
-                                    selectionSet: {
-                                        kind: 'SelectionSet',
-                                        selections: [
-                                            {
-                                                kind: 'Field',
-                                                name: { kind: 'Name', value: 'url' },
-                                                arguments: [{ kind: 'Argument', name: { kind: 'Name', value: 'scale' }, value: { kind: 'EnumValue', value: 'SMALL' } }]
-                                            },
-                                            {
-                                                kind: 'Field',
-                                                name: { kind: 'Name', value: 'thumbnailUrl' },
-                                                arguments: [{ kind: 'Argument', name: { kind: 'Name', value: 'scale' }, value: { kind: 'EnumValue', value: 'SMALL' } }]
-                                            },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'type' } }
-                                        ]
-                                    }
-                                }
-                            ]
-                        }
-                    },
-                    {
-                        kind: 'Field',
-                        name: { kind: 'Name', value: 'postData' },
-                        selectionSet: {
-                            kind: 'SelectionSet',
-                            selections: [
-                                {
-                                    kind: 'Field',
-                                    name: { kind: 'Name', value: 'media' },
-                                    selectionSet: {
-                                        kind: 'SelectionSet',
-                                        selections: [
-                                            {
-                                                kind: 'Field',
-                                                name: { kind: 'Name', value: 'url' },
-                                                arguments: [
-                                                    {
-                                                        kind: 'Argument',
-                                                        name: { kind: 'Name', value: 'scale' },
-                                                        value: { kind: 'Variable', name: { kind: 'Name', value: 'image_scale' } }
-                                                    }
-                                                ]
-                                            },
-                                            {
-                                                kind: 'Field',
-                                                name: { kind: 'Name', value: 'thumbnailUrl' },
-                                                arguments: [
-                                                    {
-                                                        kind: 'Argument',
-                                                        name: { kind: 'Name', value: 'scale' },
-                                                        value: { kind: 'Variable', name: { kind: 'Name', value: 'image_scale' } }
-                                                    }
-                                                ]
-                                            },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'type' } }
-                                        ]
-                                    }
-                                },
-                                {
-                                    kind: 'Field',
-                                    name: { kind: 'Name', value: 'articleData' },
-                                    selectionSet: {
-                                        kind: 'SelectionSet',
-                                        selections: [
-                                            { kind: 'Field', name: { kind: 'Name', value: 'title' } },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'kicker' } },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'articleId' } }
-                                        ]
-                                    }
-                                },
-                                {
-                                    kind: 'Field',
-                                    name: { kind: 'Name', value: 'mediaData' },
-                                    selectionSet: { kind: 'SelectionSet', selections: [{ kind: 'Field', name: { kind: 'Name', value: 'text' } }] }
-                                },
-                                {
-                                    kind: 'Field',
-                                    name: { kind: 'Name', value: 'momentData' },
-                                    selectionSet: { kind: 'SelectionSet', selections: [{ kind: 'Field', name: { kind: 'Name', value: 'text' } }] }
-                                },
-                                {
-                                    kind: 'Field',
-                                    name: { kind: 'Name', value: 'shortVideoData' },
-                                    selectionSet: { kind: 'SelectionSet', selections: [{ kind: 'Field', name: { kind: 'Name', value: 'text' } }] }
-                                },
-                                {
-                                    kind: 'Field',
-                                    name: { kind: 'Name', value: 'videoData' },
-                                    selectionSet: {
-                                        kind: 'SelectionSet',
-                                        selections: [
-                                            { kind: 'Field', name: { kind: 'Name', value: 'title' } },
-                                            { kind: 'Field', name: { kind: 'Name', value: 'text' } }
-                                        ]
-                                    }
-                                }
-                            ]
-                        }
-                    }
-                ]
-            }
-        }
-    ]
-};
 export const GetShortVideosDocument = {
     kind: 'Document',
     definitions: [
@@ -261,10 +32,7 @@ export const GetShortVideosDocument = {
                                 {
                                     kind: 'Field',
                                     name: { kind: 'Name', value: 'items' },
-                                    selectionSet: {
-                                        kind: 'SelectionSet',
-                                        selections: [{ kind: 'FragmentSpread', name: { kind: 'Name', value: 'ShortVideosPlayerPayloadFragment' } }]
-                                    }
+                                    selectionSet: { kind: 'SelectionSet', selections: [{ kind: 'FragmentSpread', name: { kind: 'Name', value: 'PostsPlayerPayloadFragment' } }] }
                                 },
                                 { kind: 'Field', name: { kind: 'Name', value: 'continuationToken' } }
                             ]
@@ -477,7 +245,7 @@ export const GetShortVideosDocument = {
         },
         {
             kind: 'FragmentDefinition',
-            name: { kind: 'Name', value: 'ShortVideosPlayerPayloadFragment' },
+            name: { kind: 'Name', value: 'PostsPlayerPayloadFragment' },
             typeCondition: { kind: 'NamedType', name: { kind: 'Name', value: 'Post' } },
             selectionSet: {
                 kind: 'SelectionSet',

package/dist/short-videos/{short-videos-player → data-providers}/operations.graphql

@@ -2,16 +2,8 @@
 query GetShortVideos($input: EmbedPostsInput!, $image_scale: ImageScale = ORIGINAL_ENCODED) {
   shortVideos: embedPosts(input: $input) {
     items {
-      ...ShortVideosPlayerPayloadFragment
+      ...PostsPlayerPayloadFragment
     }
     continuationToken
   }
 }
-
-fragment ShortVideosPlayerPayloadFragment on Post {
-  ...PostViewerPayloadFragment
-  ownerProfile {
-    id
-    type
-  }
-}

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

@@ -1,27 +1,12 @@
+import type { Locale } from '../../core/locale';
 import { type IMediaCenterConfig } from '../../media-center/config/types';
-import type { IPostSocialInteractionsHandler } from '../../posts/social-interactions';
 import type { IPlayerItemsProvider } from '../../ui/player-slider';
-import { default as ShortVideosPlayer } from './cmp.short-videos-player.svelte';
-import { mapToShortVideoPlayerModel } from './mapper';
-import type { IShortVideoAnalyticsHandler, ShortVideoPlayerModel, ShortVideoPlayerSettings } from './types';
-export { ShortVideosPlayer, type ShortVideoPlayerModel };
-export type { IMediaCenterConfig, IPlayerItemsProvider, IShortVideoAnalyticsHandler };
-export { mapToShortVideoPlayerModel };
+export type { IMediaCenterConfig, IPlayerItemsProvider };
 /**
  * Opens the short videos player modal.
  *
- * Two overloads (mutually exclusive):
- * - Provider mode: openShortVideosPlayer({ shortVideosProvider, mediaCenterConfig?, ...common })
- * - IDs mode: openShortVideosPlayer({ ids, initiator, graphqlOrigin?, initialId?, mediaPageId?, ...common })
- *
  * @param init Configuration options.
  *
- * Provider mode (overload 1)
- * @param {IPlayerItemsProvider<ShortVideoPlayerModel>} init.shortVideosProvider
- *   Provider that supplies short-video items to the player.
- * @param {IMediaCenterConfig} [init.mediaCenterConfig]
- *   Optional media-center config.
- *
  * IDs mode (overload 2)
  * @param {string[]} init.ids
  *   List of short-video IDs to display.
@@ -34,22 +19,18 @@ export { mapToShortVideoPlayerModel };
  * @param {string} [init.mediaPageId]
  *   Optional media page ID used to construct an internal media-center config.
  *
- * Common settings
+ * Player settings
  * @param {IPostSocialInteractionsHandler} [init.socialInteractionsHandler]
  *   Handler for social interactions (like, share, etc.).
- * @param {ContentPlayerSettings} [init.playerSettings]
+ * @param [init.playerSettings]
  *   Player UI and behavior settings.
  *
  *   Fields of ContentPlayerSettings:
- *   - {boolean} [disableBackground]
- *       If true, hides the player's background image.
  *   - {boolean} [hideCloseButton]
  *       If true, hides the close button.
  *   - {Locale} [locale='en']
  *       Localization for the player UI. Supported values: 'en' | 'no'.
  *       If omitted, the default locale 'en' is used.
- *   - {boolean} [showStreamsCloudWatermark]
- *       If true, shows the StreamsCloud watermark.
  *
  * Events
  * @param {{ playerClosed?: () => void; videoActivated?: (id: string) => void }} [init.on]
@@ -61,70 +42,40 @@ export { mapToShortVideoPlayerModel };
  *
  * @returns {void}
  *
- * @example <caption>Provider mode</caption>
- * ```ts
- * import { openShortVideosPlayer } from '@streamscloud/embeddable/short-videos-player';
- *
- * openShortVideosPlayer({
- *   shortVideosProvider: myShortVideosProvider,
- *   mediaCenterConfig: mymediaCenterConfig,
- *   playerSettings: {
- *     // Locale is 'en' by default; set 'no' to switch to Norwegian:
- *     locale: 'no',
- *     disableBackground: false,
- *     hideCloseButton: false,
- *     showStreamsCloudWatermark: true,
- *   },
- *   on: {
- *     playerClosed: () => console.log('Player closed'),
- *     videoActivated: (id) => console.log('Activated', id)
- *   }
- * });
- * ```
- *
  * @example <caption>IDs mode</caption>
  * ```ts
  * import { openShortVideosPlayer } from '@streamscloud/embeddable/short-videos-player';
  *
  * openShortVideosPlayer({
  *   ids: ['id1', 'id2', 'id3'],
- *   initiator: 'marketing-campaign',
+ *   initiator: 'campaign-autumn',
  *   graphqlOrigin: 'https://graphql.example.com',
  *   initialId: 'id2',
  *   mediaPageId: 'media-page-123',
  *   playerSettings: {
- *     locale: 'en',
- *     disableBackground: true,
+ *     // Default locale is 'en'; set 'no' to switch to Norwegian:
+ *     locale: 'no',
+ *     disableBackground: false,
  *     hideCloseButton: false,
- *     showStreamsCloudWatermark: false,
+ *     showStreamsCloudWatermark: true,
  *   },
  *   on: {
  *     playerClosed: () => console.log('Player closed'),
- *     videoActivated: (id) => console.log('Activated', id)
  *   }
  * });
  * ```
  */
-export declare function openShortVideosPlayer(init: {
-    shortVideosProvider: IPlayerItemsProvider<ShortVideoPlayerModel>;
-    mediaCenterConfig?: IMediaCenterConfig;
-    analyticsHandler?: IShortVideoAnalyticsHandler;
-    socialInteractionsHandler?: IPostSocialInteractionsHandler;
-    playerSettings?: ShortVideoPlayerSettings;
-    on?: {
-        playerClosed?: () => void;
-        videoActivated?: (id: string) => void;
-    };
-}): void;
 export declare function openShortVideosPlayer(init: {
     ids: string[];
     initiator: string;
     graphqlOrigin?: string;
     initialId?: string;
     mediaPageId?: string;
-    playerSettings?: ShortVideoPlayerSettings;
+    playerSettings?: {
+        hideCloseButton?: boolean;
+        locale?: Locale;
+    };
     on?: {
         playerClosed?: () => void;
-        videoActivated?: (id: string) => void;
     };
 }): void;