@remotion/cli 4.1.0-alpha10 → 4.1.0-alpha11

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

@@ -12,6 +12,6 @@ export declare const getInputBorderColor: ({ status, isFocused, isHovered, }: {
     status: 'error' | 'warning' | 'ok';
     isFocused: boolean;
     isHovered: boolean;
-}) => "hsla(0, 0%, 100%, 0.15)" | "rgba(0, 0, 0, 0.6)" | "rgba(255, 255, 255, 0.05)" | "#ff3232" | "#f1c40f";
-export declare const RemotionInput: React.ForwardRefExoticComponent<Pick<Props, "key" | keyof React.InputHTMLAttributes<HTMLInputElement> | "status" | "rightAlign"> & React.RefAttributes<HTMLInputElement>>;
+}) => "#ff3232" | "hsla(0, 0%, 100%, 0.15)" | "rgba(0, 0, 0, 0.6)" | "rgba(255, 255, 255, 0.05)" | "#f1c40f";
+export declare const RemotionInput: React.ForwardRefExoticComponent<Pick<Props, "key" | "status" | "rightAlign" | keyof React.InputHTMLAttributes<HTMLInputElement>> & React.RefAttributes<HTMLInputElement>>;
 export {};

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

@@ -4,5 +4,5 @@ type Props = React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>
     status: RemInputStatus;
     name: string;
 };
-export declare const RemInputTypeColor: React.ForwardRefExoticComponent<Pick<Props, "key" | keyof React.InputHTMLAttributes<HTMLInputElement> | "status"> & React.RefAttributes<HTMLInputElement>>;
+export declare const RemInputTypeColor: React.ForwardRefExoticComponent<Pick<Props, "key" | "status" | keyof React.InputHTMLAttributes<HTMLInputElement>> & React.RefAttributes<HTMLInputElement>>;
 export {};

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

@@ -16,4 +16,4 @@ export declare const BLUE_DISABLED = "#284f73";
 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.15)" | "rgba(255, 255, 255, 0.06)" | "hsla(0, 0%, 100%, 0.25)";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remotion/cli",
-  "version": "4.1.0-alpha10",
+  "version": "4.1.0-alpha11",
   "description": "CLI for Remotion",
   "main": "dist/index.js",
   "sideEffects": false,
@@ -35,11 +35,11 @@
     "prompts": "2.4.1",
     "semver": "7.5.3",
     "source-map": "0.6.1",
-    "@remotion/media-utils": "4.1.0-alpha10",
-    "@remotion/player": "4.1.0-alpha10",
-    "@remotion/renderer": "4.1.0-alpha10",
-    "@remotion/bundler": "4.1.0-alpha10",
-    "remotion": "4.1.0-alpha10"
+    "@remotion/bundler": "4.1.0-alpha11",
+    "@remotion/media-utils": "4.1.0-alpha11",
+    "remotion": "4.1.0-alpha11",
+    "@remotion/renderer": "4.1.0-alpha11",
+    "@remotion/player": "4.1.0-alpha11"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
@@ -65,8 +65,8 @@
     "typescript": "4.9.5",
     "vitest": "0.31.1",
     "zod": "^3.21.4",
