@remotion/cli 3.3.78 → 3.3.79

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

@@ -1,43 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CrfSetting = exports.useCrfState = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const client_1 = require("@remotion/renderer/client");
-const react_1 = require("react");
-const NumberSetting_1 = require("./NumberSetting");
-const getDefaultCrfState = () => {
-    return client_1.BrowserSafeApis.validCodecs
-        .map((c) => {
-        return [c, client_1.BrowserSafeApis.getDefaultCrfForCodec(c)];
-    })
-        .reduce((acc, [codec, crf]) => {
-        return {
-            ...acc,
-            [codec]: crf,
-        };
-    }, {});
-};
-const useCrfState = (codec) => {
-    const [state, setState] = (0, react_1.useState)(() => getDefaultCrfState());
-    const range = client_1.BrowserSafeApis.getValidCrfRanges(codec);
-    const setCrf = (updater) => {
-        setState((q) => {
-            return {
-                ...q,
-                [codec]: typeof updater === 'number' ? updater : updater(q[codec]),
-            };
-        });
-    };
-    return {
-        crf: state[codec],
-        setCrf,
-        minCrf: range[0],
-        maxCrf: range[1],
-        shouldDisplayOption: range[0] !== range[1],
-    };
-};
-exports.useCrfState = useCrfState;
-const CrfSetting = ({ crf, setCrf, min, max }) => {
-    return ((0, jsx_runtime_1.jsx)(NumberSetting_1.NumberSetting, { min: min, max: max, name: "CRF", onValueChanged: setCrf, value: crf, step: 1 }));
-};
-exports.CrfSetting = CrfSetting;

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

@@ -1,6 +0,0 @@
-import React from 'react';
-export declare const EnforceAudioTrackSetting: React.FC<{
-    enforceAudioTrack: boolean;
-    setEnforceAudioTrack: React.Dispatch<React.SetStateAction<boolean>>;
-    muted: boolean;
-}>;

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

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.EnforceAudioTrackSetting = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Checkbox_1 = require("../Checkbox");
-const layout_1 = require("./layout");
-const EnforceAudioTrackSetting = ({ enforceAudioTrack, muted, setEnforceAudioTrack }) => {
-    const onEnforceAudioTrackChanged = (0, react_1.useCallback)((e) => {
-        setEnforceAudioTrack(e.target.checked);
-    }, [setEnforceAudioTrack]);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: layout_1.optionRow, children: [(0, jsx_runtime_1.jsx)("div", { style: layout_1.label, children: "Enforce Audio Track" }), (0, jsx_runtime_1.jsx)("div", { style: layout_1.rightRow, children: (0, jsx_runtime_1.jsx)(Checkbox_1.Checkbox, { disabled: muted && !enforceAudioTrack, checked: enforceAudioTrack, onChange: onEnforceAudioTrackChanged }) })] }));
-};
-exports.EnforceAudioTrackSetting = EnforceAudioTrackSetting;

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

@@ -1,8 +0,0 @@
-import React from 'react';
-export declare const FrameRangeSetting: React.FC<{
-    startFrame: number;
-    endFrame: number;
-    setEndFrame: React.Dispatch<React.SetStateAction<number | null>>;
-    setStartFrame: React.Dispatch<React.SetStateAction<number | null>>;
-    durationInFrames: number;
-}>;

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

