@streamscloud/embeddable 3.2.7 → 3.3.0

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

@@ -11,12 +11,13 @@ const localization = $derived(new ShortVideoDetailsLocalization(localizationInit
   <div class="short-video-details" transition:slideHorizontally|local data-theme="dark">
     <div class="short-video-details__sliding-container">
       <div class="short-video-details__content">
-        <div class="short-video-details__heading">
-          <ShortVideoHeading
-            model={shortVideo.heading}
-            localization={{ viewsCount: localization.viewsCount, timeAgoLocalization: localization.timeAgoLocalization }} />
-        </div>
-
+        {#if shortVideo.heading}
+          <div class="short-video-details__heading">
+            <ShortVideoHeading
+              model={shortVideo.heading}
+              localization={{ viewsCount: localization.viewsCount, timeAgoLocalization: localization.timeAgoLocalization }} />
+          </div>
+        {/if}
         {#if shortVideo.text}
           <p class="short-video-details__text">
             {shortVideo.text}

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

@@ -4,9 +4,11 @@ let { model, localization } = $props();
 </script>
 
 <div class="short-video-description">
-  <div class="short-video-description__heading">
-    <ShortVideoHeading model={model.heading} localization={localization} />
-  </div>
+  {#if model.heading}
+    <div class="short-video-description__heading">
+      <ShortVideoHeading model={model.heading} localization={localization} />
+    </div>
+  {/if}
   <div class="short-video-description__text">
     {#if model.text}
       <LineClamp value={model.text} maxLines={2} />

package/dist/short-videos/short-video-viewer/types.d.ts

@@ -10,7 +10,7 @@ export type ShortVideoViewerModel = {
         thumbnailUrl: string;
     };
     text?: string | null;
-    heading: ShortVideoViewerHeadingModel;
+    heading: ShortVideoViewerHeadingModel | null;
     products: ShortVideoViewerProductModel[];
     ad: ShortVideoViewerAdModel | null;
 };

package/dist/streams/layout/models/mapper.js

@@ -10,7 +10,7 @@ export const mapToShortVideoViewerModel = (model) => {
                 thumbnailUrl: model.media.thumbnailUrl
             },
         text: model.text,
-        heading: {
+        heading: model.header && {
             image: model.header.sourceImage,
             name: model.header.sourceName,
             displayDate: model.header.postDisplayDate,

package/dist/streams/layout/models/stream-layout-short-video-model.d.ts

@@ -5,7 +5,7 @@ export type StreamLayoutShortVideoModel = {
     id: string;
     media: StreamLayoutMediaItemModel;
     text: string | null;
-    header: StreamLayoutPostHeaderModel;
+    header: StreamLayoutPostHeaderModel | null;
     enableSocialInteractions: boolean;
     bookmarksCount: number;
     products: StreamLayoutShortVideoProductModel[];

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

@@ -8,7 +8,7 @@ export declare class StreamPlayerBuffer implements IPlayerBuffer<StreamPageViewe
     readonly canLoadNext: boolean;
     readonly canLoadPrevious: boolean;
     readonly navigationDisabled: boolean;
-    readonly animationDuration = 1200;
+    readonly animationDuration = 300;
     private _pagesLoader;
     private _currentIndex;
     private _loaded;

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

@@ -12,7 +12,7 @@ export class StreamPlayerBuffer {
     canLoadNext = $derived(this.currentIndex < this.loaded.length - 1);
     canLoadPrevious = $derived(this.currentIndex > 0);
     navigationDisabled = $derived(!this.canLoadNext && !this.canLoadPrevious);
-    animationDuration = 1200;
+    animationDuration = 300;
     _pagesLoader;
     _currentIndex = $state(-1);
     _loaded = $state.raw([]);
@@ -23,7 +23,7 @@ export class StreamPlayerBuffer {
                 const payload = await graphql
                     .query(GetStreamPagesDocument, {
                     input: {
-                        limit: 2,
+                        limit: 10,
                         continuationToken,
                         filter: {
                             streamId

package/dist/ui/player/cmp.player-slider.svelte

@@ -5,7 +5,7 @@ let { buffer, children, on } = $props();
 let slidesRef;
 let sliderHeight = $state(0);
 let swipeTransition = $state(0);
-let cssAnimationDuration = $state(buffer.animationDuration * 0.75);
+let cssAnimationDuration = $state(buffer.animationDuration);
 let resizeObserver;
 let activeIndex = $state.raw(buffer.currentIndex);
 const actualTransition = $derived(-sliderHeight * activeIndex);
@@ -81,7 +81,7 @@ onMount(() => {
         if (e.deltaY < 0 && buffer.canLoadPrevious) {
             buffer.loadPrevious();
         }
-    }, buffer.animationDuration + 250));
+    }, buffer.animationDuration));
     slidesRef.addEventListener('transitionend', (e) => {
         if (e.target !== slidesRef) {
             return;

package/dist/ui/player/player-buffer.svelte.d.ts

@@ -8,7 +8,7 @@ export declare class PlayerBuffer<T extends {
     readonly canLoadNext: boolean;
     readonly canLoadPrevious: boolean;
     readonly navigationDisabled: boolean;
-    readonly animationDuration = 1200;
+    readonly animationDuration = 300;
     private _currentIndex;
     private _loaded;
     private loadMoreFn;

package/dist/ui/player/player-buffer.svelte.js

@@ -6,7 +6,7 @@ export class PlayerBuffer {
     canLoadNext = $derived(this.currentIndex < this.loaded.length - 1);
     canLoadPrevious = $derived(this.currentIndex > 0);
     navigationDisabled = $derived(!this.canLoadNext && !this.canLoadPrevious);
-    animationDuration = 1200;
+    animationDuration = 300;
     _currentIndex = $state(-1);
     _loaded = $state.raw([]);
     loadMoreFn;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamscloud/embeddable",
-  "version": "3.2.7",
+  "version": "3.3.0",
   "author": "StreamsCloud",
   "repository": "https://github.com/StreamsCloud/streamscloud-frontend-packages.git",
   "type": "module",