-    "@remotion/tailwind": "4.1.0-alpha10",
-    "@remotion/zod-types": "4.1.0-alpha10"
+    "@remotion/zod-types": "4.1.0-alpha11",
+    "@remotion/tailwind": "4.1.0-alpha11"
   },
   "keywords": [
     "remotion",

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

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const AssetSelector: React.FC;

package/dist/editor/components/AssetSelector.js

@@ -1,30 +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.AssetSelector = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importDefault(require("react"));
-const remotion_1 = require("remotion");
-const colors_1 = require("../helpers/colors");
-const z_index_1 = require("../state/z-index");
-const AssetSelectorItem_1 = require("./AssetSelectorItem");
-const container = {
-    display: 'flex',
-    flexDirection: 'column',
-    flex: 1,
-    overflow: 'hidden',
-    backgroundColor: colors_1.BACKGROUND,
-};
-const list = {
-    overflowY: 'auto',
-};
-const AssetSelector = () => {
-    const { tabIndex } = (0, z_index_1.useZIndex)();
-    const staticFiles = react_1.default.useMemo(() => (0, remotion_1.getStaticFiles)(), []);
-    return ((0, jsx_runtime_1.jsx)("div", { style: container, children: (0, jsx_runtime_1.jsx)("div", { className: "__remotion-vertical-scrollbar", style: list, children: staticFiles.map((file) => {
-                return ((0, jsx_runtime_1.jsx)(AssetSelectorItem_1.AssetSelectorItem, { item: file, tabIndex: tabIndex }, `${file.src}`));
-            }) }) }));
-};
-exports.AssetSelector = AssetSelector;

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

@@ -1,6 +0,0 @@
-import React from 'react';
-import type { StaticFile } from 'remotion';
-export declare const AssetSelectorItem: React.FC<{
-    item: StaticFile;
-    tabIndex: number;
-}>;

package/dist/editor/components/AssetSelectorItem.js

@@ -1,109 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AssetSelectorItem = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importStar(require("react"));
-const colors_1 = require("../helpers/colors");
-const file_1 = require("../icons/file");
-const folder_1 = require("../icons/folder");
-const InlineAction_1 = require("./InlineAction");
-const layout_1 = require("./layout");
-const NotificationCenter_1 = require("./Notifications/NotificationCenter");
-const actions_1 = require("./RenderQueue/actions");
-const ASSET_ITEM_HEIGHT = 32;
-const itemStyle = {
-    paddingRight: 10,
-    paddingTop: 6,
-    paddingBottom: 6,
-    fontSize: 13,
-    display: 'flex',
-    textDecoration: 'none',
-    cursor: 'default',
-    alignItems: 'center',
-    marginBottom: 1,
-    appearance: 'none',
-    border: 'none',
-    width: '100%',
-    textAlign: 'left',
-    backgroundColor: colors_1.BACKGROUND,
-    height: ASSET_ITEM_HEIGHT,
-};
-const labelStyle = {
-    textAlign: 'left',
-    textDecoration: 'none',
-    fontSize: 13,
-    flex: '1 1 0%',
-    whiteSpace: 'nowrap',
-    overflow: 'hidden',
-    textOverflow: 'ellipsis',
-};
-const iconStyle = {
-    width: 18,
-    height: 18,
-    flexShrink: 0,
-};
-const revealIconStyle = {
-    height: 12,
-    color: 'currentColor',
-};
-const AssetSelectorItem = ({ item, tabIndex }) => {
-    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 {
-            ...itemStyle,
-            backgroundColor: hovered ? colors_1.CLEAR_HOVER : 'transparent',
-            paddingLeft: 12,
-            color: hovered ? 'white' : colors_1.LIGHT_TEXT,
-        };
-    }, [hovered]);
-    const label = (0, react_1.useMemo)(() => {
-        return {
-            ...labelStyle,
-            color: hovered ? 'white' : colors_1.LIGHT_TEXT,
-        };
-    }, [hovered]);
-    const onClick = (0, react_1.useCallback)(() => {
-        console.log('Clicked', item);
-    }, [item]);
-    const renderAction = (0, react_1.useCallback)((color) => {
-        return (0, jsx_runtime_1.jsx)(folder_1.ExpandedFolderIconSolid, { style: revealIconStyle, color: color });
-    }, []);
-    const revealInExplorer = react_1.default.useCallback(() => {
-        (0, actions_1.openInFileExplorer)({
-            directory: 'public/' + item.name,
-        }).catch((err) => {
-            (0, NotificationCenter_1.sendErrorNotification)(`Could not open file: ${err.message}`);
-        });
-    }, [item.name]);
-    return ((0, jsx_runtime_1.jsx)(layout_1.Row, { align: "center", children: (0, jsx_runtime_1.jsxs)("button", { style: style, onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, tabIndex: tabIndex, onClick: onClick, type: "button", title: item.name, children: [(0, jsx_runtime_1.jsx)(file_1.FileIcon, { style: iconStyle, color: hovered ? 'white' : colors_1.LIGHT_TEXT }), (0, jsx_runtime_1.jsx)(layout_1.Spacing, { x: 1 }), (0, jsx_runtime_1.jsx)("div", { style: label, children: item.name }), (0, jsx_runtime_1.jsx)(layout_1.Spacing, { x: 0.5 }), (0, jsx_runtime_1.jsx)(InlineAction_1.InlineAction, { renderAction: renderAction, onClick: revealInExplorer })] }) }));
-};
-exports.AssetSelectorItem = AssetSelectorItem;

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

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-type OptionsSidebarPanel = 'compositions' | 'assets';
-export declare const persistSelectedOptionsSidebarPanel: (panel: OptionsSidebarPanel) => void;
-export declare const optionsSidebarTabs: import("react").RefObject<{
-    selectRendersPanel: () => void;
-}>;
-export declare const ExplorerPanel: React.FC<{}>;
-export {};

package/dist/editor/components/ExplorerPanel.js

@@ -1,67 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ExplorerPanel = exports.optionsSidebarTabs = exports.persistSelectedOptionsSidebarPanel = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const remotion_1 = require("remotion");
-const colors_1 = require("../helpers/colors");
-const AssetSelector_1 = require("./AssetSelector");
-const CompositionSelector_1 = require("./CompositionSelector");
-const Tabs_1 = require("./Tabs");
-const container = {
-    height: '100%',
-    width: '100%',
-    maxWidth: '100%',
-    display: 'flex',
-    flexDirection: 'column',
-    flex: 1,
-};
-const localStorageKey = 'remotion.sidebarPanel';
-const getSelectedPanel = () => {
-    const panel = localStorage.getItem(localStorageKey);
-    if (panel === 'assets') {
-        return 'assets';
-    }
-    return 'compositions';
-};
-const tabsContainer = {
-    backgroundColor: colors_1.BACKGROUND,
-};
-const persistSelectedOptionsSidebarPanel = (panel) => {
-    localStorage.setItem(localStorageKey, panel);
-};
-exports.persistSelectedOptionsSidebarPanel = persistSelectedOptionsSidebarPanel;
-exports.optionsSidebarTabs = (0, react_1.createRef)();
-const ExplorerPanel = () => {
-    const [panel, setPanel] = (0, react_1.useState)(() => getSelectedPanel());
-    const onCompositionsSelected = (0, react_1.useCallback)(() => {
-        setPanel('compositions');
-        (0, exports.persistSelectedOptionsSidebarPanel)('compositions');
-    }, []);
-    const onAssetsSelected = (0, react_1.useCallback)(() => {
-        setPanel('assets');
-        (0, exports.persistSelectedOptionsSidebarPanel)('assets');
-    }, []);
-    (0, react_1.useImperativeHandle)(exports.optionsSidebarTabs, () => {
-        return {
-            selectRendersPanel: () => {
-                setPanel('assets');
-                (0, exports.persistSelectedOptionsSidebarPanel)('assets');
-            },
-        };
-    }, []);
-    const { compositions, currentComposition } = (0, react_1.useContext)(remotion_1.Internals.CompositionManager);
-    const composition = (0, react_1.useMemo)(() => {
-        for (const comp of compositions) {
-            if (comp.id === currentComposition) {
-                return comp;
-            }
-        }
-        return null;
-    }, [compositions, currentComposition]);
-    if (composition === null) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsxs)("div", { style: container, className: "css-reset", children: [(0, jsx_runtime_1.jsx)("div", { style: tabsContainer, children: (0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tab, { selected: panel === 'compositions', onClick: onCompositionsSelected, children: "Compositions" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tab, { selected: panel === 'assets', onClick: onAssetsSelected, children: "Assets" })] }) }), panel === 'compositions' ? (0, jsx_runtime_1.jsx)(CompositionSelector_1.CompositionSelector, {}) : (0, jsx_runtime_1.jsx)(AssetSelector_1.AssetSelector, {})] }));
-};
-exports.ExplorerPanel = ExplorerPanel;

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

