@streamscloud/embeddable 16.0.6 → 16.0.7-1772032308956
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ads/ad-card/types.d.ts +1 -1
- package/dist/ads/ad-card/types.js +1 -1
- package/dist/articles/article/article-layout.svelte +32 -0
- package/dist/articles/article/article-layout.svelte.d.ts +9 -0
- package/dist/articles/article/article-section.svelte +52 -0
- package/dist/articles/article/article-section.svelte.d.ts +9 -0
- package/dist/articles/article/cmp.article.svelte +31 -0
- package/dist/articles/article/cmp.article.svelte.d.ts +8 -0
- package/dist/articles/article/facts-container.svelte +27 -0
- package/dist/articles/article/facts-container.svelte.d.ts +7 -0
- package/dist/articles/article/fields/alt-text.svelte +15 -0
- package/dist/articles/article/fields/alt-text.svelte.d.ts +6 -0
- package/dist/articles/article/fields/article-field.svelte +45 -0
- package/dist/articles/article/fields/article-field.svelte.d.ts +8 -0
- package/dist/articles/article/fields/byline-field.svelte +23 -0
- package/dist/articles/article/fields/byline-field.svelte.d.ts +8 -0
- package/dist/articles/article/fields/image-field.svelte +8 -0
- package/dist/articles/article/fields/image-field.svelte.d.ts +7 -0
- package/dist/articles/article/fields/media-field.svelte +8 -0
- package/dist/articles/article/fields/media-field.svelte.d.ts +7 -0
- package/dist/articles/article/fields/media-gallery-field.svelte +8 -0
- package/dist/articles/article/fields/media-gallery-field.svelte.d.ts +7 -0
- package/dist/articles/article/fields/rich-text-field.svelte +19 -0
- package/dist/articles/article/fields/rich-text-field.svelte.d.ts +7 -0
- package/dist/articles/article/fields/text-field.svelte +24 -0
- package/dist/articles/article/fields/text-field.svelte.d.ts +7 -0
- package/dist/articles/article/fields/types.d.ts +62 -0
- package/dist/articles/article/fields/types.js +1 -0
- package/dist/articles/article/fields/video-field.svelte +8 -0
- package/dist/articles/article/fields/video-field.svelte.d.ts +7 -0
- package/dist/articles/article/helpers.d.ts +5 -0
- package/dist/articles/article/helpers.js +27 -0
- package/dist/articles/article/index.d.ts +4 -0
- package/dist/articles/article/index.js +2 -0
- package/dist/articles/article/styles-transformer.d.ts +19 -0
- package/dist/articles/article/styles-transformer.js +36 -0
- package/dist/articles/article/types.d.ts +27 -0
- package/dist/articles/article/types.js +1 -0
- package/dist/articles/article-viewer/article-viewer-host-settings.svelte.d.ts +14 -0
- package/dist/articles/article-viewer/article-viewer-host-settings.svelte.js +11 -0
- package/dist/articles/article-viewer/article-viewer-proxy.svelte +9 -0
- package/dist/articles/article-viewer/article-viewer-proxy.svelte.d.ts +10 -0
- package/dist/articles/article-viewer/article-viewer-view.svelte +85 -0
- package/dist/articles/article-viewer/article-viewer-view.svelte.d.ts +9 -0
- package/dist/articles/article-viewer/cmp.article-viewer.svelte +34 -0
- package/dist/articles/article-viewer/cmp.article-viewer.svelte.d.ts +12 -0
- package/dist/articles/article-viewer/index.d.ts +43 -0
- package/dist/articles/article-viewer/index.js +60 -0
- package/dist/articles/article-viewer/types.d.ts +12 -0
- package/dist/articles/article-viewer/types.js +1 -0
- package/dist/core/enums.d.ts +15 -50
- package/dist/core/enums.js +1 -61
- package/dist/core/media/media-item-url.service.d.ts +1 -1
- package/dist/core/media/media-item-url.service.js +1 -3
- package/dist/external-api/data-providers/internal-media-center-data-provider.svelte.js +2 -3
- package/dist/external-api/data-providers/internal-short-video-player-items-provider.d.ts +1 -1
- package/dist/external-api/data-providers/internal-short-video-player-items-provider.js +1 -3
- package/dist/external-api/data-providers/mapper.d.ts +1 -1
- package/dist/external-api/data-providers/mapper.js +5 -6
- package/dist/external-api/data-providers/mocks/mock-content-management-handler.svelte.js +2 -3
- package/dist/external-api/data-providers/post-data-loaders/posts-loader.d.ts +1 -1
- package/dist/external-api/data-providers/post-data-loaders/posts-loader.js +0 -1
- package/dist/external-api/data-providers/stream-data-loaders/mapper.js +1 -2
- package/dist/external-api/data-providers/stream-data-loaders/stream-pages-loader.d.ts +1 -1
- package/dist/external-api/data-providers/stream-data-loaders/stream-pages-loader.js +1 -2
- package/dist/external-api/data-providers/stream-data-loaders/streams-loader.d.ts +1 -1
- package/dist/external-api/data-providers/stream-data-loaders/streams-loader.js +1 -2
- package/dist/media-center/config/types.d.ts +1 -1
- package/dist/media-center/config/types.js +1 -1
- package/dist/media-center/media-center/discover/data-loading.js +1 -2
- package/dist/media-center/media-center/discover/discover-view-handler.svelte.js +1 -2
- package/dist/media-center/media-center/moments/moments-feed-handler.svelte.d.ts +1 -1
- package/dist/media-center/media-center/moments/moments-feed-handler.svelte.js +2 -3
- package/dist/media-center/media-center/moments/moments-state.svelte.d.ts +1 -1
- package/dist/media-center/media-center/moments/moments-state.svelte.js +1 -3
- package/dist/media-center/media-center/posts-feed/feed-providers-generator.js +1 -2
- package/dist/media-center/media-center/posts-feed/posts-feed-handler.svelte.d.ts +1 -1
- package/dist/media-center/media-center/posts-feed/posts-feed-handler.svelte.js +1 -2
- package/dist/posts/attachments/cmp.attachments.svelte +2 -3
- package/dist/posts/model/post-model.d.ts +1 -1
- package/dist/posts/model/post-model.js +0 -1
- package/dist/posts/post-viewer/attachments-horizontal.svelte +1 -2
- package/dist/posts/post-viewer/cmp.post-viewer.svelte +2 -3
- package/dist/posts/post-viewer/mapper.js +6 -7
- package/dist/posts/posts-player/cmp.posts-player.svelte +7 -2
- package/dist/posts/posts-player/posts-player-host-settings.svelte.d.ts +20 -0
- package/dist/posts/posts-player/posts-player-host-settings.svelte.js +15 -0
- package/dist/posts/posts-player/posts-player-view.svelte +6 -7
- package/dist/products/price-helper.d.ts +1 -1
- package/dist/products/price-helper.js +3 -4
- package/dist/streams/layout/models/mapper.d.ts +1 -1
- package/dist/streams/layout/models/mapper.js +2 -6
- package/dist/streams/layout/models/stream-layout-media-item-model.d.ts +1 -1
- package/dist/streams/layout/models/stream-layout-media-item-model.js +1 -1
- package/dist/streams/layout/models/stream-layout-short-video-model.d.ts +1 -1
- package/dist/streams/layout/models/stream-layout-short-video-model.js +1 -1
- package/dist/streams/streams-player/cmp.streams-player.svelte +7 -2
- package/dist/streams/streams-player/streams-player-host-settings.svelte.d.ts +20 -0
- package/dist/streams/streams-player/streams-player-host-settings.svelte.js +15 -0
- package/dist/ui/media-item-view/cmp.media-item-view.svelte +3 -4
- package/dist/ui/media-item-view/cmp.media-item-view.svelte.d.ts +1 -1
- package/dist/ui/media-items-gallery/cmp.media-items-gallery.svelte +5 -6
- package/dist/ui/media-items-gallery/cmp.media-items-gallery.svelte.d.ts +1 -1
- package/package.json +12 -3
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { PostType } from '../../..';
|
|
2
1
|
import { StreamsInCategory, ShortVideosInCategory } from './types.svelte';
|
|
3
2
|
export class DiscoverDataLoader {
|
|
4
3
|
dataProvider;
|
|
@@ -30,7 +29,7 @@ export class DiscoverDataLoader {
|
|
|
30
29
|
const shortVideosResponse = await this.dataProvider.postsPlayer.getPostsCursor({
|
|
31
30
|
filter: {
|
|
32
31
|
categoryId: holder.categoryId,
|
|
33
|
-
types: [
|
|
32
|
+
types: ['SHORT_VIDEO']
|
|
34
33
|
},
|
|
35
34
|
limit: this.minItemsPerLoad,
|
|
36
35
|
continuationToken: holder.continuationToken
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { PostType } from '../../../core/enums';
|
|
2
1
|
import { DiscoverDataLoader } from './data-loading';
|
|
3
2
|
import { ShortVideosInCategory, StreamsInCategory } from './types.svelte';
|
|
4
3
|
import { Deferred } from '@streamscloud/kit/core';
|
|
@@ -113,7 +112,7 @@ export class DiscoverViewHandler {
|
|
|
113
112
|
this._shortVideosLoadingDeferred = null;
|
|
114
113
|
};
|
|
115
114
|
onPostCreated = (data) => {
|
|
116
|
-
if (!data.isPublished || data.post.postType !==
|
|
115
|
+
if (!data.isPublished || data.post.postType !== 'SHORT_VIDEO') {
|
|
117
116
|
return;
|
|
118
117
|
}
|
|
119
118
|
const affectedHolders = this._shortVideosInCategoryCache.filter((x) => data.categories.includes(x.categoryId) && x.continuationToken !== undefined);
|
|
@@ -4,7 +4,7 @@ import type { PostPlayerModel, PostsPlayerProps, PostManagementActions } from '.
|
|
|
4
4
|
import type { ICloseOrchestrator } from '../../../ui/player/close-orchestrator';
|
|
5
5
|
import { MomentsState } from './moments-state.svelte';
|
|
6
6
|
import { MediaCenterContentHandler, MediaCenterSettingsHandler } from '../handlers';
|
|
7
|
-
import {
|
|
7
|
+
import type { IPlayerBuffer } from '@streamscloud/kit/ui/player/providers';
|
|
8
8
|
export declare class MomentsFeedHandler {
|
|
9
9
|
momentsState: MomentsState;
|
|
10
10
|
private _active;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { PostType } from '../../../core/enums';
|
|
2
1
|
import { MomentsState } from './moments-state.svelte';
|
|
3
2
|
import { MediaCenterContentHandler, MediaCenterSettingsHandler } from '../handlers';
|
|
4
3
|
import { initBufferFromProvider } from '@streamscloud/kit/ui/player/providers';
|
|
@@ -79,7 +78,7 @@ export class MomentsFeedHandler {
|
|
|
79
78
|
this._active = true;
|
|
80
79
|
};
|
|
81
80
|
onPostCreated = (data) => {
|
|
82
|
-
if (!this._active || !data.isPublished || data.post.postType !==
|
|
81
|
+
if (!this._active || !data.isPublished || data.post.postType !== 'MOMENT') {
|
|
83
82
|
return;
|
|
84
83
|
}
|
|
85
84
|
// Reactivate to include the new moment
|
|
@@ -89,7 +88,7 @@ export class MomentsFeedHandler {
|
|
|
89
88
|
if (!this._active) {
|
|
90
89
|
return false;
|
|
91
90
|
}
|
|
92
|
-
const postStillInTheFeed = data.isPublished && data.post.postType ===
|
|
91
|
+
const postStillInTheFeed = data.isPublished && data.post.postType === 'MOMENT';
|
|
93
92
|
if (postStillInTheFeed) {
|
|
94
93
|
this.activate({ initialMomentId: data.post.id });
|
|
95
94
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { IMediaCenterDataProvider } from '../..';
|
|
2
|
-
import {
|
|
2
|
+
import type { PostPlayerModel } from '../../../posts/posts-player';
|
|
3
3
|
import type { IChunksPlayerDataProvider } from '@streamscloud/kit/ui/player/providers';
|
|
4
4
|
export declare class MomentsState {
|
|
5
5
|
private readonly dataProvider;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
import { PostType } from '../../../core/enums';
|
|
2
|
-
import {} from '../../../posts/posts-player';
|
|
3
1
|
import { SvelteMap } from 'svelte/reactivity';
|
|
4
2
|
export class MomentsState {
|
|
5
3
|
dataProvider;
|
|
@@ -85,7 +83,7 @@ export class MomentsState {
|
|
|
85
83
|
}
|
|
86
84
|
const moments = await this.dataProvider.postsPlayer.getPostsCursor({
|
|
87
85
|
filter: {
|
|
88
|
-
types: [
|
|
86
|
+
types: ['MOMENT'],
|
|
89
87
|
ids: momentsInChunk
|
|
90
88
|
},
|
|
91
89
|
limit: collectionCapacity
|
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import { PostType } from '../../../core/enums';
|
|
2
1
|
import { ContinuationToken } from '@streamscloud/kit/core';
|
|
3
2
|
import { CursorDataLoader } from '@streamscloud/kit/core/data-loaders';
|
|
4
|
-
const SUPPORTED_POST_TYPES = [
|
|
3
|
+
const SUPPORTED_POST_TYPES = ['ARTICLE', 'MEDIA', 'SHORT_VIDEO', 'VIDEO'];
|
|
5
4
|
export class FeedProvidersGenerator {
|
|
6
5
|
dataProvider;
|
|
7
6
|
constructor(dataProvider) {
|
|
@@ -4,7 +4,7 @@ import type { PostManagementActions, PostPlayerModel, PostsPlayerProps } from '.
|
|
|
4
4
|
import type { ICloseOrchestrator } from '../../../ui/player/close-orchestrator';
|
|
5
5
|
import { MediaCenterContentHandler, MediaCenterSettingsHandler } from '../handlers';
|
|
6
6
|
import type { PostsFeedFilter, PostsFeedProviderInit } from './types';
|
|
7
|
-
import {
|
|
7
|
+
import type { IPlayerBuffer, IPlayerDataProvider } from '@streamscloud/kit/ui/player/providers';
|
|
8
8
|
export declare class PostsFeedHandler {
|
|
9
9
|
private _state;
|
|
10
10
|
private _providersGenerator;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { PostType } from '../../..';
|
|
2
1
|
import { MediaCenterContentHandler, MediaCenterSettingsHandler } from '../handlers';
|
|
3
2
|
import { FeedProvidersGenerator } from './feed-providers-generator';
|
|
4
3
|
import { Utils } from '@streamscloud/kit/core/utils';
|
|
@@ -154,7 +153,7 @@ export class PostsFeedHandler {
|
|
|
154
153
|
// Unpublished posts never affect the feed
|
|
155
154
|
return false;
|
|
156
155
|
}
|
|
157
|
-
if (post.postType ===
|
|
156
|
+
if (post.postType === 'MOMENT') {
|
|
158
157
|
// Moments are processed separately
|
|
159
158
|
return false;
|
|
160
159
|
}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
<script lang="ts">import {
|
|
2
|
-
import { AdCard } from '../../ads/ad-card';
|
|
1
|
+
<script lang="ts">import { AdCard } from '../../ads/ad-card';
|
|
3
2
|
import { PostModel } from '../model';
|
|
4
3
|
import { ProductCard } from '../../products/product-card';
|
|
5
4
|
let { model, trackingParams: externalTrackingParams, on } = $props();
|
|
@@ -7,7 +6,7 @@ const trackingParams = $derived.by(() => {
|
|
|
7
6
|
if (externalTrackingParams || externalTrackingParams === false) {
|
|
8
7
|
return externalTrackingParams;
|
|
9
8
|
}
|
|
10
|
-
if (model.postType ===
|
|
9
|
+
if (model.postType === 'SHORT_VIDEO') {
|
|
11
10
|
return { shortVideoId: model.id };
|
|
12
11
|
}
|
|
13
12
|
return false;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { PostType } from '../../core/enums';
|
|
1
|
+
import type { PostType } from '../../core/enums';
|
|
2
2
|
import { PostViewerMediaModel } from './post-media-model.svelte';
|
|
3
3
|
import type { IPostModel, IPostAdCardModel, IPostHeadingModel, IPostProductCardModel } from './types';
|
|
4
4
|
export declare class PostModel {
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
<script lang="ts">import {
|
|
2
|
-
import { enrichAdLinkWithTracking, enrichProductLinkWithTracking } from '../../marketing-tracking';
|
|
1
|
+
<script lang="ts">import { enrichAdLinkWithTracking, enrichProductLinkWithTracking } from '../../marketing-tracking';
|
|
3
2
|
import { PostModel } from '../model';
|
|
4
3
|
import { toPriceRepresentation } from '../../products/price-helper';
|
|
5
4
|
import { PostViewerUiManager } from './ui-manager.svelte';
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
<script lang="ts">import {
|
|
2
|
-
import { PostModel } from '../model';
|
|
1
|
+
<script lang="ts">import { PostModel } from '../model';
|
|
3
2
|
import { default as AttachmentsHorizontal } from './attachments-horizontal.svelte';
|
|
4
3
|
import { default as Heading } from './heading.svelte';
|
|
5
4
|
import { default as PostMedia } from './media/post-media.svelte';
|
|
@@ -18,7 +17,7 @@ const trackingParams = $derived.by(() => {
|
|
|
18
17
|
if (externalTrackingParams || externalTrackingParams === false) {
|
|
19
18
|
return externalTrackingParams;
|
|
20
19
|
}
|
|
21
|
-
if (model.postType ===
|
|
20
|
+
if (model.postType === 'SHORT_VIDEO') {
|
|
22
21
|
return { shortVideoId: model.id };
|
|
23
22
|
}
|
|
24
23
|
return false;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { MediaType, PostType } from '../../core/enums';
|
|
2
1
|
import { getMediaItemImageUrl } from '../../core/media';
|
|
3
2
|
import { shouldUseSalePrice } from '../../products/price-helper';
|
|
4
3
|
export const mapToPostModel = (payload) => {
|
|
@@ -29,15 +28,15 @@ export const mapToPostModel = (payload) => {
|
|
|
29
28
|
const mapToPostType = (payload) => {
|
|
30
29
|
switch (true) {
|
|
31
30
|
case !!payload.shortVideoData:
|
|
32
|
-
return
|
|
31
|
+
return 'SHORT_VIDEO';
|
|
33
32
|
case !!payload.momentData:
|
|
34
|
-
return
|
|
33
|
+
return 'MOMENT';
|
|
35
34
|
case !!payload.articleData:
|
|
36
|
-
return
|
|
35
|
+
return 'ARTICLE';
|
|
37
36
|
case !!payload.videoData:
|
|
38
|
-
return
|
|
37
|
+
return 'VIDEO';
|
|
39
38
|
case !!payload.mediaData:
|
|
40
|
-
return
|
|
39
|
+
return 'MEDIA';
|
|
41
40
|
default:
|
|
42
41
|
return null;
|
|
43
42
|
}
|
|
@@ -56,7 +55,7 @@ const extractPostText = (payload) => {
|
|
|
56
55
|
};
|
|
57
56
|
const mapToPostViewerMediaModel = (payload) => {
|
|
58
57
|
return payload.media.map((i) => {
|
|
59
|
-
return i.type ===
|
|
58
|
+
return i.type === 'IMAGE'
|
|
60
59
|
? { isImage: true, url: i.url }
|
|
61
60
|
: {
|
|
62
61
|
isImage: false,
|
|
@@ -1,8 +1,13 @@
|
|
|
1
1
|
<script lang="ts">import { CloseOrchestrator } from '../../ui/player/close-orchestrator';
|
|
2
2
|
import { createShadowRoot } from '../../ui/shadow-dom';
|
|
3
|
+
import { PostsPlayerHostSettings } from './posts-player-host-settings.svelte';
|
|
3
4
|
import { default as PostsPlayerProxy } from './posts-player-proxy.svelte';
|
|
4
|
-
import { mount, unmount } from 'svelte';
|
|
5
|
+
import { mount, unmount, untrack } from 'svelte';
|
|
5
6
|
let { dataProvider, socialInteractionsHandler, sharingHandler, playerSettings, analyticsHandler, on } = $props();
|
|
7
|
+
const settingsHolder = untrack(() => new PostsPlayerHostSettings(playerSettings));
|
|
8
|
+
$effect(() => {
|
|
9
|
+
settingsHolder.update(playerSettings);
|
|
10
|
+
});
|
|
6
11
|
const initHost = (node) => {
|
|
7
12
|
const shadowRoot = createShadowRoot(node);
|
|
8
13
|
const mounted = mount(PostsPlayerProxy, {
|
|
@@ -11,7 +16,7 @@ const initHost = (node) => {
|
|
|
11
16
|
dataProvider,
|
|
12
17
|
socialInteractionsHandler,
|
|
13
18
|
sharingHandler,
|
|
14
|
-
playerSettings,
|
|
19
|
+
playerSettings: settingsHolder,
|
|
15
20
|
analyticsHandler,
|
|
16
21
|
closeOrchestrator: new CloseOrchestrator({
|
|
17
22
|
closeFn: async () => {
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import type { ThemeValue } from '../../core/theme';
|
|
2
|
+
import type { AppLocaleValue } from '@streamscloud/kit/core/locale';
|
|
3
|
+
export declare class PostsPlayerHostSettings {
|
|
4
|
+
locale: AppLocaleValue | undefined;
|
|
5
|
+
showStreamsCloudWatermark: boolean | undefined;
|
|
6
|
+
disableBackground: boolean | undefined;
|
|
7
|
+
theme: ThemeValue | undefined;
|
|
8
|
+
constructor(init: {
|
|
9
|
+
locale?: AppLocaleValue;
|
|
10
|
+
showStreamsCloudWatermark?: boolean;
|
|
11
|
+
disableBackground?: boolean;
|
|
12
|
+
theme?: ThemeValue;
|
|
13
|
+
} | undefined);
|
|
14
|
+
update: (data: {
|
|
15
|
+
locale?: AppLocaleValue;
|
|
16
|
+
showStreamsCloudWatermark?: boolean;
|
|
17
|
+
disableBackground?: boolean;
|
|
18
|
+
theme?: ThemeValue;
|
|
19
|
+
} | undefined) => void;
|
|
20
|
+
}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export class PostsPlayerHostSettings {
|
|
2
|
+
locale = $state();
|
|
3
|
+
showStreamsCloudWatermark = $state();
|
|
4
|
+
disableBackground = $state();
|
|
5
|
+
theme = $state();
|
|
6
|
+
constructor(init) {
|
|
7
|
+
this.update(init);
|
|
8
|
+
}
|
|
9
|
+
update = (data) => {
|
|
10
|
+
this.locale = data?.locale;
|
|
11
|
+
this.showStreamsCloudWatermark = data?.showStreamsCloudWatermark;
|
|
12
|
+
this.disableBackground = data?.disableBackground;
|
|
13
|
+
this.theme = data?.theme;
|
|
14
|
+
};
|
|
15
|
+
}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
<script lang="ts">import {
|
|
2
|
-
import { PostAttachments } from '../attachments';
|
|
1
|
+
<script lang="ts">import { PostAttachments } from '../attachments';
|
|
3
2
|
import { PostActionsGenerator } from '../controls';
|
|
4
3
|
import { getPostCoverImage, PostModel } from '../model';
|
|
5
4
|
import { PostViewer } from '../post-viewer';
|
|
@@ -57,7 +56,7 @@ const contentPlayerConfig = untrack(() => new PlayerConfig({
|
|
|
57
56
|
if (on?.backgroundImageLoaded) {
|
|
58
57
|
on.backgroundImageLoaded(getPostCoverImage(post));
|
|
59
58
|
}
|
|
60
|
-
if (post.postType ===
|
|
59
|
+
if (post.postType === 'SHORT_VIDEO') {
|
|
61
60
|
analyticsHandler?.trackShortVideoView(id);
|
|
62
61
|
}
|
|
63
62
|
else if (post.postType) {
|
|
@@ -73,12 +72,12 @@ const postActionsGenerator = untrack(() => new PostActionsGenerator({
|
|
|
73
72
|
on: { attachmentClicked: () => (contentPlayerConfig.uiManager.attachmentsCollapsed = !contentPlayerConfig.uiManager.attachmentsCollapsed) }
|
|
74
73
|
}));
|
|
75
74
|
const onProductClick = (id, postId) => {
|
|
76
|
-
if (getLoadedItemById(postId)?.postType ===
|
|
75
|
+
if (getLoadedItemById(postId)?.postType === 'SHORT_VIDEO') {
|
|
77
76
|
analyticsHandler?.trackShortVideoProductClick(id, postId);
|
|
78
77
|
}
|
|
79
78
|
};
|
|
80
79
|
const onProductImpression = (id, postId) => {
|
|
81
|
-
if (getLoadedItemById(postId)?.postType ===
|
|
80
|
+
if (getLoadedItemById(postId)?.postType === 'SHORT_VIDEO') {
|
|
82
81
|
analyticsHandler?.trackShortVideoProductImpression(id, postId);
|
|
83
82
|
}
|
|
84
83
|
};
|
|
@@ -104,7 +103,7 @@ const currentItemActions = $derived.by(() => {
|
|
|
104
103
|
const postModel = itemAsPostModel(buffer.current);
|
|
105
104
|
const handler = postActionsGenerator.getPostActionsHandler(postModel);
|
|
106
105
|
result.push(...handler.actions);
|
|
107
|
-
if (managementActions?.editPost && postModel.postType !==
|
|
106
|
+
if (managementActions?.editPost && postModel.postType !== 'ARTICLE') {
|
|
108
107
|
result.push({
|
|
109
108
|
icon: IconEdit,
|
|
110
109
|
callback: async () => {
|
|
@@ -112,7 +111,7 @@ const currentItemActions = $derived.by(() => {
|
|
|
112
111
|
}
|
|
113
112
|
});
|
|
114
113
|
}
|
|
115
|
-
if (managementActions?.editArticle && postModel.postType ===
|
|
114
|
+
if (managementActions?.editArticle && postModel.postType === 'ARTICLE' && buffer.current.articleId) {
|
|
116
115
|
result.push({
|
|
117
116
|
icon: IconEdit,
|
|
118
117
|
callback: async () => {
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { Currency } from '../core/enums';
|
|
2
1
|
import { Utils } from '@streamscloud/kit/core/utils';
|
|
3
2
|
export const toPriceRepresentation = (data) => {
|
|
4
3
|
const { amount, currency, options } = data;
|
|
@@ -52,9 +51,9 @@ export const toPriceRepresentation = (data) => {
|
|
|
52
51
|
}
|
|
53
52
|
};
|
|
54
53
|
const currencyDefaults = {
|
|
55
|
-
[
|
|
56
|
-
[
|
|
57
|
-
[
|
|
54
|
+
['NOK']: { symbol: 'kr', code: 'NOK', missingFractionPlaceholder: '-' },
|
|
55
|
+
['USD']: { symbol: '$', code: 'USD' },
|
|
56
|
+
['EUR']: { symbol: '€', code: 'EUR' }
|
|
58
57
|
};
|
|
59
58
|
const getDecimalSeparator = (locale) => {
|
|
60
59
|
const nf = new Intl.NumberFormat(locale);
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import type { IPostModel } from '../../../posts/model';
|
|
2
2
|
import type { StreamLayoutShortVideoModel } from '../models/stream-layout-short-video-model';
|
|
3
3
|
export declare const mapToPostModel: (model: StreamLayoutShortVideoModel) => IPostModel;
|
|
@@ -1,13 +1,9 @@
|
|
|
1
|
-
import { MediaType, PostType } from '../../../core/enums';
|
|
2
|
-
import {} from '../../../posts/model';
|
|
3
1
|
export const mapToPostModel = (model) => {
|
|
4
2
|
return {
|
|
5
3
|
id: model.id,
|
|
6
|
-
postType:
|
|
4
|
+
postType: 'SHORT_VIDEO',
|
|
7
5
|
media: [
|
|
8
|
-
model.media.type ===
|
|
9
|
-
? { isImage: true, url: model.media.url }
|
|
10
|
-
: { isImage: false, url: model.media.url, thumbnailUrl: model.media.thumbnailUrl }
|
|
6
|
+
model.media.type === 'IMAGE' ? { isImage: true, url: model.media.url } : { isImage: false, url: model.media.url, thumbnailUrl: model.media.thumbnailUrl }
|
|
11
7
|
],
|
|
12
8
|
mediaFit: 'cover',
|
|
13
9
|
kicker: null,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
export {};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { AdType,
|
|
1
|
+
import type { AdType, Currency } from '../../../core/enums';
|
|
2
2
|
import type { StreamLayoutMediaItemModel } from './stream-layout-media-item-model';
|
|
3
3
|
import type { StreamLayoutPostHeaderModel } from './stream-layout-post-header-model';
|
|
4
4
|
export type StreamLayoutShortVideoModel = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
export {};
|
|
@@ -1,8 +1,13 @@
|
|
|
1
1
|
<script lang="ts">import { CloseOrchestrator } from '../../ui/player/close-orchestrator';
|
|
2
2
|
import { createShadowRoot } from '../../ui/shadow-dom';
|
|
3
|
+
import { StreamsPlayerHostSettings } from './streams-player-host-settings.svelte';
|
|
3
4
|
import { default as StreamsPlayerProxy } from './streams-player-proxy.svelte';
|
|
4
|
-
import { mount, unmount } from 'svelte';
|
|
5
|
+
import { mount, unmount, untrack } from 'svelte';
|
|
5
6
|
let { dataProvider, postSocialInteractionsHandler, sharingHandler, amplificationParameters, playerSettings, analyticsHandler, on } = $props();
|
|
7
|
+
const settingsHolder = untrack(() => new StreamsPlayerHostSettings(playerSettings));
|
|
8
|
+
$effect(() => {
|
|
9
|
+
settingsHolder.update(playerSettings);
|
|
10
|
+
});
|
|
6
11
|
const initHost = (node) => {
|
|
7
12
|
const shadowRoot = createShadowRoot(node);
|
|
8
13
|
const mounted = mount(StreamsPlayerProxy, {
|
|
@@ -13,7 +18,7 @@ const initHost = (node) => {
|
|
|
13
18
|
sharingHandler,
|
|
14
19
|
analyticsHandler,
|
|
15
20
|
amplificationParameters,
|
|
16
|
-
playerSettings,
|
|
21
|
+
playerSettings: settingsHolder,
|
|
17
22
|
closeOrchestrator: new CloseOrchestrator({
|
|
18
23
|
closeFn: async () => {
|
|
19
24
|
await unmount(mounted);
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import type { ThemeValue } from '../../core/theme';
|
|
2
|
+
import type { AppLocaleValue } from '@streamscloud/kit/core/locale';
|
|
3
|
+
export declare class StreamsPlayerHostSettings {
|
|
4
|
+
locale: AppLocaleValue | undefined;
|
|
5
|
+
showStreamsCloudWatermark: boolean | undefined;
|
|
6
|
+
disableBackground: boolean | undefined;
|
|
7
|
+
theme: ThemeValue | undefined;
|
|
8
|
+
constructor(init: {
|
|
9
|
+
locale?: AppLocaleValue;
|
|
10
|
+
showStreamsCloudWatermark?: boolean;
|
|
11
|
+
disableBackground?: boolean;
|
|
12
|
+
theme?: ThemeValue;
|
|
13
|
+
} | undefined);
|
|
14
|
+
update: (data: {
|
|
15
|
+
locale?: AppLocaleValue;
|
|
16
|
+
showStreamsCloudWatermark?: boolean;
|
|
17
|
+
disableBackground?: boolean;
|
|
18
|
+
theme?: ThemeValue;
|
|
19
|
+
} | undefined) => void;
|
|
20
|
+
}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export class StreamsPlayerHostSettings {
|
|
2
|
+
locale = $state();
|
|
3
|
+
showStreamsCloudWatermark = $state();
|
|
4
|
+
disableBackground = $state();
|
|
5
|
+
theme = $state();
|
|
6
|
+
constructor(init) {
|
|
7
|
+
this.update(init);
|
|
8
|
+
}
|
|
9
|
+
update = (data) => {
|
|
10
|
+
this.locale = data?.locale;
|
|
11
|
+
this.showStreamsCloudWatermark = data?.showStreamsCloudWatermark;
|
|
12
|
+
this.disableBackground = data?.disableBackground;
|
|
13
|
+
this.theme = data?.theme;
|
|
14
|
+
};
|
|
15
|
+
}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
<script lang="ts">import {
|
|
2
|
-
import { getMediaItemImageUrl } from '../../core/media';
|
|
1
|
+
<script lang="ts">import { getMediaItemImageUrl } from '../../core/media';
|
|
3
2
|
import { Image } from '@streamscloud/kit/ui/image';
|
|
4
3
|
import { ProportionalContainer } from '@streamscloud/kit/ui/proportional-container';
|
|
5
4
|
import { Video } from '@streamscloud/kit/ui/video';
|
|
@@ -16,7 +15,7 @@ const parsedRatio = $derived.by(() => {
|
|
|
16
15
|
}
|
|
17
16
|
else {
|
|
18
17
|
if (typeof ratio !== 'number') {
|
|
19
|
-
return ratio ===
|
|
18
|
+
return ratio === 'W16H9' ? 16 / 9 : 4 / 3;
|
|
20
19
|
}
|
|
21
20
|
else {
|
|
22
21
|
return ratio;
|
|
@@ -27,7 +26,7 @@ const parsedRatio = $derived.by(() => {
|
|
|
27
26
|
|
|
28
27
|
{#if media}
|
|
29
28
|
{#snippet mediaView()}
|
|
30
|
-
{#if media.type ===
|
|
29
|
+
{#if media.type === 'IMAGE'}
|
|
31
30
|
<div class="media-item-view__image" onclick={handleClick} onkeydown={() => {}} role="none">
|
|
32
31
|
<Image src={getMediaItemImageUrl(media)} />
|
|
33
32
|
</div>
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
<script lang="ts">import {
|
|
2
|
-
import {} from '../../core/media';
|
|
1
|
+
<script lang="ts">import {} from '../../core/media';
|
|
3
2
|
import { MediaItemView } from '../media-item-view';
|
|
4
3
|
import { GalleryLayout } from './types';
|
|
5
4
|
let { media, singleImageRatio = 0, inert = false, on } = $props();
|
|
@@ -24,12 +23,12 @@ const handleGalleryItemClick = (index) => {
|
|
|
24
23
|
}
|
|
25
24
|
/*const toMediaViewerItemType = (type: MediaType) => {
|
|
26
25
|
switch (type) {
|
|
27
|
-
case
|
|
26
|
+
case 'IMAGE':
|
|
28
27
|
return MediaViewerItemType.Image;
|
|
29
|
-
case
|
|
30
|
-
case
|
|
28
|
+
case 'VIDEO':
|
|
29
|
+
case 'SHORT_VIDEO':
|
|
31
30
|
return MediaViewerItemType.Video;
|
|
32
|
-
case
|
|
31
|
+
case 'AUDIO':
|
|
33
32
|
return MediaViewerItemType.Audio;
|
|
34
33
|
default:
|
|
35
34
|
Utils.assertUnreachable(type);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { MediaFormat } from '../../core/enums';
|
|
1
|
+
import type { MediaFormat } from '../../core/enums';
|
|
2
2
|
import { type MediaItemWithMetadataModel } from '../../core/media';
|
|
3
3
|
type Props = {
|
|
4
4
|
media: Array<MediaItemWithMetadataModel> | ReadonlyArray<MediaItemWithMetadataModel>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@streamscloud/embeddable",
|
|
3
|
-
"version": "16.0.
|
|
3
|
+
"version": "16.0.7-1772032308956",
|
|
4
4
|
"author": "StreamsCloud",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
"pack": "npm run build && npm pack",
|
|
17
17
|
"preview": "vite preview",
|
|
18
18
|
"check": "svelte-check --tsconfig ./tsconfig.app.json && tsc -p tsconfig.node.json",
|
|
19
|
+
"check:strict": "svelte-check --tsconfig ./tsconfig.app.json --fail-on-warnings --output machine && eslint . --format codeframe --max-warnings 0 && prettier --check --plugin prettier-plugin-svelte --cache .",
|
|
19
20
|
"uad": "graphql-codegen --config codegen.yml && prettier --write src/**/*.generated.ts src/gql/*",
|
|
20
21
|
"uad-types-only": "graphql-codegen --config codegen.types-only.yml && prettier --write src/gql/*",
|
|
21
22
|
"lint": "prettier --check --plugin prettier-plugin-svelte . && eslint .",
|
|
@@ -33,6 +34,14 @@
|
|
|
33
34
|
"types": "./dist/index.d.ts",
|
|
34
35
|
"svelte": "./dist/index.js"
|
|
35
36
|
},
|
|
37
|
+
"./article": {
|
|
38
|
+
"types": "./dist/articles/article/index.d.ts",
|
|
39
|
+
"svelte": "./dist/articles/article/index.js"
|
|
40
|
+
},
|
|
41
|
+
"./article-viewer": {
|
|
42
|
+
"types": "./dist/articles/article-viewer/index.d.ts",
|
|
43
|
+
"svelte": "./dist/articles/article-viewer/index.js"
|
|
44
|
+
},
|
|
36
45
|
"./external-api": {
|
|
37
46
|
"types": "./dist/external-api/index.d.ts",
|
|
38
47
|
"svelte": "./dist/external-api/index.js"
|
|
@@ -133,7 +142,7 @@
|
|
|
133
142
|
}
|
|
134
143
|
},
|
|
135
144
|
"peerDependencies": {
|
|
136
|
-
"@streamscloud/kit": "^0.1.
|
|
145
|
+
"@streamscloud/kit": "^0.1.12",
|
|
137
146
|
"@streamscloud/streams-analytics-collector": "^4.0.1",
|
|
138
147
|
"svelte": "^5.51.0"
|
|
139
148
|
},
|
|
@@ -149,7 +158,7 @@
|
|
|
149
158
|
"@graphql-codegen/typescript": "^5.0.7",
|
|
150
159
|
"@graphql-codegen/typescript-operations": "^5.0.7",
|
|
151
160
|
"@graphql-typed-document-node/core": "^3.2.0",
|
|
152
|
-
"@streamscloud/kit": "^0.1.
|
|
161
|
+
"@streamscloud/kit": "^0.1.12-1772032209109",
|
|
153
162
|
"@streamscloud/streams-analytics-collector": "^4.0.1",
|
|
154
163
|
"@sveltejs/package": "^2.5.7",
|
|
155
164
|
"@sveltejs/vite-plugin-svelte": "^6.2.4",
|