remotion 3.3.2 → 3.3.4

package/.turbo/turbo-build.log

@@ -1,4 +1,4 @@
 
-> remotion@3.3.1 build /Users/jonathanburger/remotion/packages/core
+> remotion@3.3.3 build /Users/jonathanburger/remotion/packages/core
 > tsc -d
 

package/dist/Sequence.d.ts

@@ -7,7 +7,7 @@ export declare type SequenceContextType = {
     id: string;
 };
 export declare const SequenceContext: React.Context<SequenceContextType | null>;
-declare type LayoutAndStyle = {
+export declare type LayoutAndStyle = {
     layout: 'none';
 } | {
     layout?: 'absolute-fill';
@@ -26,4 +26,3 @@ export declare type SequenceProps = {
  * @link https://www.remotion.dev/docs/sequence
  */
 export declare const Sequence: React.ForwardRefExoticComponent<SequenceProps & React.RefAttributes<HTMLDivElement>>;
-export {};

package/dist/loop/index.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
+import type { LayoutAndStyle } from '../Sequence';
 export declare type LoopProps = {
     durationInFrames: number;
     times?: number;
-    layout?: 'absolute-fill' | 'none';
     name?: string;
     children: React.ReactNode;
-};
+} & LayoutAndStyle;
 export declare const Loop: React.FC<LoopProps>;

package/dist/loop/index.js

@@ -5,7 +5,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const Sequence_1 = require("../Sequence");
 const use_video_config_1 = require("../use-video-config");
 const validate_duration_in_frames_1 = require("../validation/validate-duration-in-frames");
-const Loop = ({ durationInFrames, times = Infinity, children, layout, name, }) => {
+const Loop = ({ durationInFrames, times = Infinity, children, name, ...props }) => {
     const { durationInFrames: compDuration } = (0, use_video_config_1.useVideoConfig)();
     (0, validate_duration_in_frames_1.validateDurationInFrames)(durationInFrames, 'of the <Loop /> component');
     if (typeof times !== 'number') {
@@ -19,10 +19,11 @@ const Loop = ({ durationInFrames, times = Infinity, children, layout, name, }) =
     }
     const maxTimes = Math.ceil(compDuration / durationInFrames);
     const actualTimes = Math.min(maxTimes, times);
+    const style = props.layout === 'none' ? undefined : props.style;
     return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: new Array(actualTimes).fill(true).map((_, i) => {
             return ((0, jsx_runtime_1.jsx)(Sequence_1.Sequence
             // eslint-disable-next-line react/no-array-index-key
-            , { durationInFrames: durationInFrames, from: i * durationInFrames, layout: layout, name: name, showLoopTimesInTimeline: actualTimes, showInTimeline: i === 0, children: children }, `loop-${i}`));
+            , { durationInFrames: durationInFrames, from: i * durationInFrames, name: name, showLoopTimesInTimeline: actualTimes, showInTimeline: i === 0, layout: props.layout, style: style, children: children }, `loop-${i}`));
         }) }));
 };
 exports.Loop = Loop;

package/dist/series/index.d.ts

@@ -1,10 +1,10 @@
 import type { FC, PropsWithChildren } from 'react';
-import type { SequenceProps } from '../Sequence';
+import type { LayoutAndStyle, SequenceProps } from '../Sequence';
 declare type SeriesSequenceProps = PropsWithChildren<{
     durationInFrames: number;
     offset?: number;
-} & Pick<SequenceProps, 'layout' | 'name'>>;
-declare const SeriesSequence: ({ children }: SeriesSequenceProps) => JSX.Element;
+} & Pick<SequenceProps, 'layout' | 'name'> & LayoutAndStyle>;
+declare const SeriesSequence: import("react").ForwardRefExoticComponent<SeriesSequenceProps & import("react").RefAttributes<HTMLDivElement>>;
 declare const Series: FC<{
     children: React.ReactNode;
 }> & {

package/dist/series/index.js

@@ -6,10 +6,12 @@ const react_1 = require("react");
 const Sequence_1 = require("../Sequence");
 const validate_duration_in_frames_1 = require("../validation/validate-duration-in-frames");
 const flatten_children_1 = require("./flatten-children");
-const SeriesSequence = ({ children }) => {
+const SeriesSequenceRefForwardingFunction = ({ children }, _ref) => {
+    // Discard ref
     // eslint-disable-next-line react/jsx-no-useless-fragment
     return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
 };
+const SeriesSequence = (0, react_1.forwardRef)(SeriesSequenceRefForwardingFunction);
 const Series = ({ children }) => {
     const childrenValue = (0, react_1.useMemo)(() => {
         let startFrame = 0;
@@ -45,7 +47,7 @@ const Series = ({ children }) => {
             }
             const currentStartFrame = startFrame + offset;
             startFrame += durationInFramesProp + offset;
-            return ((0, jsx_runtime_1.jsx)(Sequence_1.Sequence, { from: currentStartFrame, durationInFrames: durationInFramesProp, ...passedProps, children: child }));
+            return ((0, jsx_runtime_1.jsx)(Sequence_1.Sequence, { from: currentStartFrame, durationInFrames: durationInFramesProp, ...passedProps, ref: castedChild.ref, children: child }));
         });
     }, [children]);
     /* eslint-disable react/jsx-no-useless-fragment */

package/dist/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "3.3.2";
+export declare const VERSION = "3.3.4";

package/dist/version.js

@@ -2,4 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.VERSION = void 0;
 // Automatically generated on publish
-exports.VERSION = '3.3.2';
+exports.VERSION = '3.3.4';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "remotion",
-	"version": "3.3.2",
+	"version": "3.3.4",
 	"description": "Render videos in React",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",
@@ -55,5 +55,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "d7422b5d86e4766a4cdb0bc4e291e462a6bf8bb6"
+	"gitHead": "d5185eb129001bbc65d1edeea0250ee52c351f30"
 }