@@ -1,8 +0,0 @@
-import React from 'react';
-type OptionsSidebarPanel = 'input-props' | 'renders';
-export declare const persistSelectedOptionsSidebarPanel: (panel: OptionsSidebarPanel) => void;
-export declare const optionsSidebarTabs: React.RefObject<{
-    selectRendersPanel: () => void;
-}>;
-export declare const OptionsPanel: React.FC<{}>;
-export {};

package/dist/editor/components/OptionsPanel.js

@@ -1,79 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.OptionsPanel = exports.optionsSidebarTabs = exports.persistSelectedOptionsSidebarPanel = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const remotion_1 = require("remotion");
-const colors_1 = require("../helpers/colors");
-const DataEditor_1 = require("./RenderModal/DataEditor");
-const RenderQueue_1 = require("./RenderQueue");
-const RendersTab_1 = require("./RendersTab");
-const Tabs_1 = require("./Tabs");
-const container = {
-    height: '100%',
-    width: '100%',
-    position: 'absolute',
-    display: 'flex',
-    flexDirection: 'column',
-};
-const PropsEditor = ({ composition }) => {
-    const { props, updateProps } = (0, react_1.useContext)(remotion_1.Internals.EditorPropsContext);
-    const setInputProps = (0, react_1.useCallback)((newProps) => {
-        updateProps({
-            id: composition.id,
-            defaultProps: composition.defaultProps,
-            newProps,
-        });
-    }, [composition.defaultProps, composition.id, updateProps]);
-    const actualProps = (0, react_1.useMemo)(() => { var _a, _b; return (_b = (_a = props[composition.id]) !== null && _a !== void 0 ? _a : composition.defaultProps) !== null && _b !== void 0 ? _b : {}; }, [composition.defaultProps, composition.id, props]);
-    return ((0, jsx_runtime_1.jsx)(DataEditor_1.DataEditor, { unresolvedComposition: composition, inputProps: actualProps, setInputProps: setInputProps, mayShowSaveButton: true, propsEditType: "default-props" }, composition.id));
-};
-const localStorageKey = 'remotion.sidebarPanel';
-const getSelectedPanel = () => {
-    const panel = localStorage.getItem(localStorageKey);
-    if (panel === 'renders') {
-        return 'renders';
-    }
-    return 'input-props';
-};
-const tabsContainer = {
-    backgroundColor: colors_1.BACKGROUND,
-};
-const persistSelectedOptionsSidebarPanel = (panel) => {
-    localStorage.setItem(localStorageKey, panel);
-};
-exports.persistSelectedOptionsSidebarPanel = persistSelectedOptionsSidebarPanel;
-exports.optionsSidebarTabs = (0, react_1.createRef)();
-const OptionsPanel = () => {
-    const [panel, setPanel] = (0, react_1.useState)(() => getSelectedPanel());
-    const onPropsSelected = (0, react_1.useCallback)(() => {
-        setPanel('input-props');
-        (0, exports.persistSelectedOptionsSidebarPanel)('input-props');
-    }, []);
-    const onRendersSelected = (0, react_1.useCallback)(() => {
-        setPanel('renders');
-        (0, exports.persistSelectedOptionsSidebarPanel)('renders');
-    }, []);
-    (0, react_1.useImperativeHandle)(exports.optionsSidebarTabs, () => {
-        return {
-            selectRendersPanel: () => {
-                setPanel('renders');
-                (0, exports.persistSelectedOptionsSidebarPanel)('renders');
-            },
-        };
-    }, []);
-    const { compositions, currentComposition } = (0, react_1.useContext)(remotion_1.Internals.CompositionManager);
-    const composition = (0, react_1.useMemo)(() => {
-        for (const comp of compositions) {
-            if (comp.id === currentComposition) {
-                return comp;
-            }
-        }
-        return null;
-    }, [compositions, currentComposition]);
-    if (composition === null) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsxs)("div", { style: container, className: "css-reset", children: [(0, jsx_runtime_1.jsx)("div", { style: tabsContainer, children: (0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tab, { selected: panel === 'input-props', onClick: onPropsSelected, children: "Props" }), (0, jsx_runtime_1.jsx)(RendersTab_1.RendersTab, { onClick: onRendersSelected, selected: panel === 'renders' })] }) }), panel === 'renders' ? ((0, jsx_runtime_1.jsx)(RenderQueue_1.RenderQueue, {})) : ((0, jsx_runtime_1.jsx)(PropsEditor, { composition: composition }))] }));
-};
-exports.OptionsPanel = OptionsPanel;

