@remotion/cli 3.3.25 → 3.3.27

package/dist/config/log.d.ts

@@ -1,3 +1,3 @@
 import type { LogLevel } from '@remotion/renderer';
-export declare const getLogLevel: () => "verbose" | "error" | "info" | "warn";
+export declare const getLogLevel: () => "verbose" | "info" | "warn" | "error";
 export declare const setLogLevel: (newLogLevel: LogLevel) => void;

package/dist/editor/components/NewComposition/RemInput.d.ts

@@ -1,3 +1,5 @@
 import React from 'react';
+declare type Props = React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
 export declare const inputBaseStyle: React.CSSProperties;
-export declare const RemotionInput: (props: React.ClassAttributes<HTMLInputElement> & React.InputHTMLAttributes<HTMLInputElement> & React.RefAttributes<HTMLInputElement | null>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
+export declare const RemotionInput: React.ForwardRefExoticComponent<Pick<Props, "key" | keyof React.InputHTMLAttributes<HTMLInputElement>> & React.RefAttributes<HTMLInputElement>>;
+export {};

package/dist/editor/helpers/colors.d.ts

@@ -12,4 +12,4 @@ export declare const TIMELINE_BACKGROUND = "#111";
 export declare const getBackgroundFromHoverState: ({ selected, hovered, }: {
     selected: boolean;
     hovered: boolean;
-}) => "transparent" | "hsla(0, 0%, 100%, 0.15)" | "hsla(0, 0%, 100%, 0.25)" | "rgba(255, 255, 255, 0.06)";
+}) => "transparent" | "hsla(0, 0%, 100%, 0.25)" | "hsla(0, 0%, 100%, 0.15)" | "rgba(255, 255, 255, 0.06)";

package/dist/event-source-events.d.ts

