transition series

Remotion-app/src/HelloWorld/ImageStream.jsx

@@ -1,8 +1,9 @@
 import {Series} from 'remotion';
 import React from 'react';
 import {staticFile, useVideoConfig, Img} from 'remotion';
+import {slide} from '@remotion/transitions/slide';
 import imageSequences from './Assets/ImageSequences.json';
-import {TransitionSeries} from '@remotion/transitions';
+import {TransitionSeries, linearTiming} from '@remotion/transitions';
 export default function ImageStream() {
 	const {fps} = useVideoConfig();
 	return (
@@ -13,13 +14,19 @@ export default function ImageStream() {
 		>
 			{imageSequences.map((entry, index) => {
 				return (
-					<TransitionSeries.Sequence
-						key={index}
-						from={fps * entry.start}
-						durationInFrames={fps * (entry.end - entry.start)}
-					>
-						<Img src={staticFile(entry.name)} />
-					</TransitionSeries.Sequence>
+					<>
+						<TransitionSeries.Sequence
+							key={index}
+							from={fps * entry.start}
+							durationInFrames={fps * (entry.end - entry.start)}
+						>
+							<Img src={staticFile(entry.name)} />
+						</TransitionSeries.Sequence>
+						<TransitionSeries.Transition
+							presentation={slide()}
+							timing={linearTiming({durationInFrames: 30})}
+						/>
+					</>
 				);
 			})}
 		</TransitionSeries>