package/dist/editor/components/RenderModal/SchemaEditor/input-props-serialization.d.ts

@@ -1,14 +0,0 @@
-export type SerializedJSONWithCustomFields = {
-    serializedString: string;
-    customDateUsed: boolean;
-    customFileUsed: boolean;
-    mapUsed: boolean;
-    setUsed: boolean;
-};
-export declare const FILE_TOKEN = "remotion-file:";
-export declare const serializeJSONWithDate: ({ data, indent, staticBase, }: {
-    data: unknown;
-    indent: number | undefined;
-    staticBase: string;
-}) => SerializedJSONWithCustomFields;
-export declare const deserializeJSONWithCustomFields: (data: string) => any;

package/dist/editor/components/RenderModal/SchemaEditor/input-props-serialization.js

@@ -1,42 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.deserializeJSONWithCustomFields = exports.serializeJSONWithDate = exports.FILE_TOKEN = void 0;
-const DATE_TOKEN = 'remotion-date:';
-exports.FILE_TOKEN = 'remotion-file:';
-const serializeJSONWithDate = ({ data, indent, staticBase, }) => {
-    let customDateUsed = false;
-    let customFileUsed = false;
-    let mapUsed = false;
-    let setUsed = false;
-    const serializedString = JSON.stringify(data, function (key, value) {
-        const item = this[key];
-        if (item instanceof Date) {
-            customDateUsed = true;
-            return `${DATE_TOKEN}${item.toISOString()}`;
-        }
-        if (item instanceof Map) {
-            mapUsed = true;
-            return value;
-        }
-        if (item instanceof Set) {
-            setUsed = true;
-            return value;
-        }
-        if (typeof item === 'string' && item.startsWith(staticBase)) {
-            customFileUsed = true;
-            return `${exports.FILE_TOKEN}${item.replace(staticBase + '/', '')}`;
-        }
-        return value;
-    }, indent);
-    return { serializedString, customDateUsed, customFileUsed, mapUsed, setUsed };
-};
-exports.serializeJSONWithDate = serializeJSONWithDate;
-const deserializeJSONWithCustomFields = (data) => {
-    return JSON.parse(data, (_, value) => {
-        if (typeof value === 'string' && value.startsWith(DATE_TOKEN)) {
-            return new Date(value.replace(DATE_TOKEN, ''));
-        }
-        return value;
-    });
-};
-exports.deserializeJSONWithCustomFields = deserializeJSONWithCustomFields;

package/dist/error-with-stack-frame.d.ts

@@ -1,19 +0,0 @@
-import type { Page, SymbolicatedStackFrame } from '@remotion/renderer';
-export declare class ErrorWithStackFrame extends Error {
-    symbolicatedStackFrames: SymbolicatedStackFrame[] | null;
-    frame: number | null;
-    name: string;
-    delayRenderCall: SymbolicatedStackFrame[] | null;
-    constructor({ message, symbolicatedStackFrames, frame, name, delayRenderCall, }: {
-        message: string;
-        symbolicatedStackFrames: SymbolicatedStackFrame[] | null;
-        frame: number | null;
-        name: string;
-        delayRenderCall: SymbolicatedStackFrame[] | null;
-    });
-}
-export declare const handleJavascriptException: ({ page, onError, frame, }: {
-    page: Page;
-    frame: number | null;
-    onError: (err: Error) => void;
-}) => () => void;

package/dist/error-with-stack-frame.js

@@ -1,81 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.handleJavascriptException = exports.ErrorWithStackFrame = void 0;
-const remotion_1 = require("remotion");
-const renderer_1 = require("@remotion/renderer");
-const log_1 = require("./log");
-class ErrorWithStackFrame extends Error {
-    constructor({ message, symbolicatedStackFrames, frame, name, delayRenderCall, }) {
-        super(message);
-        this.symbolicatedStackFrames = symbolicatedStackFrames;
-        this.frame = frame;
-        this.name = name;
-        this.delayRenderCall = delayRenderCall;
-    }
-}
-exports.ErrorWithStackFrame = ErrorWithStackFrame;
-const cleanUpErrorMessage = (exception) => {
-    var _a, _b, _c, _d;
-    let errorMessage = (_a = exception.exceptionDetails.exception) === null || _a === void 0 ? void 0 : _a.description;
-    if (!errorMessage) {
-        return null;
-    }
-    const errorType = (_b = exception.exceptionDetails.exception) === null || _b === void 0 ? void 0 : _b.className;
-    const prefix = `${errorType}: `;
-    if (errorMessage.startsWith(prefix)) {
-        errorMessage = errorMessage.substring(prefix.length);
-    }
-    const frames = (_d = (_c = exception.exceptionDetails.stackTrace) === null || _c === void 0 ? void 0 : _c.callFrames.length) !== null && _d !== void 0 ? _d : 0;
-    const split = errorMessage.split('\n');
-    return split.slice(0, Math.max(1, split.length - frames)).join('\n');
-};
-const removeDelayRenderStack = (message) => {
-    const index = message.indexOf(remotion_1.Internals.DELAY_RENDER_CALLSTACK_TOKEN);
-    if (index === -1) {
-        return message;
-    }
-    return message.substring(0, index);
-};
-const callFrameToStackFrame = (callFrame) => {
-    return {
-        columnNumber: callFrame.columnNumber,
-        fileName: callFrame.url,
-        functionName: callFrame.functionName,
-        lineNumber: callFrame.lineNumber,
-    };
-};
-const handleJavascriptException = ({ page, onError, frame, }) => {
-    const client = page._client();
-    const handler = (exception) => {
-        var _a, _b, _c;
-        const rawErrorMessage = (_a = exception.exceptionDetails.exception) === null || _a === void 0 ? void 0 : _a.description;
-        const cleanErrorMessage = cleanUpErrorMessage(exception);
-        if (!cleanErrorMessage) {
-            log_1.Log.error(exception);
-            const err = new Error(rawErrorMessage);
-            err.stack = rawErrorMessage;
-            onError(err);
-            return;
-        }
-        if (!exception.exceptionDetails.stackTrace) {
-            const err = new Error(removeDelayRenderStack(cleanErrorMessage));
-            err.stack = rawErrorMessage;
-            onError(err);
-            return;
-        }
-        const errorType = (_b = exception.exceptionDetails.exception) === null || _b === void 0 ? void 0 : _b.className;
-        const symbolicatedErr = new renderer_1.RenderInternals.SymbolicateableError({
-            message: removeDelayRenderStack(cleanErrorMessage),
-            stackFrame: exception.exceptionDetails.stackTrace.callFrames.map((f) => callFrameToStackFrame(f)),
-            frame,
-            name: errorType,
-            stack: (_c = exception.exceptionDetails.exception) === null || _c === void 0 ? void 0 : _c.description,
-        });
-        onError(symbolicatedErr);
-    };
-    client.on('Runtime.exceptionThrown', handler);
-    return () => {
-        client.off('Runtime.exceptionThrown', handler);
-    };
-};
-exports.handleJavascriptException = handleJavascriptException;