@@ -1,3 +1,4 @@
+import type { StaticFile } from 'remotion';
 export declare type EventSourceEvent = {
     type: 'new-input-props';
     newProps: object;
@@ -6,4 +7,7 @@ export declare type EventSourceEvent = {
 } | {
     type: 'new-env-variables';
     newEnvVariables: Record<string, string>;
+} | {
+    type: 'new-public-folder';
+    files: StaticFile[];
 };

package/dist/event-source.js

@@ -11,6 +11,9 @@ const openEventSource = () => {
             newEvent.type === 'new-env-variables') {
             window.location.reload();
         }
+        if (newEvent.type === 'new-public-folder') {
+            window.remotion_staticFiles = newEvent.files;
+        }
     });
     source.addEventListener('open', () => {
         var _a;

package/dist/get-cli-options.d.ts

@@ -30,7 +30,7 @@ export declare const getCliOptions: (options: {
     browserExecutable: BrowserExecutable;
     ffmpegExecutable: import("@remotion/renderer").FfmpegExecutable;
     ffprobeExecutable: import("@remotion/renderer").FfmpegExecutable;
-    logLevel: "verbose" | "error" | "info" | "warn";
+    logLevel: "verbose" | "info" | "warn" | "error";
     scale: number;
     chromiumOptions: ChromiumOptions;
     overwrite: boolean;

package/dist/index.d.ts

@@ -88,7 +88,7 @@ export declare const CliInternals: {
         browserExecutable: import("@remotion/renderer").BrowserExecutable;
         ffmpegExecutable: import("@remotion/renderer").FfmpegExecutable;
         ffprobeExecutable: import("@remotion/renderer").FfmpegExecutable;
-        logLevel: "verbose" | "error" | "info" | "warn";
+        logLevel: "verbose" | "info" | "warn" | "error";
         scale: number;
         chromiumOptions: import("@remotion/renderer").ChromiumOptions;
         overwrite: boolean;

package/dist/preview-server/dev-middleware/range-parser.d.ts

@@ -11,5 +11,5 @@ declare type Range = {
 declare type Ranges = Range[] & {
     type?: string;
 };
-export declare function parseRange(size: number, str: string | string[]): -1 | Ranges | -2;
+export declare function parseRange(size: number, str: string | string[]): -2 | -1 | Ranges;
 export {};

package/dist/preview-server/public-folder.d.ts

@@ -1,12 +1,17 @@
 import type { StaticFile } from 'remotion';
-export declare const initPublicFolderWatch: ({ publicDir, remotionRoot, onUpdate, }: {
+export declare const initPublicFolderWatch: ({ publicDir, onUpdate, staticHash, }: {
     publicDir: string;
     remotionRoot: string;
     onUpdate: () => void;
+    staticHash: string;
 }) => void;
-export declare const watchPublicFolder: ({ publicDir, remotionRoot, onUpdate, }: {
+export declare const fetchFolder: ({ publicDir, staticHash, }: {
+    publicDir: string;
+    staticHash: string;
+}) => void;
+export declare const watchPublicFolder: ({ publicDir, onUpdate, staticHash, }: {
     publicDir: string;
-    remotionRoot: string;
     onUpdate: () => void;
+    staticHash: string;
 }) => void;
 export declare const getFiles: () => StaticFile[];

package/dist/preview-server/public-folder.js

@@ -3,32 +3,48 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getFiles = exports.watchPublicFolder = exports.initPublicFolderWatch = void 0;
+exports.getFiles = exports.watchPublicFolder = exports.fetchFolder = exports.initPublicFolderWatch = void 0;
 const bundler_1 = require("@remotion/bundler");
 const fs_1 = require("fs");
 const path_1 = __importDefault(require("path"));
-const write_files_definition_file_1 = require("./write-files-definition-file");
 let files = [];
-const initPublicFolderWatch = ({ publicDir, remotionRoot, onUpdate, }) => {
-    fetchFolder({ publicDir, remotionRoot });
-    (0, exports.watchPublicFolder)({ publicDir, remotionRoot, onUpdate });
+const initPublicFolderWatch = ({ publicDir, onUpdate, staticHash, }) => {
+    (0, exports.fetchFolder)({ publicDir, staticHash });
+    (0, exports.watchPublicFolder)({ publicDir, onUpdate, staticHash });
 };
 exports.initPublicFolderWatch = initPublicFolderWatch;
-const fetchFolder = ({ publicDir, remotionRoot, }) => {
+const fetchFolder = ({ publicDir, staticHash, }) => {
     files = bundler_1.BundlerInternals.readRecursively({
         folder: '.',
         startPath: publicDir,
+        staticHash,
+        limit: 1000,
     }).map((f) => {
         return {
             ...f,
-            path: f.path.split(path_1.default.sep).join('/'),
+            name: f.name.split(path_1.default.sep).join('/'),
         };
     });
-    (0, write_files_definition_file_1.writeFilesDefinitionFile)(files, remotionRoot);
 };
-const watchPublicFolder = ({ publicDir, remotionRoot, onUpdate, }) => {
+exports.fetchFolder = fetchFolder;
+const watchPublicFolder = ({ publicDir, onUpdate, staticHash, }) => {
+    if (!(0, fs_1.existsSync)(publicDir)) {
+        const parentDir = path_1.default.dirname(publicDir);
+        const onDirChange = () => {
+            if ((0, fs_1.existsSync)(publicDir)) {
+                (0, exports.watchPublicFolder)({
+                    publicDir,
+                    onUpdate,
+                    staticHash,
+                });
+                watcher.close();
+            }
+        };
+        const watcher = (0, fs_1.watch)(parentDir, {}, onDirChange);
+        return;
+    }
     (0, fs_1.watch)(publicDir, { recursive: true }, () => {
-        fetchFolder({ publicDir, remotionRoot });
+        (0, exports.fetchFolder)({ publicDir, staticHash });
         onUpdate();
     });
 };

package/dist/preview-server/routes.d.ts

@@ -1,6 +1,6 @@
 import type { IncomingMessage, ServerResponse } from 'http';
 import type { LiveEventsServer } from './live-events';
-export declare const handleRoutes: ({ hash, hashPrefix, request, response, liveEventsServer, getCurrentInputProps, getEnvVariables, remotionRoot, userPassedPublicDir, }: {
+export declare const handleRoutes: ({ hash, hashPrefix, request, response, liveEventsServer, getCurrentInputProps, getEnvVariables, remotionRoot, publicDir, }: {
     hash: string;
     hashPrefix: string;
     request: IncomingMessage;
@@ -9,5 +9,5 @@ export declare const handleRoutes: ({ hash, hashPrefix, request, response, liveE
     getCurrentInputProps: () => object;
     getEnvVariables: () => Record<string, string>;
     remotionRoot: string;
-    userPassedPublicDir: string | null;
+    publicDir: string;
 }) => void | Promise<void>;

package/dist/preview-server/routes.js

@@ -14,6 +14,7 @@ const get_file_source_1 = require("./error-overlay/react-overlay/utils/get-file-
 const open_in_editor_1 = require("./error-overlay/react-overlay/utils/open-in-editor");
 const get_package_manager_1 = require("./get-package-manager");
 const project_info_1 = require("./project-info");
+const public_folder_1 = require("./public-folder");
 const serve_static_1 = require("./serve-static");
 const update_available_1 = require("./update-available");
 const handleUpdate = async (remotionRoot, _, response) => {
@@ -27,13 +28,14 @@ const static404 = (response) => {
     response.writeHead(404);
     response.end('The static/ prefix has been changed, this URL is no longer valid.');
 };
-const handleFallback = async ({ remotionRoot, hash, response, getCurrentInputProps, getEnvVariables, }) => {
+const handleFallback = async ({ remotionRoot, hash, response, getCurrentInputProps, getEnvVariables, publicDir, }) => {
     var _a;
     const [edit] = await editorGuess;
     const displayName = (0, open_in_editor_1.getDisplayNameForEditor)(edit ? edit.command : null);
     response.setHeader('content-type', 'text/html');
     response.writeHead(200);
     const packageManager = (0, get_package_manager_1.getPackageManager)(remotionRoot, undefined);
+    (0, public_folder_1.fetchFolder)({ publicDir, staticHash: hash });
     response.end(bundler_1.BundlerInternals.indexHtml({
         staticHash: hash,
         baseDir: '/',
@@ -43,6 +45,7 @@ const handleFallback = async ({ remotionRoot, hash, response, getCurrentInputPro
         remotionRoot,
         previewServerCommand: packageManager === 'unknown' ? null : packageManager.startCommand,
         numberOfAudioTags: (_a = parse_command_line_1.parsedCli['number-of-shared-audio-tags']) !== null && _a !== void 0 ? _a : (0, number_of_shared_audio_tags_1.getNumberOfSharedAudioTags)(),
+        publicFiles: (0, public_folder_1.getFiles)(),
         includeFavicon: true,
         title: 'Remotion Preview',
     }));
@@ -124,7 +127,7 @@ const handleFavicon = (_, response) => {
     const readStream = (0, fs_1.createReadStream)(filePath);
     readStream.pipe(response);
 };
-const handleRoutes = ({ hash, hashPrefix, request, response, liveEventsServer, getCurrentInputProps, getEnvVariables, remotionRoot, userPassedPublicDir, }) => {
+const handleRoutes = ({ hash, hashPrefix, request, response, liveEventsServer, getCurrentInputProps, getEnvVariables, remotionRoot, publicDir, }) => {
     const url = new URL(request.url, 'http://localhost');
     if (url.pathname === '/api/update') {
         return handleUpdate(remotionRoot, request, response);
@@ -150,9 +153,6 @@ const handleRoutes = ({ hash, hashPrefix, request, response, liveEventsServer, g
         return liveEventsServer.router(request, response);
     }
     if (url.pathname.startsWith(hash)) {
-        const publicDir = userPassedPublicDir
-            ? path_1.default.resolve(remotionRoot, userPassedPublicDir)
-            : path_1.default.join(remotionRoot, 'public');
         return (0, serve_static_1.serveStatic)(publicDir, hash, request, response);
     }
     if (url.pathname.startsWith(hashPrefix)) {
@@ -164,6 +164,7 @@ const handleRoutes = ({ hash, hashPrefix, request, response, liveEventsServer, g
         response,
         getCurrentInputProps,
         getEnvVariables,
+        publicDir,
     });
 };
 exports.handleRoutes = handleRoutes;

package/dist/preview-server/start-server.d.ts

@@ -1,6 +1,8 @@
 import type { WebpackOverrideFn } from 'remotion';
 import type { LiveEventsServer } from './live-events';
-export declare const startServer: (entry: string, userDefinedComponent: string, options: {
+export declare const startServer: (options: {
+    entry: string;
+    userDefinedComponent: string;
     webpackOverride: WebpackOverrideFn;
     getCurrentInputProps: () => object;
     getEnvVariables: () => Record<string, string>;
@@ -8,8 +10,11 @@ export declare const startServer: (entry: string, userDefinedComponent: string,
     maxTimelineTracks?: number;
     remotionRoot: string;
     keyboardShortcutsEnabled: boolean;
+    publicDir: string;
     userPassedPublicDir: string | null;
     poll: number | null;
+    hash: string;
+    hashPrefix: string;
 }) => Promise<{
     port: number;
     liveEventsServer: LiveEventsServer;

package/dist/preview-server/start-server.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.startServer = void 0;
 const bundler_1 = require("@remotion/bundler");
 const renderer_1 = require("@remotion/renderer");
-const crypto_1 = __importDefault(require("crypto"));
 const fs_1 = __importDefault(require("fs"));
 const http_1 = __importDefault(require("http"));
 const os_1 = __importDefault(require("os"));
@@ -17,12 +16,12 @@ const dev_middleware_1 = require("./dev-middleware");
 const hot_middleware_1 = require("./hot-middleware");
 const live_events_1 = require("./live-events");
 const routes_1 = require("./routes");
-const startServer = async (entry, userDefinedComponent, options) => {
+const startServer = async (options) => {
     var _a, _b, _c, _d;
     const tmpDir = await fs_1.default.promises.mkdtemp(path_1.default.join(os_1.default.tmpdir(), 'react-motion-graphics'));
     const [, config] = bundler_1.BundlerInternals.webpackConfig({
-        entry,
-        userDefinedComponent,
+        entry: options.entry,
+        userDefinedComponent: options.userDefinedComponent,
         outDir: tmpDir,
         environment: 'development',
         webpackOverride: (_a = options === null || options === void 0 ? void 0 : options.webpackOverride) !== null && _a !== void 0 ? _a : config_1.ConfigInternals.getWebpackOverrideFn(),
@@ -37,8 +36,6 @@ const startServer = async (entry, userDefinedComponent, options) => {
         poll: options.poll,
     });
     const compiler = (0, bundler_1.webpack)(config);
-    const hashPrefix = '/static-';
-    const hash = `${hashPrefix}${crypto_1.default.randomBytes(6).toString('hex')}`;
     const wdmMiddleware = (0, dev_middleware_1.wdm)(compiler);
     const whm = (0, hot_middleware_1.webpackHotMiddleware)(compiler);
     const liveEventsServer = (0, live_events_1.makeLiveEventsRouter)();
@@ -57,15 +54,15 @@ const startServer = async (entry, userDefinedComponent, options) => {
         })
             .then(() => {
             return (0, routes_1.handleRoutes)({
-                hash,
-                hashPrefix,
+                hash: options.hash,
+                hashPrefix: options.hashPrefix,
                 request,
                 response,
                 liveEventsServer,
                 getCurrentInputProps: options.getCurrentInputProps,
                 getEnvVariables: options.getEnvVariables,
                 remotionRoot: options.remotionRoot,
-                userPassedPublicDir: options.userPassedPublicDir,
+                publicDir: options.publicDir,
             });
         })
             .catch((err) => {

package/dist/preview.js

@@ -5,6 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.previewCommand = void 0;
 const better_opn_1 = __importDefault(require("better-opn"));
+const crypto_1 = __importDefault(require("crypto"));
 const path_1 = __importDefault(require("path"));
 const chalk_1 = require("./chalk");
 const config_1 = require("./config");
@@ -14,6 +15,8 @@ const get_input_props_1 = require("./get-input-props");
 const get_network_address_1 = require("./get-network-address");
 const log_1 = require("./log");
 const parse_command_line_1 = require("./parse-command-line");
+const get_absolute_public_dir_1 = require("./preview-server/get-absolute-public-dir");
+const public_folder_1 = require("./preview-server/public-folder");
 const start_server_1 = require("./preview-server/start-server");
 const noop = () => undefined;
 let liveEventsListener = null;
@@ -79,16 +82,40 @@ const previewCommand = async (remotionRoot, args) => {
             });
         });
     });
-    const { port, liveEventsServer } = await (0, start_server_1.startServer)(path_1.default.resolve(__dirname, 'previewEntry.js'), fullPath, {
+    const publicDir = (0, get_absolute_public_dir_1.getAbsolutePublicDir)({
+        userPassedPublicDir: config_1.ConfigInternals.getPublicDir(),
+        remotionRoot,
+    });
+    const hashPrefix = '/static-';
+    const staticHash = `${hashPrefix}${crypto_1.default.randomBytes(6).toString('hex')}`;
+    (0, public_folder_1.initPublicFolderWatch)({
+        publicDir,
+        remotionRoot,
+        onUpdate: () => {
+            waitForLiveEventsListener().then((listener) => {
+                listener.sendEventToClient({
+                    type: 'new-public-folder',
+                    files: (0, public_folder_1.getFiles)(),
+                });
+            });
+        },
+        staticHash,
+    });
+    const { port, liveEventsServer } = await (0, start_server_1.startServer)({
+        entry: path_1.default.resolve(__dirname, 'previewEntry.js'),
+        userDefinedComponent: fullPath,
         getCurrentInputProps: () => inputProps,
         getEnvVariables: () => envVariables,
         port: desiredPort,
         maxTimelineTracks: config_1.ConfigInternals.getMaxTimelineTracks(),
         remotionRoot,
         keyboardShortcutsEnabled: config_1.ConfigInternals.getKeyboardShortcutsEnabled(),
-        userPassedPublicDir: config_1.ConfigInternals.getPublicDir(),
+        publicDir,
         webpackOverride: config_1.ConfigInternals.getWebpackOverrideFn(),
         poll: config_1.ConfigInternals.getWebpackPolling(),
+        userPassedPublicDir: config_1.ConfigInternals.getPublicDir(),
+        hash: staticHash,
+        hashPrefix,
     });
     setLiveEventsListener(liveEventsServer);
     const networkAddress = (0, get_network_address_1.getNetworkAddress)();

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/cli",
-	"version": "3.3.25",
+	"version": "3.3.27",
 	"description": "CLI for Remotion",
 	"main": "dist/index.js",
 	"sideEffects": false,
@@ -22,16 +22,16 @@
 	"author": "Jonny Burger <jonny@remotion.dev>",
 	"license": "SEE LICENSE IN LICENSE.md",
 	"dependencies": {
-		"@remotion/bundler": "3.3.25",
-		"@remotion/media-utils": "3.3.25",
-		"@remotion/player": "3.3.25",
-		"@remotion/renderer": "3.3.25",
+		"@remotion/bundler": "3.3.27",
+		"@remotion/media-utils": "3.3.27",
+		"@remotion/player": "3.3.27",
+		"@remotion/renderer": "3.3.27",
 		"better-opn": "2.1.1",
 		"dotenv": "9.0.2",
 		"memfs": "3.4.3",
 		"minimist": "1.2.6",
 		"prompts": "2.4.1",
-		"remotion": "3.3.25",
+		"remotion": "3.3.27",
 		"semver": "7.3.5",
 		"source-map": "0.6.1"
 	},
@@ -44,8 +44,8 @@
 		"@types/minimist": "^1.2.2",
 		"@types/node": "^16.7.5",
 		"@types/prompts": "^2.4.1",
-		"@types/react": "18.0.23",
-		"@types/react-dom": "18.0.0",
+		"@types/react": "18.0.26",
+		"@types/react-dom": "18.0.10",
 		"@types/semver": "^7.3.4",
 		"@types/webpack-env": "^1.16.0",
 		"@typescript-eslint/eslint-plugin": "5.18.0",
@@ -71,5 +71,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "48e46dd2ede8fe903bf0139cebd6f546d7f2b5e0"
+	"gitHead": "5dfc0dfa0df9592a358127a9aea9219244e6807a"
 }

package/dist/convert-entry-point-to-serve-url.d.ts

@@ -1 +0,0 @@
-export declare const convertEntryPointToServeUrl: (entryPoint: string) => string;

package/dist/convert-entry-point-to-serve-url.js

@@ -1,15 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.convertEntryPointToServeUrl = void 0;
-const renderer_1 = require("@remotion/renderer");
-const path_1 = __importDefault(require("path"));
-const convertEntryPointToServeUrl = (entryPoint) => {
-    const fullPath = renderer_1.RenderInternals.isServeUrl(entryPoint)
-        ? entryPoint
-        : path_1.default.resolve(process.cwd(), entryPoint);
-    return fullPath;
-};
-exports.convertEntryPointToServeUrl = convertEntryPointToServeUrl;

package/dist/editor/components/CollapsableOptions.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-export declare const CollapsableOptions: React.FC<{
-    children: React.ReactNode;
-    showLabel: string;
-    hideLabel: string;
-}>;

package/dist/editor/components/CollapsableOptions.js

@@ -1,35 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CollapsableOptions = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const colors_1 = require("../helpers/colors");
-const z_index_1 = require("../state/z-index");
-const layout_1 = require("./layout");
-const TimelineCollapseToggle_1 = require("./Timeline/TimelineCollapseToggle");
-const container = {
-    marginLeft: 16,
-    height: 40,
-    display: 'flex',
-    flexDirection: 'row',
-    alignItems: 'center',
-};
-const buttonStyle = {
-    border: 'none',
-    padding: 0,
-    appearance: 'none',
-    display: 'flex',
-    flexDirection: 'row',
-    alignItems: 'center',
-    fontSize: 14,
-    color: colors_1.LIGHT_TEXT,
-};
-const CollapsableOptions = ({ children, showLabel, hideLabel }) => {
-    const [show, setShow] = (0, react_1.useState)(false);
-    const { tabIndex } = (0, z_index_1.useZIndex)();
-    const onClick = (0, react_1.useCallback)(() => {
-        setShow((s) => !s);
-    }, []);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { style: container, children: (0, jsx_runtime_1.jsxs)("button", { style: buttonStyle, tabIndex: tabIndex, onClick: onClick, type: "button", children: [(0, jsx_runtime_1.jsx)(TimelineCollapseToggle_1.TimelineCollapseToggle, { color: colors_1.LIGHT_TEXT, collapsed: !show }), (0, jsx_runtime_1.jsx)(layout_1.Spacing, { block: true, x: 1 }), show ? hideLabel : showLabel] }) }), show ? children : null] }));
-};
-exports.CollapsableOptions = CollapsableOptions;

package/dist/editor/components/InlineAction.d.ts

@@ -1,5 +0,0 @@
-import type { PropsWithChildren } from 'react';
-import React from 'react';
-export declare const InlineAction: React.FC<PropsWithChildren<{
-    onClick: React.MouseEventHandler<HTMLAnchorElement> | undefined;
-}>>;

package/dist/editor/components/InlineAction.js

@@ -1,34 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InlineAction = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const colors_1 = require("../helpers/colors");
-const z_index_1 = require("../state/z-index");
-const InlineAction = ({ children, onClick }) => {
-    const { tabIndex } = (0, z_index_1.useZIndex)();
-    const [hovered, setHovered] = (0, react_1.useState)(false);
-    const onPointerEnter = (0, react_1.useCallback)(() => {
-        setHovered(true);
-    }, []);
-    const onPointerLeave = (0, react_1.useCallback)(() => {
-        setHovered(false);
-    }, []);
-    const style = (0, react_1.useMemo)(() => {
-        return {
-            border: 'none',
-            background: hovered ? colors_1.CLEAR_HOVER : 'transparent',
-            height: 24,
-            width: 24,
-            display: 'inline-flex',
-            justifyContent: 'center',
-            alignItems: 'center',
-            borderRadius: 3,
-            opacity: hovered ? 1 : 0.6,
-        };
-    }, [hovered]);
-    return (
-    // <div> because cannot use button inside a button
-    (0, jsx_runtime_1.jsx)("a", { onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, onClick: onClick, style: style, tabIndex: tabIndex, children: children }));
-};
-exports.InlineAction = InlineAction;

package/dist/editor/components/RenderButton.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-import type { TCompMetadata } from 'remotion';
-export declare const RenderButton: React.FC<{
-    composition: TCompMetadata;
-    visible: boolean;
-}>;

package/dist/editor/components/RenderButton.js

@@ -1,43 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.RenderButton = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const get_default_out_name_1 = require("../../get-default-out-name");
-const render_1 = require("../icons/render");
-const modals_1 = require("../state/modals");
-const InlineAction_1 = require("./InlineAction");
-const RenderButton = ({ composition, visible }) => {
-    const { setSelectedModal } = (0, react_1.useContext)(modals_1.ModalsContext);
-    const iconStyle = (0, react_1.useMemo)(() => {
-        return {
-            style: {
-                height: 12,
-            },
-        };
-    }, []);
-    const onClick = (0, react_1.useCallback)((e) => {
-        var _a, _b, _c, _d, _e;
-        e.stopPropagation();
-        setSelectedModal({
-            type: 'render',
-            compositionId: composition.id,
-            initialFrame: 0,
-            // TODO: JPEG for video, PNG for image
-            initialImageFormat: 'png',
-            // TODO: Determine defaults from config file
-            initialQuality: (_b = (_a = window.remotion_renderDefaults) === null || _a === void 0 ? void 0 : _a.quality) !== null && _b !== void 0 ? _b : 80,
-            initialScale: (_d = (_c = window.remotion_renderDefaults) === null || _c === void 0 ? void 0 : _c.scale) !== null && _d !== void 0 ? _d : 1,
-            initialVerbose: ((_e = window.remotion_renderDefaults) === null || _e === void 0 ? void 0 : _e.logLevel) === 'verbose',
-            initialOutName: (0, get_default_out_name_1.getDefaultOutLocation)({
-                compositionName: composition.id,
-                defaultExtension: 'png',
-            }),
-        });
-    }, [composition, setSelectedModal]);
-    if (!visible) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsx)(InlineAction_1.InlineAction, { onClick: onClick, children: (0, jsx_runtime_1.jsx)(render_1.RenderIcon, { svgProps: iconStyle }) }));
-};
-exports.RenderButton = RenderButton;

package/dist/editor/components/RenderModal/RenderErrorModal.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import type { RenderJob } from '../../../preview-server/render-queue/job';
-export declare const RenderErrorModal: React.FC<{
-    job: RenderJob;
-}>;

package/dist/editor/components/RenderModal/RenderErrorModal.js

@@ -1,64 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.RenderErrorModal = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Button_1 = require("../../../preview-server/error-overlay/remotion-overlay/Button");
-const make_retry_payload_1 = require("../../../preview-server/render-queue/make-retry-payload");
-const modals_1 = require("../../state/modals");
-const layout_1 = require("../layout");
-const ModalContainer_1 = require("../ModalContainer");
-const ModalHeader_1 = require("../ModalHeader");
-const NotificationCenter_1 = require("../Notifications/NotificationCenter");
-const actions_1 = require("../RenderQueue/actions");
-const container = {
-    padding: 20,
-    maxWidth: 1200,
-    paddingTop: 0,
-};
-const codeBlock = {
-    backgroundColor: 'black',
-    whiteSpace: 'pre',
-    padding: 12,
-    borderRadius: 4,
-    fontFamily: 'monospace',
-    overflow: 'auto',
-    maxHeight: 300,
-};
-const spacer = {
-    height: layout_1.SPACING_UNIT,
-    width: layout_1.SPACING_UNIT,
-};
-const buttonRow = {
-    display: 'flex',
-    flexDirection: 'row',
-    justifyContent: 'flex-end',
-};
-const RenderErrorModal = ({ job }) => {
-    const { setSelectedModal } = (0, react_1.useContext)(modals_1.ModalsContext);
-    const onQuit = (0, react_1.useCallback)(() => {
-        setSelectedModal(null);
-    }, [setSelectedModal]);
-    const onRetry = (0, react_1.useCallback)(() => {
-        const retryPayload = (0, make_retry_payload_1.makeRetryPayload)(job);
-        setSelectedModal(retryPayload);
-    }, [job, setSelectedModal]);
-    const onClickOnRemove = (0, react_1.useCallback)(() => {
-        setSelectedModal(null);
-        (0, actions_1.removeRenderJob)(job).catch((err) => {
-            var _a;
-            (_a = NotificationCenter_1.notificationCenter.current) === null || _a === void 0 ? void 0 : _a.addNotification({
-                content: 'Failed to remove render job: ' + err.message,
-                created: Date.now(),
-                duration: 2000,
-                id: String(Math.random()),
-            });
-            console.log(err);
-        });
-    }, [job, setSelectedModal]);
-    if (job.status !== 'failed') {
-        throw new Error('should not have rendered this modal');
-    }
-    return ((0, jsx_runtime_1.jsxs)(ModalContainer_1.ModalContainer, { onOutsideClick: onQuit, onEscape: onQuit, children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.NewCompHeader, { title: `Render ${job.compositionId}` }), (0, jsx_runtime_1.jsxs)("div", { style: container, children: [(0, jsx_runtime_1.jsx)("p", { children: "The render failed because of the following error:" }), (0, jsx_runtime_1.jsx)("div", { style: codeBlock, children: job.error.stack }), (0, jsx_runtime_1.jsx)("div", { style: spacer }), (0, jsx_runtime_1.jsxs)("div", { style: buttonRow, children: [(0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: onClickOnRemove, children: "Remove render" }), (0, jsx_runtime_1.jsx)(layout_1.Flex, {}), (0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: onRetry, children: "Retry" }), (0, jsx_runtime_1.jsx)("div", { style: spacer }), (0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: onQuit, children: "Close" })] })] })] }));
-};
-exports.RenderErrorModal = RenderErrorModal;