@streamscloud/embeddable 12.0.0 → 12.2.0

package/dist/media-page/index.d.ts

@@ -1,5 +1,6 @@
 import type { Locale } from '../core/locale';
 import { type IMediaCenterConfig } from '../media-center/config/types';
+export { default as MediaPage } from './cmp.media-page.svelte';
 export type { IMediaCenterConfig };
 export { mapToPostPlayerModel } from '../posts/data-loaders/mapper';
 /**
@@ -118,4 +119,5 @@ export type MediaPageViewerSettings = {
     locale?: Locale;
     showStreamsCloudWatermark?: boolean;
     hideCloseButton?: boolean;
+    theme?: 'light' | 'dark';
 };

package/dist/media-page/index.js

@@ -1,10 +1,11 @@
 import { toastrWarning } from '../core/toastr';
 import { InternalMediaCenterConfig } from '../media-center/config/internal-media-center-config';
 import {} from '../media-center/config/types';
-import { MediaCenter } from '../media-center/media-center';
+import { MediaCenterProxy } from '../media-center/media-center';
 import { CloseOrchestrator } from '../ui/player/close-orchestrator';
 import { ModalShadowHost } from '../ui/shadow-dom';
 import { mount, unmount } from 'svelte';
+export { default as MediaPage } from './cmp.media-page.svelte';
 export { mapToPostPlayerModel } from '../posts/data-loaders/mapper';
 export function openMediaPageModal(init) {
     const { id, graphqlOrigin, initiator, viewerSettings, on } = init;
@@ -28,7 +29,7 @@ export function openMediaPageModal(init) {
         },
         canClose: !viewerSettings?.hideCloseButton
     });
-    mounted = mount(MediaCenter, {
+    mounted = mount(MediaCenterProxy, {
         target: shadowHost.shadowRoot,
         props: {
             config: mediaCenterConfig,

package/dist/posts/attachments/cmp.attachments.svelte

@@ -15,7 +15,7 @@ const trackingParams = $derived.by(() => {
 </script>
 
 {#if model.attachments}
-  <div class="post-attachments" data-theme="dark">
+  <div class="post-attachments">
     {#if model.attachments.ads.length}
       {#each model.attachments.ads as ad (ad.id)}
         <AdCard

package/dist/posts/controls/cmp.controls.svelte

@@ -16,7 +16,7 @@ import IconShare from '@fluentui/svg-icons/icons/share_48_regular.svg?raw';
 import IconShoppingBag from '@fluentui/svg-icons/icons/shopping_bag_32_regular.svg?raw';
 import IconSpeaker2 from '@fluentui/svg-icons/icons/speaker_2_32_regular.svg?raw';
 import IconSpeakerMute from '@fluentui/svg-icons/icons/speaker_mute_32_regular.svg?raw';
-let { model, activeColor, inactiveColor, socialInteractionsHandler, on } = $props();
+let { model, activeColor, inactiveColor, socialInteractionsHandler, extraActions, on } = $props();
 const showSocialInteractions = $derived(!!socialInteractionsHandler && model.enableSocialInteractions);
 let isLikedStore = $state.raw({
     get isLiked() {
@@ -39,6 +39,9 @@ const actions = $derived.by(() => {
     if (model.media && !model.media.currentItem.isImage) {
         result.push({ icon: MediaVolumeManager.isMuted ? IconSpeakerMute : IconSpeaker2, callback: onMuteClicked });
     }
+    if (extraActions === null || extraActions === void 0 ? void 0 : extraActions.length) {
+        result.push(...extraActions);
+    }
     return result;
 });
 $effect(() => {

package/dist/posts/controls/cmp.controls.svelte.d.ts

@@ -1,10 +1,12 @@
 import type { PostModel } from '../model';
 import type { IPostSocialInteractionsHandler } from '../social-interactions';
+import { type PlayerButtonDef } from '../../ui/player/button';
 type Props = {
     model: PostModel;
     activeColor: string | null;
     inactiveColor: string | null;
     socialInteractionsHandler?: IPostSocialInteractionsHandler;
+    extraActions?: PlayerButtonDef[];
     on?: {
         attachmentsClicked?: () => void;
     };

package/dist/posts/post-viewer/attachments-horizontal.svelte

@@ -192,19 +192,14 @@ const variables = $derived.by(() => {
   align-items: center;
   width: 15.625rem;
   padding: 0.375rem;
-  background-color: rgba(255, 255, 255, 0.9);
-  color: #000000;
-  border: 0.0625rem solid #f2f2f3;
+  background-color: rgb(from var(--sc-mc-color--bg-card) r g b/90%);
+  color: var(--sc-mc-color--text-primary);
+  border: 0.0625rem solid var(--sc-mc-color--border-card);
   border-radius: 0.25rem;
 }
 .attachments-card--single {
   width: 100%;
 }
-:global([data-theme="dark"]) .attachments-card {
-  background-color: rgba(18, 18, 18, 0.9);
-  color: #ffffff;
-  border-color: #1e1e1e;
-}
 .attachments-card__thumb {
   --image--rounded--width: 2.375rem;
   --image--rounded--height: 2.375rem;
@@ -226,11 +221,8 @@ const variables = $derived.by(() => {
 }
 .attachments-card__extra-info {
   font-size: 0.625rem;
-  color: #6b7280;
+  color: var(--sc-mc-color--text-secondary);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-}
-:global([data-theme="dark"]) .attachments-card__extra-info {
-  color: #ffffff;
 }</style>

package/dist/posts/post-viewer/heading.svelte

@@ -67,8 +67,8 @@ const variables = $derived.by(() => {
   font-size: 0.75rem;
   line-height: 0.9375rem;
   font-weight: 500;
-  color: #ffffff;
-  text-shadow: 1px 1px hsl(0, 0%, 10%);
+  color: var(--sc-mc-color--text-white);
+  text-shadow: var(--sc-mc-color--text-white-shadow);
   text-overflow: ellipsis;
   width: 100%;
   white-space: nowrap;
@@ -79,6 +79,6 @@ const variables = $derived.by(() => {
   font-size: 0.625rem;
   line-height: 0.75rem;
   font-weight: 400;
-  color: #ffffff;
-  text-shadow: 1px 1px hsl(0, 0%, 10%);
+  color: var(--sc-mc-color--text-white);
+  text-shadow: var(--sc-mc-color--text-white-shadow);
 }</style>

package/dist/posts/post-viewer/media/post-media.svelte

@@ -52,7 +52,7 @@ let { id, media, locale, autoplay = 'on-appearance', on } = $props();
   height: 100%;
   min-height: 100%;
   max-height: 100%;
-  background-color: rgba(0, 0, 0, 0.6);
+  background-color: rgb(from var(--sc-mc-color--bg-panel) r g b/60%);
 }
 .post-media--fit {
   --video--media-fit: contain;

package/dist/posts/post-viewer/post-texts.svelte

@@ -45,8 +45,8 @@ const variables = $derived.by(() => {
   }
 }
 .post-viewer-texts {
-  color: #ffffff;
-  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 6px rgba(0, 0, 0, 0.05);
+  color: var(--sc-mc-color--text-white);
+  text-shadow: var(--sc-mc-color--text-white-shadow);
   padding: var(--_post-viewer-texts--padding);
   display: flex;
   flex-direction: column;

package/dist/posts/posts-player/cmp.posts-player.svelte.d.ts

@@ -10,6 +10,7 @@ type Props = {
         locale?: Locale;
         showStreamsCloudWatermark?: boolean;
         disableBackground?: boolean;
+        theme?: 'light' | 'dark';
     };
     on?: {
         postActivated?: (id: string) => void;

package/dist/posts/posts-player/index.d.ts

@@ -120,4 +120,5 @@ export type PostsPlayerSettings = {
     locale?: Locale;
     showStreamsCloudWatermark?: boolean;
     hideCloseButton?: boolean;
+    theme?: 'light' | 'dark';
 };

package/dist/posts/posts-player/index.js

@@ -1,5 +1,5 @@
 import {} from '../../media-center/config/types';
-import { MediaCenter } from '../../media-center/media-center';
+import { MediaCenterProxy } from '../../media-center/media-center';
 import { CloseOrchestrator } from '../../ui/player/close-orchestrator';
 import { ModalShadowHost } from '../../ui/shadow-dom';
 import { default as PostsPlayer } from './cmp.posts-player.svelte';
@@ -22,7 +22,7 @@ export function openPostsPlayer(init) {
         canClose: !playerSettings?.hideCloseButton
     });
     if (mediaCenterConfig) {
-        mounted = mount(MediaCenter, {
+        mounted = mount(MediaCenterProxy, {
             target: shadowHost.shadowRoot,
             props: {
                 config: mediaCenterConfig,

package/dist/posts/posts-player/posts-player-proxy.svelte

@@ -1,14 +1,23 @@
-<script lang="ts">import {} from '../../ui/player/close-orchestrator';
-import { WithBackground } from '../../ui/with-background';
+<script lang="ts">import { Theme } from '../../core/theme';
+import {} from '../../ui/player/close-orchestrator';
+import { ShadowRoot } from '../../ui/shadow-dom';
 import { default as PostsPlayerView } from './posts-player-view.svelte';
+import { untrack } from 'svelte';
 let { dataProvider, socialInteractionsHandler, closeOrchestrator, playerSettings, analyticsHandler, on } = $props();
 let backgroundImageUrl = $state(null);
 const handleBackgroundImagedLoaded = (url) => {
     backgroundImageUrl = url;
 };
+$effect(() => {
+    void (playerSettings === null || playerSettings === void 0 ? void 0 : playerSettings.theme);
+    untrack(() => {
+        var _a;
+        Theme.set((_a = playerSettings === null || playerSettings === void 0 ? void 0 : playerSettings.theme) !== null && _a !== void 0 ? _a : 'dark');
+    });
+});
 </script>
 
-<WithBackground backgroundDisabled={playerSettings?.disableBackground === true} backgroundImageUrl={backgroundImageUrl}>
+<ShadowRoot backgroundDisabled={playerSettings?.disableBackground === true} backgroundImageUrl={backgroundImageUrl}>
   <PostsPlayerView
     dataProvider={{ type: 'provider', provider: dataProvider }}
     socialInteractionsHandler={socialInteractionsHandler}
@@ -16,4 +25,4 @@ const handleBackgroundImagedLoaded = (url) => {
     analyticsHandler={analyticsHandler}
     closeOrchestrator={closeOrchestrator}
     on={{ postActivated: on?.postActivated, backgroundImageLoaded: playerSettings?.disableBackground === true ? undefined : handleBackgroundImagedLoaded }} />
-</WithBackground>
+</ShadowRoot>

package/dist/posts/posts-player/posts-player-proxy.svelte.d.ts

@@ -12,6 +12,7 @@ type Props = {
         locale?: Locale;
         showStreamsCloudWatermark?: boolean;
         disableBackground?: boolean;
+        theme?: 'light' | 'dark';
     };
     on?: {
         postActivated?: (id: string) => void;

package/dist/products/product-card/cmp.product-card.svelte

@@ -103,8 +103,8 @@ const styles = $derived.by(() => {
 .product-card {
   --_product-card--aspect-ratio: var(--product-card--aspect-ratio, 10/16);
   --_product-card--border-radius: var(--product-card--border-radius, 0.5rem);
-  --_product-card--background-color: var(--product-card--background-color, rgb(from #ffffff r g b/90%));
-  --_product-card--border-color: var(--product-card--background-color, #f2f2f3);
+  --_product-card--background-color: var(--product-card--background-color, rgb(from var(--sc-mc-color--bg-card) r g b/90%));
+  --_product-card--border-color: var(--product-card--background-color, var(--sc-mc-color--border-card));
   --_product-card--price-color: var(--product-card--price-color, inherit);
   --_product-card--sale-price-color: var(--product-card--sale-price-color, inherit);
   --product-price-color: var(--_product-card--price-color);
@@ -120,7 +120,6 @@ const styles = $derived.by(() => {
   position: relative;
   container-type: inline-size;
   aspect-ratio: var(--_product-card--aspect-ratio);
-  color: #000000;
   background-color: var(--_product-card--background-color);
   border: 1px solid var(--_product-card--border-color);
   border-radius: var(--_product-card--border-radius);
@@ -128,11 +127,6 @@ const styles = $derived.by(() => {
   justify-content: space-between;
   /* Set 'container-type: inline-size;' to reference container*/
 }