package/dist/handle-javascript-error.d.ts

@@ -1,20 +0,0 @@
-import type { Page } from '../browser/BrowserPage';
-import type { SymbolicatedStackFrame } from '../symbolicate-stacktrace';
-export declare class ErrorWithStackFrame extends Error {
-    symbolicatedStackFrames: SymbolicatedStackFrame[] | null;
-    frame: number | null;
-    name: string;
-    delayRenderCall: SymbolicatedStackFrame[] | null;
-    constructor({ message, symbolicatedStackFrames, frame, name, delayRenderCall, }: {
-        message: string;
-        symbolicatedStackFrames: SymbolicatedStackFrame[] | null;
-        frame: number | null;
-        name: string;
-        delayRenderCall: SymbolicatedStackFrame[] | null;
-    });
-}
-export declare const handleJavascriptException: ({ page, onError, frame, }: {
-    page: Page;
-    frame: number | null;
-    onError: (err: Error) => void;
-}) => () => void;

package/dist/handle-javascript-error.js

@@ -1,81 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.handleJavascriptException = exports.ErrorWithStackFrame = void 0;
-const remotion_1 = require("remotion");
-const symbolicateable_error_1 = require("./symbolicateable-error");
-const log_1 = require("./log");
-class ErrorWithStackFrame extends Error {
-    constructor({ message, symbolicatedStackFrames, frame, name, delayRenderCall, }) {
-        super(message);
-        this.symbolicatedStackFrames = symbolicatedStackFrames;
-        this.frame = frame;
-        this.name = name;
-        this.delayRenderCall = delayRenderCall;
-    }
-}
-exports.ErrorWithStackFrame = ErrorWithStackFrame;
-const cleanUpErrorMessage = (exception) => {
-    var _a, _b, _c, _d;
-    let errorMessage = (_a = exception.exceptionDetails.exception) === null || _a === void 0 ? void 0 : _a.description;
-    if (!errorMessage) {
-        return null;
-    }
-    const errorType = (_b = exception.exceptionDetails.exception) === null || _b === void 0 ? void 0 : _b.className;
-    const prefix = `${errorType}: `;
-    if (errorMessage.startsWith(prefix)) {
-        errorMessage = errorMessage.substring(prefix.length);
-    }
-    const frames = (_d = (_c = exception.exceptionDetails.stackTrace) === null || _c === void 0 ? void 0 : _c.callFrames.length) !== null && _d !== void 0 ? _d : 0;
-    const split = errorMessage.split('\n');
-    return split.slice(0, Math.max(1, split.length - frames)).join('\n');
-};
-const removeDelayRenderStack = (message) => {
-    const index = message.indexOf(remotion_1.Internals.DELAY_RENDER_CALLSTACK_TOKEN);
-    if (index === -1) {
-        return message;
-    }
-    return message.substring(0, index);
-};
-const callFrameToStackFrame = (callFrame) => {
-    return {
-        columnNumber: callFrame.columnNumber,
-        fileName: callFrame.url,
-        functionName: callFrame.functionName,
-        lineNumber: callFrame.lineNumber,
-    };
-};
-const handleJavascriptException = ({ page, onError, frame, }) => {
-    const client = page._client();
-    const handler = (exception) => {
-        var _a, _b, _c;
-        const rawErrorMessage = (_a = exception.exceptionDetails.exception) === null || _a === void 0 ? void 0 : _a.description;
-        const cleanErrorMessage = cleanUpErrorMessage(exception);
-        if (!cleanErrorMessage) {
-            log_1.Log.error(exception);
-            const err = new Error(rawErrorMessage);
-            err.stack = rawErrorMessage;
-            onError(err);
-            return;
-        }
-        if (!exception.exceptionDetails.stackTrace) {
-            const err = new Error(removeDelayRenderStack(cleanErrorMessage));
-            err.stack = rawErrorMessage;
-            onError(err);
-            return;
-        }
-        const errorType = (_b = exception.exceptionDetails.exception) === null || _b === void 0 ? void 0 : _b.className;
-        const symbolicatedErr = new symbolicateable_error_1.SymbolicateableError({
-            message: removeDelayRenderStack(cleanErrorMessage),
-            stackFrame: exception.exceptionDetails.stackTrace.callFrames.map((f) => callFrameToStackFrame(f)),
-            frame,
-            name: errorType,
-            stack: (_c = exception.exceptionDetails.exception) === null || _c === void 0 ? void 0 : _c.description,
-        });
-        onError(symbolicatedErr);
-    };
-    client.on('Runtime.exceptionThrown', handler);
-    return () => {
-        client.off('Runtime.exceptionThrown', handler);
-    };
-};
-exports.handleJavascriptException = handleJavascriptException;