@@ -1,42 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FrameRangeSetting = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const InputDragger_1 = require("../NewComposition/InputDragger");
-const RemInput_1 = require("../NewComposition/RemInput");
-const layout_1 = require("./layout");
-const FrameRangeSetting = ({ startFrame, endFrame, setEndFrame, durationInFrames, setStartFrame }) => {
-    const maxStartFrame = endFrame - 1;
-    const minStartFrame = 0;
-    const minEndFrame = startFrame + 1;
-    const maxEndFrame = durationInFrames - 1;
-    const onStartFrameChangedDirectly = (0, react_1.useCallback)((newStartFrame) => {
-        setStartFrame(newStartFrame);
-    }, [setStartFrame]);
-    const onEndFrameChangedDirectly = (0, react_1.useCallback)((newEndFrame) => {
-        setEndFrame(newEndFrame);
-    }, [setEndFrame]);
-    const onStartFrameChanged = (0, react_1.useCallback)((e) => {
-        setStartFrame((q) => {
-            const newStartFrame = parseInt(e, 10);
-            if (Number.isNaN(newStartFrame)) {
-                return q;
-            }
-            const newStartFrameClamped = Math.min(maxStartFrame, Math.max(newStartFrame, minStartFrame));
-            return newStartFrameClamped;
-        });
-    }, [maxStartFrame, setStartFrame]);
-    const onEndFrameChanged = (0, react_1.useCallback)((e) => {
-        setEndFrame((q) => {
-            const newEndFrame = parseInt(e, 10);
-            if (Number.isNaN(newEndFrame)) {
-                return q;
-            }
-            const newEndFrameClamped = Math.min(maxEndFrame, Math.max(newEndFrame, minEndFrame));
-            return newEndFrameClamped;
-        });
-    }, [maxEndFrame, minEndFrame, setEndFrame]);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: layout_1.optionRow, children: [(0, jsx_runtime_1.jsx)("div", { style: layout_1.label, children: "Frame range" }), (0, jsx_runtime_1.jsxs)("div", { style: layout_1.rightRow, children: [(0, jsx_runtime_1.jsx)(RemInput_1.RightAlignInput, { children: (0, jsx_runtime_1.jsx)(InputDragger_1.InputDragger, { value: startFrame, onTextChange: onStartFrameChanged, placeholder: `${minStartFrame}-${maxStartFrame}`, onValueChange: onStartFrameChangedDirectly, name: "startFrame", step: 1, min: minStartFrame, max: maxStartFrame }) }), (0, jsx_runtime_1.jsx)(RemInput_1.RightAlignInput, { children: (0, jsx_runtime_1.jsx)(InputDragger_1.InputDragger, { value: endFrame, onTextChange: onEndFrameChanged, placeholder: `${minEndFrame}-${maxEndFrame}`, onValueChange: onEndFrameChangedDirectly, name: "endFrame", step: 1, min: minEndFrame, max: maxEndFrame }) })] })] }));
-};
-exports.FrameRangeSetting = FrameRangeSetting;

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

@@ -1,5 +0,0 @@
-import React from 'react';
-export declare const InfoBubble: React.FC<{
-    title: string;
-    children: React.ReactNode;
-}>;

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

@@ -1,111 +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.InfoBubble = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const player_1 = require("@remotion/player");
-const react_1 = require("react");
-const react_dom_1 = __importDefault(require("react-dom"));
-const colors_1 = require("../../helpers/colors");
-const z_index_1 = require("../../state/z-index");
-const portals_1 = require("../Menu/portals");
-const styles_1 = require("../Menu/styles");
-const InfoTooltip_1 = require("./InfoTooltip");
-const icon = {
-    color: colors_1.LIGHT_TEXT,
-    height: 15,
-};
-const container = {
-    display: 'inline-block',
-    border: 'none',
-    fontSize: 14,
-    verticalAlign: 'text-bottom',
-};
-const InfoBubble = ({ title, children }) => {
-    const [hovered, setIsHovered] = (0, react_1.useState)(false);
-    const [opened, setOpened] = (0, react_1.useState)(false);
-    const ref = (0, react_1.useRef)(null);
-    const { tabIndex, currentZIndex } = (0, z_index_1.useZIndex)();
-    const size = player_1.PlayerInternals.useElementSize(ref, {
-        triggerOnWindowResize: true,
-        shouldApplyCssTransforms: true,
-    });
-    const refresh = size === null || size === void 0 ? void 0 : size.refresh;
-    const onHide = (0, react_1.useCallback)(() => {
-        setOpened(false);
-    }, []);
-    (0, react_1.useEffect)(() => {
-        const { current } = ref;
-        if (!current) {
-            return;
-        }
-        const onMouseEnter = () => setIsHovered(true);
-        const onMouseLeave = () => setIsHovered(false);
-        const onPointerDown = (e) => {
-            e.stopPropagation();
-            return setOpened((o) => {
-                if (!o) {
-                    refresh === null || refresh === void 0 ? void 0 : refresh();
-                }
-                return !o;
-            });
-        };
-        const onClick = (e) => {
-            e.stopPropagation();
-            const isKeyboardInitiated = e.detail === 0;
-            if (!isKeyboardInitiated) {
-                return;
-            }
-            return setOpened((o) => {
-                return !o;
-            });
-        };
-        current.addEventListener('mouseenter', onMouseEnter);
-        current.addEventListener('mouseleave', onMouseLeave);
-        current.addEventListener('pointerdown', onPointerDown);
-        current.addEventListener('click', onClick);
-        return () => {
-            current.removeEventListener('mouseenter', onMouseEnter);
-            current.removeEventListener('mouseleave', onMouseLeave);
-            current.removeEventListener('pointerdown', onPointerDown);
-            current.removeEventListener('click', onClick);
-        };
-    }, [refresh]);
-    const portalStyle = (0, react_1.useMemo)(() => {
-        if (!opened || !size) {
-            return null;
-        }
-        const spaceToBottom = size.windowSize.height - (size.top + size.height);
-        const spaceToTop = size.top;
-        const layout = spaceToTop > spaceToBottom ? 'bottom' : 'top';
-        return {
-            ...(layout === 'top'
-                ? {
-                    position: 'fixed',
-                    top: size.top + size.height,
-                }
-                : {
-                    position: 'fixed',
-                    bottom: size.windowSize.height - size.top,
-                }),
-            left: size.left,
-        };
-    }, [opened, size]);
-    const style = (0, react_1.useMemo)(() => {
-        return {
-            ...container,
-            userSelect: 'none',
-            color: 'white',
-            display: 'inline-flex',
-            flexDirection: 'row',
-            alignItems: 'center',
-        };
-    }, []);
-    // TODO: Can click two info bubbles at the same time
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("button", { ref: ref, tabIndex: tabIndex, style: style, title: title, type: "button", children: (0, jsx_runtime_1.jsx)("svg", { style: icon, viewBox: "0 0 512 512", children: (0, jsx_runtime_1.jsx)("path", { fill: hovered ? 'white' : colors_1.LIGHT_TEXT, d: "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24h80c13.3 0 24-10.7 24-24s-10.7-24-24-24h-8V248c0-13.3-10.7-24-24-24H216c-13.3 0-24 10.7-24 24s10.7 24 24 24h24v64H216zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z" }) }) }), portalStyle
-                ? react_dom_1.default.createPortal((0, jsx_runtime_1.jsx)("div", { style: styles_1.outerPortal, className: "css-reset", children: (0, jsx_runtime_1.jsx)(z_index_1.HigherZIndex, { onOutsideClick: onHide, onEscape: onHide, children: (0, jsx_runtime_1.jsx)("div", { style: portalStyle, children: (0, jsx_runtime_1.jsx)(InfoTooltip_1.InfoTooltip, { children: children }) }) }) }), (0, portals_1.getPortal)(currentZIndex))
-                : null] }));
-};
-exports.InfoBubble = InfoBubble;

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

