@remotion/web-renderer 4.0.370 → 4.0.372

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/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "url": "https://github.com/remotion-dev/remotion/tree/main/packages/web-renderer"
4
4
  },
5
5
  "name": "@remotion/web-renderer",
6
- "version": "4.0.370",
6
+ "version": "4.0.372",
7
7
  "main": "dist/index.js",
8
8
  "sideEffects": false,
9
9
  "scripts": {
@@ -14,10 +14,10 @@
14
14
  "author": "Remotion <jonny@remotion.dev>",
15
15
  "license": "UNLICENSED",
16
16
  "dependencies": {
17
- "remotion": "4.0.370"
17
+ "remotion": "4.0.372"
18
18
  },
19
19
  "devDependencies": {
20
- "@remotion/eslint-config-internal": "4.0.370",
20
+ "@remotion/eslint-config-internal": "4.0.372",
21
21
  "eslint": "9.19.0",
22
22
  "react": "19.0.0",
23
23
  "react-dom": "19.0.0"
@@ -1,8 +0,0 @@
1
- import { type ComponentType, type LazyExoticComponent } from 'react';
2
- export declare const renderMediaOnWeb: ({ Component, width, height, fps, durationInFrames, }: {
3
- Component: LazyExoticComponent<ComponentType<Record<string, unknown>>>;
4
- width: number;
5
- height: number;
6
- fps: number;
7
- durationInFrames: number;
8
- }) => Promise<void>;
@@ -1,135 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.renderMediaOnWeb = void 0;
7
- const jsx_runtime_1 = require("react/jsx-runtime");
8
- const client_1 = __importDefault(require("react-dom/client"));
9
- const remotion_1 = require("remotion");
10
- const compose_1 = require("./compose");
11
- const find_canvas_elements_1 = require("./find-canvas-elements");
12
- const wait_for_ready_1 = require("./wait-for-ready");
13
- const renderMediaOnWeb = async ({ Component, width, height, fps, durationInFrames, }) => {
14
- const div = document.createElement('div');
15
- // Match same behavior as renderEntry.tsx
16
- div.style.display = 'flex';
17
- div.style.backgroundColor = 'transparent';
18
- div.style.position = 'absolute';
19
- div.style.width = `${width}px`;
20
- div.style.height = `${height}px`;
21
- document.body.appendChild(div);
22
- // TODO: Hardcoded
23
- const delayRenderTimeoutInMilliseconds = 10000;
24
- if (!client_1.default.createRoot) {
25
- throw new Error('@remotion/web-renderer requires React 18 or higher');
26
- }
27
- // TODO: Env variables
28
- // TODO: Input Props
29
- // TODO: Default props
30
- // TODO: calculateMetadata()
31
- // TODO: getRemotionEnvironment()
32
- // TODO: delayRender()
33
- // TODO: Video config
34
- // TODO: window.remotion_isPlayer
35
- // TODO: Log Level
36
- const compositionManagerContext = {
37
- currentCompositionMetadata: {
38
- durationInFrames,
39
- fps,
40
- height,
41
- width,
42
- props: {},
43
- defaultCodec: null,
44
- defaultOutName: null,
45
- defaultVideoImageFormat: null,
46
- defaultPixelFormat: null,
47
- },
48
- folders: [],
49
- compositions: [
50
- {
51
- // TODO: Make dynamic
52
- id: 'markup',
53
- component: Component,
54
- nonce: 0,
55
- defaultProps: undefined,
56
- folderName: null,
57
- parentFolderName: null,
58
- schema: null,
59
- calculateMetadata: null,
60
- durationInFrames,
61
- fps,
62
- height,
63
- width,
64
- },
65
- ],
66
- canvasContent: {
67
- type: 'composition',
68
- compositionId: 'markup',
69
- },
70
- };
71
- const root = client_1.default.createRoot(div);
72
- root.render((0, jsx_runtime_1.jsx)(remotion_1.Internals.RemotionEnvironmentContext, { value: {
73
- isStudio: false,
74
- isRendering: true,
75
- isPlayer: false,
76
- isReadOnlyStudio: false,
77
- isClientSideRendering: true,
78
- }, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.RemotionRoot
79
- // TODO: Hardcoded
80
- , {
81
- // TODO: Hardcoded
82
- logLevel: "info",
83
- // TODO: Hardcoded
84
- numberOfAudioTags: 0,
85
- // TODO: Hardcoded
86
- onlyRenderComposition: null,
87
- // TODO: Hardcoded
88
- currentCompositionMetadata: {
89
- // TODO: Empty
90
- props: {},
91
- // TODO: Hardcoded
92
- durationInFrames,
93
- // TODO: Hardcoded
94
- fps,
95
- // TODO: Hardcoded
96
- height,
97
- // TODO: Hardcoded
98
- width,
99
- // TODO: Hardcoded
100
- defaultCodec: null,
101
- // TODO: Hardcoded
102
- defaultOutName: null,
103
- // TODO: Hardcoded
104
- defaultVideoImageFormat: null,
105
- // TODO: Hardcoded
106
- defaultPixelFormat: null,
107
- },
108
- // TODO: Hardcoded
109
- audioLatencyHint: "interactive", children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CanUseRemotionHooks, { value: true, children: (0, jsx_runtime_1.jsx)(remotion_1.Internals.CompositionManager.Provider
110
- // TODO: This context is double-wrapped
111
- , {
112
- // TODO: This context is double-wrapped
113
- value: compositionManagerContext, children: (0, jsx_runtime_1.jsx)(Component, {}) }) }) }) }));
114
- await (0, wait_for_ready_1.waitForReady)(delayRenderTimeoutInMilliseconds);
115
- const canvasElements = (0, find_canvas_elements_1.findCanvasElements)(div);
116
- const composed = (0, compose_1.compose)({
117
- composables: canvasElements,
118
- width,
119
- height,
120
- });
121
- const imageData = await composed.convertToBlob({
122
- type: 'image/png',
123
- });
124
- // download image
125
- const blob = new Blob([imageData], { type: 'image/png' });
126
- const url = URL.createObjectURL(blob);
127
- const a = document.createElement('a');
128
- a.href = url;
129
- a.download = 'composed.png';
130
- a.click();
131
- URL.revokeObjectURL(url);
132
- root.unmount();
133
- div.remove();
134
- };
135
- exports.renderMediaOnWeb = renderMediaOnWeb;