package/dist/symbolicate-error.d.ts

@@ -1,3 +0,0 @@
-import { ErrorWithStackFrame } from './handle-javascript-exception';
-import type { SymbolicateableError } from './symbolicateable-error';
-export declare const symbolicateError: (symbolicateableError: SymbolicateableError) => Promise<ErrorWithStackFrame>;

package/dist/symbolicate-error.js

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.symbolicateError = void 0;
-const symbolicate_stacktrace_1 = require("../symbolicate-stacktrace");
-const handle_javascript_exception_1 = require("./handle-javascript-exception");
-const truthy_1 = require("./truthy");
-const symbolicateError = async (symbolicateableError) => {
-    const { delayRenderCall, stackFrame } = symbolicateableError;
-    const [mainErrorFrames, delayRenderFrames] = await Promise.all([
-        stackFrame ? (0, symbolicate_stacktrace_1.symbolicateStackTraceFromRemoteFrames)(stackFrame) : null,
-        delayRenderCall
-            ? (0, symbolicate_stacktrace_1.symbolicateStackTraceFromRemoteFrames)(delayRenderCall)
-            : null,
-    ].filter(truthy_1.truthy));
-    const symbolicatedErr = new handle_javascript_exception_1.ErrorWithStackFrame({
-        message: symbolicateableError.message,
-        symbolicatedStackFrames: mainErrorFrames,
-        frame: symbolicateableError.frame,
-        name: symbolicateableError.name,
-        delayRenderCall: delayRenderFrames,
-    });
-    return symbolicatedErr;
-};
-exports.symbolicateError = symbolicateError;

package/dist/symbolicate-errors.d.ts

@@ -1,7 +0,0 @@
-import type { SymbolicatedStackFrame, UnsymbolicatedStackFrame } from '@remotion/renderer';
-import type { SourceMapConsumer } from 'source-map';
-import { ErrorWithStackFrame } from './error-with-stack-frame';
-export declare const symbolicateError: (symbolicateableError: SymbolicateableError) => Promise<ErrorWithStackFrame>;
-export declare const symbolicateStackTraceFromRemoteFrames: (frames: UnsymbolicatedStackFrame[]) => Promise<SymbolicatedStackFrame[]>;
-export declare const getSourceMapFromRemoteFile: (fileName: string) => Promise<any>;
-export declare const symbolicateFromSources: (frames: UnsymbolicatedStackFrame[], mapValues: Record<string, SourceMapConsumer | null>) => SymbolicatedStackFrame[];

package/dist/symbolicate-errors.js