@@ -1,4 +0,0 @@
-import React from 'react';
-export declare const InfoTooltip: React.FC<{
-    children: React.ReactNode;
-}>;

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

@@ -1,30 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InfoTooltip = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const colors_1 = require("../../helpers/colors");
-const styles_1 = require("../Menu/styles");
-const container = {
-    padding: '10px 12px',
-    // TODO: Depending on direction
-    boxShadow: styles_1.SHADOW_TOWARDS_TOP,
-    background: colors_1.BACKGROUND,
-    color: 'white',
-    border: '0.5px solid ' + colors_1.BORDER_COLOR,
-    maxHeight: 200,
-    overflow: 'auto',
-};
-const arrow = {
-    height: 7,
-    display: 'block',
-    overflow: 'visible',
-    marginTop: -0.5,
-    marginLeft: 7,
-};
-const InfoTooltip = ({ children }) => {
-    return (
-    // TODO: Down arrow
-    // TODO: not scrolling with portal
-    (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { style: container, children: children }), (0, jsx_runtime_1.jsx)("svg", { viewBox: "0 0 14 7", style: arrow, children: (0, jsx_runtime_1.jsx)("path", { d: `M 14 0 L 7 7 L 0 0`, fill: colors_1.BACKGROUND, strokeLinecap: "butt", stroke: colors_1.BORDER_COLOR, strokeWidth: 0.5 }) })] }));
-};
-exports.InfoTooltip = InfoTooltip;

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

@@ -1,6 +0,0 @@
-import React from 'react';
-export declare const MutedSetting: React.FC<{
-    muted: boolean;
-    setMuted: React.Dispatch<React.SetStateAction<boolean>>;
-    enforceAudioTrack: boolean;
-}>;

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

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MutedSetting = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Checkbox_1 = require("../Checkbox");
-const layout_1 = require("./layout");
-const MutedSetting = ({ muted, setMuted, enforceAudioTrack }) => {
-    const onMutedChanged = (0, react_1.useCallback)((e) => {
-        setMuted(e.target.checked);
-    }, [setMuted]);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: layout_1.optionRow, children: [(0, jsx_runtime_1.jsx)("div", { style: layout_1.label, children: "Muted" }), (0, jsx_runtime_1.jsx)("div", { style: layout_1.rightRow, children: (0, jsx_runtime_1.jsx)(Checkbox_1.Checkbox, { checked: muted, disabled: enforceAudioTrack && !muted, onChange: onMutedChanged }) })] }));
-};
-exports.MutedSetting = MutedSetting;

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

