@streamscloud/embeddable 16.0.7 → 16.1.1

package/dist/ui/{media-items-gallery/types.js → media-items/media-items-gallery/gallery-layout.js}

@@ -1,4 +1,4 @@
-import { getMediaItemImageUrl } from '../../core/media';
+import { getMediaItemImageUrl } from '../types';
 import { ImageHelper } from '@streamscloud/kit/core/media';
 export class GalleryLayout {
     layoutClass;

package/dist/ui/media-items/types.d.ts

@@ -0,0 +1,14 @@
+import type { MediaType } from '../../core/enums';
+export type MediaItem = {
+    type: MediaType;
+    url: string;
+    thumbnailUrl?: string | null;
+};
+export type MediaItemMetadataModel = {
+    width: number;
+    height: number;
+};
+export type MediaItemWithMetadataModel = MediaItem & {
+    metadata: MediaItemMetadataModel;
+};
+export declare const getMediaItemImageUrl: (media: MediaItem) => string;

package/dist/ui/media-items/types.js

@@ -0,0 +1 @@
+export const getMediaItemImageUrl = (media) => (media.type === 'IMAGE' ? media.url : (media.thumbnailUrl ?? ''));

package/dist/ui/shadow-dom/cmp.shadow-root.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">import { brandColors } from '../../core/theme';
 import { AppLocale } from '@streamscloud/kit/core/locale';
-let { locale, theme = 'dark', backgroundDisabled, backgroundImageUrl, children } = $props();
+let { locale, theme, backgroundDisabled, backgroundImageUrl, children } = $props();
 $effect(() => {
     if (locale) {
         AppLocale.change(locale);
@@ -42,9 +42,10 @@ const styles = $derived.by(() => {
   class:shadow-root--background-enabled={!backgroundDisabled}
   class:shadow-root--background-active={!backgroundDisabled && backgroundImageUrl && backgroundImageUrl !== 'not-applicable'}
   class:shadow-root--background-loading={!backgroundDisabled && !backgroundImageUrl}
-  style:color-scheme={theme}
+  style:color-scheme={theme ?? 'light dark'}
   style={styles}>
   {@render children()}
+  <div data-dialog-anchor></div>
 </div>
 
 <style>@charset "UTF-8";

package/dist/ui/shadow-dom/index.d.ts

@@ -1,3 +1,3 @@
 export { ModalShadowHost } from './modal-shadow-host';
-export { createShadowRoot } from './shadow-root-service';
+export { createShadowRoot, getDialogAnchor } from './shadow-root-service';
 export { default as ShadowRoot } from './cmp.shadow-root.svelte';

package/dist/ui/shadow-dom/index.js

@@ -1,3 +1,3 @@
 export { ModalShadowHost } from './modal-shadow-host';
-export { createShadowRoot } from './shadow-root-service';
+export { createShadowRoot, getDialogAnchor } from './shadow-root-service';
 export { default as ShadowRoot } from './cmp.shadow-root.svelte';

package/dist/ui/shadow-dom/shadow-root-service.d.ts

@@ -1 +1,2 @@
 export declare const createShadowRoot: (host: HTMLElement) => ShadowRoot;
+export declare const getDialogAnchor: (element: HTMLElement) => HTMLElement | null;

package/dist/ui/shadow-dom/shadow-root-service.js

@@ -11,3 +11,11 @@ export const createShadowRoot = (host) => {
 const prepareShadowRootHost = (host) => {
     host.style.all = 'unset';
 };
+const DIALOG_ANCHOR_SELECTOR = '[data-dialog-anchor]';
+export const getDialogAnchor = (element) => {
+    const root = element.getRootNode();
+    if (root instanceof ShadowRoot) {
+        return root.querySelector(DIALOG_ANCHOR_SELECTOR);
+    }
+    return null;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamscloud/embeddable",
-  "version": "16.0.7",
+  "version": "16.1.1",
   "author": "StreamsCloud",
   "repository": {
     "type": "git",
@@ -34,6 +34,10 @@
       "types": "./dist/index.d.ts",
       "svelte": "./dist/index.js"
     },
+    "./article": {
+      "types": "./dist/articles/article/index.d.ts",
+      "svelte": "./dist/articles/article/index.js"
+    },
     "./external-api": {
       "types": "./dist/external-api/index.d.ts",
       "svelte": "./dist/external-api/index.js"
@@ -46,6 +50,10 @@
       "types": "./dist/media-page/index.d.ts",
       "svelte": "./dist/media-page/index.js"
     },
+    "./media-items": {
+      "types": "./dist/ui/media-items/index.d.ts",
+      "svelte": "./dist/ui/media-items/index.js"
+    },
     "./posts": {
       "types": "./dist/posts/index.d.ts",
       "svelte": "./dist/posts/index.js"
@@ -134,7 +142,7 @@
     }
   },
   "peerDependencies": {
-    "@streamscloud/kit": "^0.1.12",
+    "@streamscloud/kit": "^0.2.1",
     "@streamscloud/streams-analytics-collector": "^4.0.1",
     "svelte": "^5.51.0"
   },
@@ -150,7 +158,7 @@
     "@graphql-codegen/typescript": "^5.0.7",
     "@graphql-codegen/typescript-operations": "^5.0.7",
     "@graphql-typed-document-node/core": "^3.2.0",
-    "@streamscloud/kit": "^0.1.12",
+    "@streamscloud/kit": "^0.2.1",
     "@streamscloud/streams-analytics-collector": "^4.0.1",
     "@sveltejs/package": "^2.5.7",
     "@sveltejs/vite-plugin-svelte": "^6.2.4",

package/dist/core/media/types.d.ts

@@ -1,13 +0,0 @@
-import type { MediaType } from '../enums';
-export type MediaItemModel = {
-    type: MediaType;
-    url: string;
-    thumbnailUrl: string | null;
-};
-export type MediaItemMetadataModel = {
-    width: number;
-    height: number;
-};
-export type MediaItemWithMetadataModel = MediaItemModel & {
-    metadata: MediaItemMetadataModel;
-};

package/dist/posts/posts-player/posts-player-host-settings.svelte.d.ts

@@ -1,20 +0,0 @@
-import type { ThemeValue } from '../../core/theme';
-import type { AppLocaleValue } from '@streamscloud/kit/core/locale';
-export declare class PostsPlayerHostSettings {
-    locale: AppLocaleValue | undefined;
-    showStreamsCloudWatermark: boolean | undefined;
-    disableBackground: boolean | undefined;
-    theme: ThemeValue | undefined;
-    constructor(init: {
-        locale?: AppLocaleValue;
-        showStreamsCloudWatermark?: boolean;
-        disableBackground?: boolean;
-        theme?: ThemeValue;
-    } | undefined);
-    update: (data: {
-        locale?: AppLocaleValue;
-        showStreamsCloudWatermark?: boolean;
-        disableBackground?: boolean;
-        theme?: ThemeValue;
-    } | undefined) => void;
-}

package/dist/posts/posts-player/posts-player-host-settings.svelte.js

@@ -1,15 +0,0 @@
-export class PostsPlayerHostSettings {
-    locale = $state();
-    showStreamsCloudWatermark = $state();
-    disableBackground = $state();
-    theme = $state();
-    constructor(init) {
-        this.update(init);
-    }
-    update = (data) => {
-        this.locale = data?.locale;
-        this.showStreamsCloudWatermark = data?.showStreamsCloudWatermark;
-        this.disableBackground = data?.disableBackground;
-        this.theme = data?.theme;
-    };
-}

package/dist/streams/streams-player/streams-player-host-settings.svelte.d.ts

@@ -1,20 +0,0 @@
-import type { ThemeValue } from '../../core/theme';
-import type { AppLocaleValue } from '@streamscloud/kit/core/locale';
-export declare class StreamsPlayerHostSettings {
-    locale: AppLocaleValue | undefined;
-    showStreamsCloudWatermark: boolean | undefined;
-    disableBackground: boolean | undefined;
-    theme: ThemeValue | undefined;
-    constructor(init: {
-        locale?: AppLocaleValue;
-        showStreamsCloudWatermark?: boolean;
-        disableBackground?: boolean;
-        theme?: ThemeValue;
-    } | undefined);
-    update: (data: {
-        locale?: AppLocaleValue;
-        showStreamsCloudWatermark?: boolean;
-        disableBackground?: boolean;
-        theme?: ThemeValue;
-    } | undefined) => void;
-}

package/dist/streams/streams-player/streams-player-host-settings.svelte.js

@@ -1,15 +0,0 @@
-export class StreamsPlayerHostSettings {
-    locale = $state();
-    showStreamsCloudWatermark = $state();
-    disableBackground = $state();
-    theme = $state();
-    constructor(init) {
-        this.update(init);
-    }
-    update = (data) => {
-        this.locale = data?.locale;
-        this.showStreamsCloudWatermark = data?.showStreamsCloudWatermark;
-        this.disableBackground = data?.disableBackground;
-        this.theme = data?.theme;
-    };
-}