@@ -1,90 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.symbolicateFromSources = exports.getSourceMapFromRemoteFile = exports.symbolicateStackTraceFromRemoteFrames = exports.symbolicateError = void 0;
-const renderer_1 = require("@remotion/renderer");
-const truthy_1 = require("./truthy");
-const error_with_stack_frame_1 = require("./error-with-stack-frame");
-const symbolicateError = async (symbolicateableError) => {
-    const { delayRenderCall, stackFrame } = symbolicateableError;
-    const [mainErrorFrames, delayRenderFrames] = await Promise.all([
-        stackFrame ? (0, exports.symbolicateStackTraceFromRemoteFrames)(stackFrame) : null,
-        delayRenderCall
-            ? (0, exports.symbolicateStackTraceFromRemoteFrames)(delayRenderCall)
-            : null,
-    ].filter(truthy_1.truthy));
-    const symbolicatedErr = new error_with_stack_frame_1.ErrorWithStackFrame({
-        message: symbolicateableError.message,
-        symbolicatedStackFrames: mainErrorFrames,
-        frame: symbolicateableError.frame,
-        name: symbolicateableError.name,
-        delayRenderCall: delayRenderFrames,
-    });
-    return symbolicatedErr;
-};
-exports.symbolicateError = symbolicateError;
-const symbolicateStackTraceFromRemoteFrames = async (frames) => {
-    const uniqueFileNames = [
-        ...new Set(frames
-            .map((f) => f.fileName)
-            .filter((f) => f.startsWith('http://') || f.startsWith('https://'))
-            .filter(truthy_1.truthy)),
-    ];
-    const maps = await Promise.all(uniqueFileNames.map((fileName) => {
-        return (0, exports.getSourceMapFromRemoteFile)(fileName);
-    }));
-    const mapValues = {};
-    for (let i = 0; i < uniqueFileNames.length; i++) {
-        mapValues[uniqueFileNames[i]] = maps[i];
-    }
-    return (0, exports.symbolicateFromSources)(frames, mapValues);
-};
-exports.symbolicateStackTraceFromRemoteFrames = symbolicateStackTraceFromRemoteFrames;
-const getSourceMapFromRemoteFile = async (fileName) => {
-    const fileContents = await renderer_1.RenderInternals.fetchUrl(fileName);
-    return renderer_1.RenderInternals.getSourceMap(fileName, fileContents, 'remote');
-};
-exports.getSourceMapFromRemoteFile = getSourceMapFromRemoteFile;
-const symbolicateFromSources = (frames, mapValues) => {
-    return frames
-        .map((frame) => {
-        const map = mapValues[frame.fileName];
-        if (!map) {
-            return null;
-        }
-        return symbolicateStackFrame(frame, map);
-    })
-        .filter(truthy_1.truthy);
-};
-exports.symbolicateFromSources = symbolicateFromSources;
-const symbolicateStackFrame = (frame, map) => {
-    const pos = getOriginalPosition(map, frame.lineNumber, frame.columnNumber);
-    const hasSource = pos.source ? map.sourceContentFor(pos.source, false) : null;
-    const scriptCode = hasSource && pos.line
-        ? getLinesAround(pos.line, 3, hasSource.split('\n'))
-        : null;
-    return {
-        originalColumnNumber: pos.column,
-        originalFileName: pos.source,
-        originalFunctionName: frame.functionName,
-        originalLineNumber: pos.line,
-        originalScriptCode: scriptCode,
-    };
-};
-const getOriginalPosition = (source_map, line, column) => {
-    const result = source_map.originalPositionFor({
-        line,
-        column,
-    });
-    return { line: result.line, column: result.column, source: result.source };
-};
-function getLinesAround(line, count, lines) {
-    const result = [];
-    for (let index = Math.max(0, line - 1 - count) + 1; index <= Math.min(lines.length - 1, line - 1 + count); ++index) {
-        result.push({
-            lineNumber: index + 1,
-            content: lines[index],
-            highlight: index + 1 === line,
-        });
-    }
-    return result;
-}

package/dist/symbolicate-stacktrace.d.ts

@@ -1,28 +0,0 @@
-import type { BasicSourceMapConsumer, IndexedSourceMapConsumer } from 'source-map';
-import { SourceMapConsumer } from 'source-map';
-import type { UnsymbolicatedStackFrame } from './parse-browser-error-stack';
-type ScriptLine = {
-    lineNumber: number;
-    content: string;
-    highlight: boolean;
-};
-export type SymbolicatedStackFrame = {
-    originalFunctionName: string | null;
-    originalFileName: string | null;
-    originalLineNumber: number | null;
-    originalColumnNumber: number | null;
-    originalScriptCode: ScriptLine[] | null;
-};
-export declare const symbolicateStackTraceFromRemoteFrames: (frames: UnsymbolicatedStackFrame[]) => Promise<SymbolicatedStackFrame[]>;
-export declare const symbolicateFromSources: (frames: UnsymbolicatedStackFrame[], mapValues: Record<string, SourceMapConsumer | null>) => SymbolicatedStackFrame[];
-export declare const symbolicateStackFrame: (frame: UnsymbolicatedStackFrame, map: SourceMapConsumer) => {
-    originalColumnNumber: number | null;
-    originalFileName: string | null;
-    originalFunctionName: any;
-    originalLineNumber: number | null;
-    originalScriptCode: ScriptLine[] | null;
-};
-export declare const getSourceMapFromRemoteFile: (fileName: string) => Promise<SourceMapConsumer | null>;
-export declare const getSourceMapFromLocalFile: (fileName: string) => Promise<SourceMapConsumer | null>;
-export type AnySourceMapConsumer = BasicSourceMapConsumer | IndexedSourceMapConsumer;
-export {};

package/dist/symbolicate-stacktrace.js