@@ -1,5 +0,0 @@
-import React from 'react';
-export declare const NumberOfLoopsSetting: React.FC<{
-    numberOfGifLoops: number;
-    setNumberOfGifLoops: React.Dispatch<React.SetStateAction<number>>;
-}>;

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

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NumberOfLoopsSetting = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const InputDragger_1 = require("../NewComposition/InputDragger");
-const RemInput_1 = require("../NewComposition/RemInput");
-const layout_1 = require("./layout");
-const min = 0;
-const NumberOfLoopsSetting = ({ numberOfGifLoops, setNumberOfGifLoops }) => {
-    const onNumberOfGifLoopsChangedDirectly = (0, react_1.useCallback)((newConcurrency) => {
-        setNumberOfGifLoops(newConcurrency);
-    }, [setNumberOfGifLoops]);
-    const onNumberOfGifLoopsChanged = (0, react_1.useCallback)((e) => {
-        setNumberOfGifLoops((q) => {
-            const newConcurrency = parseInt(e, 10);
-            if (Number.isNaN(newConcurrency)) {
-                return q;
-            }
-            const newConcurrencyClamped = Math.max(newConcurrency, min);
-            return newConcurrencyClamped;
-        });
-    }, [setNumberOfGifLoops]);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: layout_1.optionRow, children: [(0, jsx_runtime_1.jsx)("div", { style: layout_1.label, children: "Number of loops" }), (0, jsx_runtime_1.jsx)("div", { style: layout_1.rightRow, children: (0, jsx_runtime_1.jsx)(RemInput_1.RightAlignInput, { children: (0, jsx_runtime_1.jsx)(InputDragger_1.InputDragger, { value: numberOfGifLoops, onTextChange: onNumberOfGifLoopsChanged, placeholder: `${min}-`, onValueChange: onNumberOfGifLoopsChangedDirectly, name: "number-of-gif-loops", step: 1, min: min }) }) })] }));
-};
-exports.NumberOfLoopsSetting = NumberOfLoopsSetting;

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

@@ -1,12 +0,0 @@
-import type { RemotionOption } from '@remotion/renderer';
-import React from 'react';
-export declare const NumberSetting: React.FC<{
-    name: string;
-    value: number;
-    onValueChanged: React.Dispatch<React.SetStateAction<number>>;
-    max?: number;
-    min: number;
-    step: number;
-    formatter?: (value: string | number) => string;
-    hint?: RemotionOption;
-}>;

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

@@ -1,29 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NumberSetting = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const layout_1 = require("../layout");
-const InputDragger_1 = require("../NewComposition/InputDragger");
-const RemInput_1 = require("../NewComposition/RemInput");
-const InfoBubble_1 = require("./InfoBubble");
-const layout_2 = require("./layout");
-const OptionExplainer_1 = require("./OptionExplainer");
-const NumberSetting = ({ name, value, step, hint, onValueChanged, max, min, formatter }) => {
-    const onTextChanged = (0, react_1.useCallback)((e) => {
-        onValueChanged((q) => {
-            const newSetting = parseInt(e, 10);
-            if (Number.isNaN(newSetting)) {
-                return q;
-            }
-            return Math.min(max !== null && max !== void 0 ? max : Infinity, Math.max(newSetting, min));
-        });
-    }, [max, min, onValueChanged]);
-    const onValueChange = (0, react_1.useCallback)((newConcurrency) => {
-        onValueChanged(newConcurrency);
-    }, [onValueChanged]);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: layout_2.optionRow, children: [(0, jsx_runtime_1.jsxs)("div", { style: layout_2.label, children: [name, hint ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(layout_1.Spacing, { x: 0.25 }), ' ', (0, jsx_runtime_1.jsx)(InfoBubble_1.InfoBubble, { title: "Learn more about this option", children: (0, jsx_runtime_1.jsx)(OptionExplainer_1.OptionExplainer, { option: hint }) })] })) : null] }), (0, jsx_runtime_1.jsx)("div", { style: layout_2.rightRow, children: (0, jsx_runtime_1.jsx)(RemInput_1.RightAlignInput, { children: (0, jsx_runtime_1.jsx)(InputDragger_1.InputDragger, { value: value, name: name.toLowerCase(), onTextChange: onTextChanged, onValueChange: onValueChange, step: step, placeholder: [min, max]
-                            .map((f) => (f !== null && f !== undefined ? f : ''))
-                            .join('-'), min: min, max: max, formatter: formatter }) }) })] }));
-};
-exports.NumberSetting = NumberSetting;

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

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import type { RemotionOption } from '@remotion/renderer';
-export declare const OptionExplainer: React.FC<{
-    option: RemotionOption;
-}>;

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

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.OptionExplainer = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const layout_1 = require("../layout");
-const MenuDivider_1 = require("../Menu/MenuDivider");
-const container = {
-    fontSize: 14,
-};
-const title = {
-    fontSize: 14,
-};
-const description = {
-    fontSize: 14,
-    maxWidth: 200,
-};
-// TODO: No style of <code>
-const OptionExplainer = ({ option }) => {
-    return ((0, jsx_runtime_1.jsxs)("div", { style: container, children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("strong", { style: title, children: option.name }) }), (0, jsx_runtime_1.jsx)("div", { style: description, children: option.description }), (0, jsx_runtime_1.jsx)(layout_1.Spacing, { block: true, y: 0.5 }), (0, jsx_runtime_1.jsx)(MenuDivider_1.MenuDivider, {}), (0, jsx_runtime_1.jsxs)("div", { style: description, children: ["CLI flag: ", option.cliFlag] }), (0, jsx_runtime_1.jsxs)("div", { style: description, children: ["Node.JS option: ", option.ssrName] })] }));
-};
-exports.OptionExplainer = OptionExplainer;

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

