@remotion/player 3.2.35 → 3.2.37

package/dist/Thumbnail.d.ts

@@ -0,0 +1,16 @@
+import type { CSSProperties } from 'react';
+import type { CompProps } from 'remotion';
+import type { PropsIfHasProps } from './utils/props-if-has-props';
+declare type ThumbnailProps<T> = PropsIfHasProps<T> & CompProps<T> & {
+    targetHeight: number;
+    targetWidth: number;
+    frameToDisplay: number;
+    style?: CSSProperties;
+    durationInFrames: number;
+    compositionWidth: number;
+    compositionHeight: number;
+    inputProps: number;
+    fps: number;
+};
+export declare const Thumbnail: <T>({ targetWidth, targetHeight, frameToDisplay, style, inputProps, compositionHeight, compositionWidth, durationInFrames, fps, ...componentProps }: ThumbnailProps<T>) => JSX.Element;
+export {};

package/dist/Thumbnail.js

@@ -0,0 +1,83 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Thumbnail = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const remotion_1 = require("remotion");
+const Thumbnail = ({ targetWidth, targetHeight, frameToDisplay, style, inputProps, compositionHeight, compositionWidth, durationInFrames, fps, ...componentProps }) => {
+    const [thumbnailId] = (0, react_1.useState)(() => String((0, remotion_1.random)(null)));
+    const container = (0, react_1.useMemo)(() => {
+        return {
+            width: targetWidth,
+            height: targetHeight,
+            backgroundColor: 'rgba(0, 0, 0, 0.4)',
+            display: 'flex',
+            justifyContent: 'center',
+            alignItems: 'center',
+            ...style,
+        };
+    }, [targetHeight, targetWidth, style]);
+    const timelineState = (0, react_1.useMemo)(() => {
+        return {
+            playing: false,
+            frame: frameToDisplay,
+            rootId: thumbnailId,
+            imperativePlaying: {
+                current: false,
+            },
+            playbackRate: 1,
+            setPlaybackRate: () => {
+                throw new Error('thumbnail');
+            },
+            audioAndVideoTags: { current: [] },
+        };
+    }, [frameToDisplay, thumbnailId]);
+    const props = (0, react_1.useMemo)(() => {
+        return (inputProps !== null && inputProps !== void 0 ? inputProps : {});
+    }, [inputProps]);
+    const Component = remotion_1.Internals.useLazyComponent(componentProps);
+    const compositionManagerContext = (0, react_1.useMemo)(() => {
+        return {
+            compositions: [
+                {
+                    component: Component,
+                    durationInFrames,
+                    height: compositionHeight,
+                    width: compositionWidth,
+                    fps,
+                    id: 'player-comp',
+                    props: inputProps,
+                    nonce: 777,
+                    scale: 1,
+                    folderName: null,
+                    defaultProps: undefined,
+                    parentFolderName: null,
+                },
+            ],
+            folders: [],
+            registerFolder: () => undefined,
+            unregisterFolder: () => undefined,
+            currentComposition: 'player-comp',
+            registerComposition: () => undefined,
+            registerSequence: () => undefined,
+            sequences: [],
+            setCurrentComposition: () => undefined,
+            unregisterComposition: () => undefined,
+            unregisterSequence: () => undefined,
+            registerAsset: () => undefined,
+            unregisterAsset: () => undefined,
+            currentCompositionMetadata: null,
+            setCurrentCompositionMetadata: () => undefined,
+            assets: [],
+        };
+    }, [
+        Component,
+        durationInFrames,
+        compositionHeight,
+        compositionWidth,
+        fps,
+        inputProps,
+    ]);
+    return ((0, jsx_runtime_1.jsx)(remotion_1.Internals.CanUseRemotionHooksProvider, { children: (0, jsx_runtime_1.jsx)("div", { style: container, children: (0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: null, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.Timeline.TimelineContext.Provider, { value: timelineState, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CompositionManager.Provider, { value: compositionManagerContext, children: (0, jsx_runtime_1.jsx)(Component, { ...props }) }) }) }) }) }));
+};
+exports.Thumbnail = Thumbnail;

package/dist/utils/props-if-has-props.d.ts

@@ -0,0 +1,5 @@
+export declare type PropsIfHasProps<Props> = {} extends Props ? {
+    inputProps?: Props;
+} : {
+    inputProps: Props;
+};

package/dist/utils/props-if-has-props.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/player",
-	"version": "3.2.35",
+	"version": "3.2.37",
 	"description": "Remotion Player",
 	"main": "dist/index.js",
 	"sideEffects": false,
@@ -27,7 +27,7 @@
 	],
 	"license": "SEE LICENSE IN LICENSE.md",
 	"dependencies": {
-		"remotion": "3.2.35"
+		"remotion": "3.2.37"
 	},
 	"peerDependencies": {
 		"react": ">=16.8.0",
@@ -62,5 +62,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "1bf079a1df57808460b1dd87de07d698388598da"
+	"gitHead": "b4b40f35b14bac31fbee5d35b95e7fad9f464c94"
 }