@@ -1,135 +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.getSourceMapFromLocalFile = exports.getSourceMapFromRemoteFile = exports.symbolicateStackFrame = exports.symbolicateFromSources = exports.symbolicateStackTraceFromRemoteFrames = void 0;
-const fs_1 = require("fs");
-const path_1 = __importDefault(require("path"));
-const source_map_1 = require("source-map");
-const read_file_1 = require("./assets/read-file");
-const truthy_1 = require("./truthy");
-function extractSourceMapUrl(fileContents) {
-    const regex = /\/\/[#@] ?sourceMappingURL=([^\s'"]+)\s*$/gm;
-    let match = null;
-    for (;;) {
-        const next = regex.exec(fileContents);
-        if (next === null || next === undefined) {
-            break;
-        }
-        match = next;
-    }
-    if (!(match === null || match === void 0 ? void 0 : match[1])) {
-        return null;
-    }
-    return match[1].toString();
-}
-const getSourceMap = async (filePath, fileContents, type) => {
-    const sm = extractSourceMapUrl(fileContents);
-    if (sm === null) {
-        return null;
-    }
-    if (sm.indexOf('data:') === 0) {
-        const base64 = /^data:application\/json;([\w=:"-]+;)*base64,/;
-        const match2 = sm.match(base64);
-        if (!match2) {
-            throw new Error('Sorry, non-base64 inline source-map encoding is not supported.');
-        }
-        const converted = window.atob(sm.substring(match2[0].length));
-        return new source_map_1.SourceMapConsumer(JSON.parse(converted));
-    }
-    if (type === 'local') {
-        // Find adjacent file: bundle.js -> bundle.js.map
-        const newFilePath = path_1.default.join(path_1.default.dirname(filePath), sm);
-        return new source_map_1.SourceMapConsumer((0, fs_1.readFileSync)(newFilePath, 'utf8'));
-    }
-    const index = filePath.lastIndexOf('/');
-    const url = filePath.substring(0, index + 1) + sm;
-    const obj = await fetchUrl(url);
-    return new source_map_1.SourceMapConsumer(obj);
-};
-const fetchUrl = async (url) => {
-    const res = await (0, read_file_1.readFile)(url);
-    return new Promise((resolve, reject) => {
-        let downloaded = '';
-        res.on('data', (d) => {
-            downloaded += d;
-        });
-        res.on('end', () => {
-            resolve(downloaded);
-        });
-        res.on('error', (err) => reject(err));
-    });
-};
-function getLinesAround(line, count, lines) {
-    const result = [];
-    for (let index = Math.max(0, line - 1 - count) + 1; index <= Math.min(lines.length - 1, line - 1 + count); ++index) {
-        result.push({
-            lineNumber: index + 1,
-            content: lines[index],
-            highlight: index + 1 === line,
-        });
-    }
-    return result;
-}
-const getOriginalPosition = (source_map, line, column) => {
-    const result = source_map.originalPositionFor({
-        line,
-        column,
-    });
-    return { line: result.line, column: result.column, source: result.source };
-};
-const symbolicateStackTraceFromRemoteFrames = async (frames) => {
-    const uniqueFileNames = [
-        ...new Set(frames
-            .map((f) => f.fileName)
-            .filter((f) => f.startsWith('http://') || f.startsWith('https://'))
-            .filter(truthy_1.truthy)),
-    ];
-    const maps = await Promise.all(uniqueFileNames.map((fileName) => {
-        return (0, exports.getSourceMapFromRemoteFile)(fileName);
-    }));
-    const mapValues = {};
-    for (let i = 0; i < uniqueFileNames.length; i++) {
-        mapValues[uniqueFileNames[i]] = maps[i];
-    }
-    return (0, exports.symbolicateFromSources)(frames, mapValues);
-};
-exports.symbolicateStackTraceFromRemoteFrames = symbolicateStackTraceFromRemoteFrames;
-const symbolicateFromSources = (frames, mapValues) => {
-    return frames
-        .map((frame) => {
-        const map = mapValues[frame.fileName];
-        if (!map) {
-            return null;
-        }
-        return (0, exports.symbolicateStackFrame)(frame, map);
-    })
-        .filter(truthy_1.truthy);
-};
-exports.symbolicateFromSources = symbolicateFromSources;
-const symbolicateStackFrame = (frame, map) => {
-    const pos = getOriginalPosition(map, frame.lineNumber, frame.columnNumber);
-    const hasSource = pos.source ? map.sourceContentFor(pos.source, false) : null;
-    const scriptCode = hasSource && pos.line
-        ? getLinesAround(pos.line, 3, hasSource.split('\n'))
-        : null;
-    return {
-        originalColumnNumber: pos.column,
-        originalFileName: pos.source,
-        originalFunctionName: frame.functionName,
-        originalLineNumber: pos.line,
-        originalScriptCode: scriptCode,
-    };
-};
-exports.symbolicateStackFrame = symbolicateStackFrame;
-const getSourceMapFromRemoteFile = async (fileName) => {
-    const fileContents = await fetchUrl(fileName);
-    return getSourceMap(fileName, fileContents, 'remote');
-};
-exports.getSourceMapFromRemoteFile = getSourceMapFromRemoteFile;
-const getSourceMapFromLocalFile = (fileName) => {
-    const fileContents = (0, fs_1.readFileSync)(fileName, 'utf8');
-    return getSourceMap(fileName, fileContents, 'local');
-};
-exports.getSourceMapFromLocalFile = getSourceMapFromLocalFile;

package/dist/symbolicateable-error.d.ts

@@ -1,16 +0,0 @@
-/**
- * A symbolicateable error is an error that can be symolicated by fetching the original sources. By throwing a symbolicateable error, Remotion CLI will attempt to symplicate it
- */
-import type { UnsymbolicatedStackFrame } from '../parse-browser-error-stack';
-export declare class SymbolicateableError extends Error {
-    stackFrame: UnsymbolicatedStackFrame[] | null;
-    delayRenderCall: UnsymbolicatedStackFrame[] | null;
-    frame: number | null;
-    constructor({ message, stack, stackFrame, frame, name, }: {
-        message: string;
-        stack: string | undefined;
-        frame: number | null;
-        name: string;
-        stackFrame: UnsymbolicatedStackFrame[] | null;
-    });
-}

package/dist/symbolicateable-error.js

@@ -1,18 +0,0 @@
-"use strict";
-/**
- * A symbolicateable error is an error that can be symolicated by fetching the original sources. By throwing a symbolicateable error, Remotion CLI will attempt to symplicate it
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SymbolicateableError = void 0;
-const delay_render_embedded_stack_1 = require("../delay-render-embedded-stack");
-class SymbolicateableError extends Error {
-    constructor({ message, stack, stackFrame, frame, name, }) {
-        super(message);
-        this.stack = stack;
-        this.stackFrame = stackFrame;
-        this.frame = frame;
-        this.name = name;
-        this.delayRenderCall = stack ? (0, delay_render_embedded_stack_1.parseDelayRenderEmbeddedStack)(stack) : null;
-    }
-}
-exports.SymbolicateableError = SymbolicateableError;