@@ -1,5 +0,0 @@
-import React from 'react';
-export declare const QualitySetting: React.FC<{
-    quality: number;
-    setQuality: React.Dispatch<React.SetStateAction<number>>;
-}>;

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

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.QualitySetting = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const InputDragger_1 = require("../NewComposition/InputDragger");
-const RemInput_1 = require("../NewComposition/RemInput");
-const layout_1 = require("./layout");
-const MIN_QUALITY = 1;
-const MAX_QUALITY = 100;
-const QualitySetting = ({ quality, setQuality }) => {
-    const onQualityChangedDirectly = (0, react_1.useCallback)((newQuality) => {
-        setQuality(newQuality);
-    }, [setQuality]);
-    const onQualityChanged = (0, react_1.useCallback)((e) => {
-        setQuality((q) => {
-            const newQuality = parseInt(e, 10);
-            if (Number.isNaN(newQuality)) {
-                return q;
-            }
-            const newQualityClamped = Math.min(MAX_QUALITY, Math.max(newQuality, MIN_QUALITY));
-            return newQualityClamped;
-        });
-    }, [setQuality]);
-    return ((0, jsx_runtime_1.jsxs)("div", { style: layout_1.optionRow, children: [(0, jsx_runtime_1.jsx)("div", { style: layout_1.label, children: "JPEG Quality" }), (0, jsx_runtime_1.jsx)("div", { style: layout_1.rightRow, children: (0, jsx_runtime_1.jsx)(RemInput_1.RightAlignInput, { children: (0, jsx_runtime_1.jsx)(InputDragger_1.InputDragger, { value: quality, onTextChange: onQualityChanged, placeholder: `${MIN_QUALITY}-${MAX_QUALITY}`, onValueChange: onQualityChangedDirectly, name: "quality", step: 1, min: MIN_QUALITY, max: MAX_QUALITY }) }) })] }));
-};
-exports.QualitySetting = QualitySetting;

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;

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

@@ -1,29 +0,0 @@
-import type { AudioCodec, Codec, PixelFormat, ProResProfile, StillImageFormat, VideoImageFormat } from '@remotion/renderer';
-import React from 'react';
-import type { RenderType } from './RenderModalAdvanced';
-export declare const RenderModal: React.FC<{
-    compositionId: string;
-    initialFrame: number;
-    initialVideoImageFormat: VideoImageFormat;
-    initialStillImageFormat: StillImageFormat;
-    initialQuality: number;
-    initialScale: number;
-    initialVerbose: boolean;
-    initialOutName: string;
-    initialRenderType: RenderType;
-    initialVideoCodecForAudioTab: Codec;
-    initialVideoCodecForVideoTab: Codec;
-    initialAudioCodec: AudioCodec | null;
-    initialConcurrency: number;
-    minConcurrency: number;
-    maxConcurrency: number;
-    initialMuted: boolean;
-    initialEnforceAudioTrack: boolean;
-    initialProResProfile: ProResProfile;
-    initialPixelFormat: PixelFormat;
-    initialVideoBitrate: string | null;
-    initialAudioBitrate: string | null;
-    initialEveryNthFrame: number;
-    initialNumberOfGifLoops: number | null;
-    initialDelayRenderTimeout: number;
-}>;