-:global([data-theme="dark"]) .product-card {
-  --_product-card--background-color: var(--product-card--background-color, rgb(from #121212 r g b/90%));
-  --_product-card--border-color: var(--product-card--background-color, #1e1e1e);
-  color: #ffffff;
-}
 @container (width < 230px) {
   .product-card {
     padding: 0.5rem 0.5rem 0.75rem;
@@ -181,15 +175,12 @@ const styles = $derived.by(() => {
 }
 .product-card__description {
   font-weight: 400;
-  color: #6b7280;
+  color: var(--sc-mc-color--text-secondary);
   font-size: 0.9375rem;
   line-height: 1.375rem;
   min-height: 1.375rem;
   /* Set 'container-type: inline-size;' to reference container*/
 }
-:global([data-theme="dark"]) .product-card__description {
-  color: #d1d5db;
-}
 @container (width < 230px) {
   .product-card__description {
     font-size: 0.625rem;
@@ -217,7 +208,7 @@ const styles = $derived.by(() => {
 .product-price {
   --_product-price--color: var(--product-price-color);
   --_product-price--sale--color: var(--product-price--sale--color);
-  --_product-price--before--color: #6b7280;
+  --_product-price--before--color: var(--sc-mc-color--text-secondary);
   --_product-price--before--font-size: 0.75em;
   --_product-price--font-size: 1.875em;
   --_product-price--gap: 0.375em;
@@ -236,9 +227,6 @@ const styles = $derived.by(() => {
     --_product-price--gap: 0.25rem;
   }
 }
-:global([data-theme="dark"]) .product-price {
-  --_product-price--before--color: #d1d5db;
-}
 .product-price__before-price {
   width: 100%;
   color: var(--_product-price--before--color);

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

@@ -144,8 +144,8 @@ const adjustTextSize = (node) => {
   align-items: center;
   gap: 0.3125em;
   --icon--size: 1.25em;
-  --icon--color: #ffffff;
-  --icon--filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.2));
+  --icon--color: var(--sc-mc-color--icon-overlay);
+  --icon--filter: var(--sc-mc-color--icon-overlay-shadow);
 }
 .short-video-card__info {
   margin-top: clamp(0.4375rem, 3.6cqi, 0.625rem);
@@ -156,13 +156,13 @@ const adjustTextSize = (node) => {
 .short-video-card__meta {
   font-size: clamp(0.625rem, 4.3cqi, 0.75rem);
   font-weight: 500;
-  color: #999999;
+  color: var(--sc-mc-color--text-secondary);
   display: flex;
   align-items: center;
   gap: 0.25rem;
 }
 .short-video-card__text {
-  color: #ffffff;
+  color: var(--sc-mc-color--text-primary);
   --min-font: 0.75rem;
   --max-font: 0.9375rem;
   --line-height: 1.2;
@@ -202,7 +202,7 @@ const adjustTextSize = (node) => {
 .product-card__info {
   display: flex;
   flex-direction: column;
-  color: #ffffff;
+  color: var(--sc-mc-color--text-primary);
   font-size: clamp(0.5rem, 2.9cqi, 0.5rem);
   line-height: clamp(0.75rem, 4.3cqi, 0.75rem);
   font-weight: 500;
@@ -220,6 +220,6 @@ const adjustTextSize = (node) => {
   font-weight: 600;
 }
 .product-card__price span:nth-child(2) {
-  color: #999999;
+  color: var(--sc-mc-color--text-secondary);
   text-decoration: line-through;
 }</style>

package/dist/streams/data-loaders/streams-loader.js

@@ -1,4 +1,4 @@
-import { StreamStatus } from '../../core/enums';
+import { EmbedStreamsOrderBy, StreamStatus } from '../../core/enums';
 import { mapToStreamPlayerModel } from './mapper';
 import { GetStreamsDocument } from './operations.generated';
 export const getStreamsCursor = async (input) => {
@@ -16,7 +16,11 @@ export const getStreamsCursor = async (input) => {
                 showInFeed
             },
             limit,
-            continuationToken
+            continuationToken,
+            sorting: {
+                orderBy: EmbedStreamsOrderBy.ContentUpdatedAt,
+                ascendingOrder: false
+            }
         }
     })
         .toPromise();

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

@@ -58,7 +58,7 @@ let { stream, aspectRatio = 9 / 16, on } = $props();
   height: clamp(1.75rem, 20cqi, 2.5rem);
   padding-inline: clamp(0.5rem, 6cqi, 0.75rem);
   background: rgba(0, 0, 0, 0.8);
-  color: #ffffff;
+  color: var(--sc-mc-color--text-white);
   display: flex;
   flex-direction: column;
   align-content: center;

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

@@ -0,0 +1,42 @@
+<script lang="ts">var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { CloseOrchestrator } from '../../ui/player/close-orchestrator';
+import { createShadowRoot } from '../../ui/shadow-dom';
+import { default as StreamsPlayerProxy } from './streams-player-proxy.svelte';
+import { mount, unmount } from 'svelte';
+let { dataProvider, postSocialInteractionsHandler, amplificationParameters, playerSettings, analyticsHandler, on } = $props();
+const initHost = (node) => {
+    const shadowRoot = createShadowRoot(node);
+    const mounted = mount(StreamsPlayerProxy, {
+        target: shadowRoot,
+        props: {
+            dataProvider,
+            postSocialInteractionsHandler,
+            analyticsHandler,
+            amplificationParameters,
+            playerSettings,
+            closeOrchestrator: new CloseOrchestrator({
+                closeFn: () => __awaiter(void 0, void 0, void 0, function* () {
+                    yield unmount(mounted);
+                }),
+                canClose: false
+            }),
+            on
+        }
+    });
+    return {
+        destroy: () => {
+            unmount(mounted);
+        }
+    };
+};
+</script>
+
+<div class="streams-player-host" use:initHost></div>

package/dist/streams/streams-player/cmp.streams-player.svelte.d.ts

@@ -0,0 +1,24 @@
+import type { Locale } from '../../core/locale';
+import type { IPostSocialInteractionsHandler } from '../../posts';
+import type { IStreamAnalyticsHandler, IStreamsPlayerDataProvider, StreamAmplificationParameters } from './types';
+type Props = {
+    dataProvider: IStreamsPlayerDataProvider;
+    postSocialInteractionsHandler?: IPostSocialInteractionsHandler;
+    analyticsHandler?: IStreamAnalyticsHandler;
+    amplificationParameters?: StreamAmplificationParameters;
+    playerSettings?: {
+        locale?: Locale;
+        showStreamsCloudWatermark?: boolean;
+        disableBackground?: boolean;
+        theme?: 'light' | 'dark';
+    };
+    on?: {
+        streamActivated?: (data: {
+            title: string;
+            image: string | null;
+        }) => void;
+    };
+};
+declare const Cmp: import("svelte").Component<Props, {}, "">;
+type Cmp = ReturnType<typeof Cmp>;
+export default Cmp;

package/dist/streams/streams-player/index.d.ts

@@ -157,4 +157,5 @@ export type StreamsPlayerSettings = {
     locale?: Locale;
     showStreamsCloudWatermark?: boolean;
     hideCloseButton?: boolean;
+    theme?: 'light' | 'dark';
 };

package/dist/streams/streams-player/index.js

@@ -1,12 +1,12 @@
 import { toastrWarning } from '../../core/toastr';
 import { InternalMediaCenterConfig } from '../../media-center/config/internal-media-center-config';
 import {} from '../../media-center/config/types';
-import { MediaCenter } from '../../media-center/media-center';
+import { MediaCenterProxy } from '../../media-center/media-center';
 import { CloseOrchestrator } from '../../ui/player/close-orchestrator';
 import { ModalShadowHost } from '../../ui/shadow-dom';
 import { InternalStreamAnalyticsHandler } from './internal-stream-analytics-handler';
 import { InternalStreamsPlayerDataProvider } from './internal-streams-player-data-provider';
-import { default as StreamsPlayerView } from './streams-player-view.svelte';
+import { default as StreamsPlayerProxy } from './streams-player-proxy.svelte';
 import { mount, unmount } from 'svelte';
 export {};
 export { mapToStreamPlayerModel } from '../data-loaders/mapper';
@@ -42,7 +42,7 @@ export function openStreamsPlayer(init) {
         canClose: !playerSettings?.hideCloseButton
     });
     if (mediaCenterConfig) {
-        mounted = mount(MediaCenter, {
+        mounted = mount(MediaCenterProxy, {
             target: shadowHost.shadowRoot,
             props: {
                 config: mediaCenterConfig,
@@ -64,10 +64,10 @@ export function openStreamsPlayer(init) {
         });
     }
     else {
-        mounted = mount(StreamsPlayerView, {
+        mounted = mount(StreamsPlayerProxy, {
             target: shadowHost.shadowRoot,
             props: {
-                dataProvider: { type: 'provider', provider: dataProvider },
+                dataProvider,
                 analyticsHandler,
                 amplificationParameters,
                 playerSettings,

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

@@ -95,5 +95,5 @@ let { buffer, activePageId, on } = $props();
   }
 }
 .stream-overview-pages__page--active {
-  outline: 2px solid var(--brand-color, #5a8dec);
+  outline: 2px solid var(--brand-color, var(--sc-mc-color--border-brand));
 }</style>

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

@@ -0,0 +1,32 @@
+<script lang="ts">import { Theme } from '../../core/theme';
+import {} from '../../ui/player/close-orchestrator';
+import { ShadowRoot } from '../../ui/shadow-dom';
+import { default as StreamsPlayerView } from './streams-player-view.svelte';
+import { untrack } from 'svelte';
+let { dataProvider, postSocialInteractionsHandler, amplificationParameters, closeOrchestrator, playerSettings, analyticsHandler, on } = $props();
+let backgroundImageUrl = $state(null);
+const handleBackgroundImagedLoaded = (url) => {
+    backgroundImageUrl = url;
+};
+$effect(() => {
+    void (playerSettings === null || playerSettings === void 0 ? void 0 : playerSettings.theme);
+    untrack(() => {
+        var _a;
+        Theme.set((_a = playerSettings === null || playerSettings === void 0 ? void 0 : playerSettings.theme) !== null && _a !== void 0 ? _a : 'dark');
+    });
+});
+</script>
+
+<ShadowRoot backgroundDisabled={playerSettings?.disableBackground === true} backgroundImageUrl={backgroundImageUrl}>
+  <StreamsPlayerView
+    dataProvider={{ type: 'provider', provider: dataProvider }}
+    postSocialInteractionsHandler={postSocialInteractionsHandler}
+    analyticsHandler={analyticsHandler}
+    amplificationParameters={amplificationParameters}
+    playerSettings={playerSettings}
+    closeOrchestrator={closeOrchestrator}
+    on={{
+      streamActivated: on?.streamActivated,
+      backgroundImageLoaded: playerSettings?.disableBackground === true ? undefined : handleBackgroundImagedLoaded
+    }} />
+</ShadowRoot>

package/dist/streams/streams-player/streams-player-proxy.svelte.d.ts

@@ -0,0 +1,26 @@
+import type { Locale } from '../../core/locale';
+import type { IPostSocialInteractionsHandler } from '../../posts/social-interactions';
+import { type ICloseOrchestrator } from '../../ui/player/close-orchestrator';
+import type { IStreamsPlayerDataProvider, IStreamAnalyticsHandler, StreamAmplificationParameters } from './types';
+type Props = {
+    dataProvider: IStreamsPlayerDataProvider;
+    postSocialInteractionsHandler?: IPostSocialInteractionsHandler;
+    analyticsHandler?: IStreamAnalyticsHandler;
+    amplificationParameters?: StreamAmplificationParameters;
+    closeOrchestrator: ICloseOrchestrator;
+    playerSettings?: {
+        locale?: Locale;
+        showStreamsCloudWatermark?: boolean;
+        disableBackground?: boolean;
+        theme?: 'light' | 'dark';
+    };
+    on?: {
+        streamActivated?: (data: {
+            title: string;
+            image: string | null;
+        }) => void;
+    };
+};
+declare const StreamsPlayerProxy: import("svelte").Component<Props, {}, "">;
+type StreamsPlayerProxy = ReturnType<typeof StreamsPlayerProxy>;
+export default StreamsPlayerProxy;