@remotion/cli 4.0.111 → 4.0.113

package/dist/editor/helpers/get-timeline-sequence-sort-key.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getTimelineSequenceSequenceSortKey = void 0;
+const getTimelineSequenceSequenceSortKey = (track, tracks, sameHashes = {}) => {
+    const firstSequenceWithSameHash = tracks.find((t) => sameHashes[track.hash].includes(t.sequence.id));
+    const id = String(firstSequenceWithSameHash.sequence.nonce).padStart(6, '0');
+    if (!track.sequence.parent) {
+        return id;
+    }
+    const parent = tracks.find((t) => t.sequence.id === track.sequence.parent);
+    if (!parent) {
+        // Due to effects and conditional `showInTimeline`, a parent
+        // may not exist in the `allTracks` array.
+        return id;
+    }
+    const firstParentWithSameHash = tracks.find((a) => {
+        return sameHashes[parent.hash].includes(a.sequence.id);
+    });
+    if (!firstParentWithSameHash) {
+        throw new Error('could not find parent: ' + track.sequence.parent);
+    }
+    return `${(0, exports.getTimelineSequenceSequenceSortKey)(firstParentWithSameHash, tracks, sameHashes)}-${id}`;
+};
+exports.getTimelineSequenceSequenceSortKey = getTimelineSequenceSequenceSortKey;

package/dist/editor/helpers/is-composition-still.d.ts

@@ -0,0 +1,3 @@
+export declare const isCompositionStill: (comp: {
+    durationInFrames: number | undefined;
+} | null) => boolean;

package/dist/editor/helpers/is-composition-still.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isCompositionStill = void 0;
+const isCompositionStill = (comp) => {
+    if (!comp) {
+        return false;
+    }
+    return comp.durationInFrames === 1;
+};
+exports.isCompositionStill = isCompositionStill;

package/dist/editor/helpers/is-current-selected-still.d.ts

@@ -0,0 +1,6 @@
+export type Dimensions = {
+    width: number;
+    height: number;
+};
+export declare const useIsStill: () => boolean;
+export declare const useIsVideoComposition: () => boolean;

package/dist/editor/helpers/is-current-selected-still.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useIsVideoComposition = exports.useIsStill = void 0;
+const react_1 = require("react");
+const remotion_1 = require("remotion");
+const is_composition_still_1 = require("./is-composition-still");
+const useIsStill = () => {
+    const resolved = remotion_1.Internals.useResolvedVideoConfig(null);
+    if (!resolved || resolved.type !== 'success') {
+        return false;
+    }
+    return (0, is_composition_still_1.isCompositionStill)(resolved.result);
+};
+exports.useIsStill = useIsStill;
+const useIsVideoComposition = () => {
+    const isStill = (0, exports.useIsStill)();
+    const { canvasContent } = (0, react_1.useContext)(remotion_1.Internals.CompositionManager);
+    if (canvasContent === null) {
+        return false;
+    }
+    if (isStill) {
+        return false;
+    }
+    return canvasContent.type === 'composition';
+};
+exports.useIsVideoComposition = useIsVideoComposition;

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

@@ -0,0 +1 @@
+export declare const noop: () => undefined;

package/dist/editor/helpers/noop.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.noop = void 0;
+const noop = () => undefined;
+exports.noop = noop;

package/dist/editor/helpers/open-in-editor.d.ts

@@ -0,0 +1,2 @@
+import type { SymbolicatedStackFrame } from '../../preview-server/error-overlay/react-overlay/utils/stack-frame';
+export declare const openInEditor: (stack: SymbolicatedStackFrame) => Promise<Response>;

package/dist/editor/helpers/open-in-editor.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.openInEditor = void 0;
+const openInEditor = (stack) => {
+    const { originalFileName, originalLineNumber, originalColumnNumber, originalFunctionName, originalScriptCode, } = stack;
+    return fetch(`/api/open-in-editor`, {
+        method: 'post',
+        headers: {
+            'content-type': 'application/json',
+        },
+        body: JSON.stringify({
+            stack: {
+                originalFileName,
+                originalLineNumber,
+                originalColumnNumber,
+                originalFunctionName,
+                originalScriptCode,
+            },
+        }),
+    });
+};
+exports.openInEditor = openInEditor;

package/dist/editor/helpers/persist-open-folders.d.ts

@@ -0,0 +1,6 @@
+export declare const openFolderKey: (folderName: string, parentName: string | null) => string;
+export type ExpandedFoldersState = Record<string, boolean>;
+type PersistanceType = 'assets' | 'compositions';
+export declare const persistExpandedFolders: (type: PersistanceType, state: ExpandedFoldersState) => void;
+export declare const loadExpandedFolders: (type: PersistanceType) => ExpandedFoldersState;
+export {};

package/dist/editor/helpers/persist-open-folders.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.loadExpandedFolders = exports.persistExpandedFolders = exports.openFolderKey = void 0;
+const openFolderKey = (folderName, parentName) => {
+    return [parentName !== null && parentName !== void 0 ? parentName : 'no-parent', folderName].join('/');
+};
+exports.openFolderKey = openFolderKey;
+const localStorageKey = (type) => type === 'compositions'
+    ? 'remotion.expandedFolders'
+    : 'remotion.expandedAssetFolders';
+const persistExpandedFolders = (type, state) => {
+    window.localStorage.setItem(localStorageKey(type), JSON.stringify(state));
+};
+exports.persistExpandedFolders = persistExpandedFolders;
+const loadExpandedFolders = (type) => {
+    const item = window.localStorage.getItem(localStorageKey(type));
+    if (item === null) {
+        return {};
+    }
+    return JSON.parse(item);
+};
+exports.loadExpandedFolders = loadExpandedFolders;

package/dist/editor/helpers/pick-color.d.ts

@@ -0,0 +1 @@
+export declare const pickColor: () => void;

package/dist/editor/helpers/pick-color.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.pickColor = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const layout_1 = require("../components/layout");
+const ColorDot_1 = require("../components/Notifications/ColorDot");
+const NotificationCenter_1 = require("../components/Notifications/NotificationCenter");
+const copy_text_1 = require("./copy-text");
+const pickColor = () => {
+    // @ts-expect-error
+    const open = new EyeDropper().open();
+    open
+        .then((color) => {
+        (0, copy_text_1.copyText)(color.sRGBHex)
+            .then(() => {
+            var _a;
+            (_a = NotificationCenter_1.notificationCenter.current) === null || _a === void 0 ? void 0 : _a.addNotification({
+                content: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ColorDot_1.ColorDot, { color: color.sRGBHex }), " ", (0, jsx_runtime_1.jsx)(layout_1.Spacing, { x: 1 }), " Copied", ' ', color.sRGBHex] })),
+                created: Date.now(),
+                duration: 2000,
+                id: String(Math.random()),
+            });
+        })
+            .catch((err) => {
+            (0, NotificationCenter_1.sendErrorNotification)(`Could not copy: ${err.message}`);
+        });
+    })
+        .catch((err) => {
+        var _a;
+        if (err.message.includes('canceled')) {
+            return;
+        }
+        (_a = NotificationCenter_1.notificationCenter.current) === null || _a === void 0 ? void 0 : _a.addNotification({
+            content: `Could not pick color.`,
+            duration: 2000,
+            created: Date.now(),
+            id: String(Math.random()),
+        });
+    });
+};
+exports.pickColor = pickColor;

package/dist/editor/helpers/presets-labels.d.ts

@@ -0,0 +1,2 @@
+import type { X264Preset } from '@remotion/renderer';
+export declare const labelx264Preset: (profile: X264Preset) => "medium" | "ultrafast" | "superfast" | "veryfast" | "faster" | "fast" | "slow" | "slower" | "veryslow" | "placebo";

package/dist/editor/helpers/presets-labels.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.labelx264Preset = void 0;
+const labelx264Preset = (profile) => {
+    if (profile === 'ultrafast') {
+        return 'ultrafast';
+    }
+    if (profile === 'superfast') {
+        return 'superfast';
+    }
+    if (profile === 'veryfast') {
+        return 'veryfast';
+    }
+    if (profile === 'faster') {
+        return 'faster';
+    }
+    if (profile === 'fast') {
+        return 'fast';
+    }
+    if (profile === 'medium') {
+        return 'medium';
+    }
+    if (profile === 'slow') {
+        return 'slow';
+    }
+    if (profile === 'slower') {
+        return 'slower';
+    }
+    if (profile === 'veryslow') {
+        return 'veryslow';
+    }
+    if (profile === 'placebo') {
+        return 'placebo';
+    }
+    throw new TypeError(`Unknown x264 preset: ${profile}`);
+};
+exports.labelx264Preset = labelx264Preset;

package/dist/editor/helpers/prores-labels.d.ts

@@ -0,0 +1,2 @@
+import type { ProResProfile } from '@remotion/renderer';
+export declare const labelProResProfile: (profile: ProResProfile) => "4444" | "4444 XQ (Best)" | "HQ" | "Proxy (Worst)" | "Light" | "Standard";

package/dist/editor/helpers/prores-labels.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.labelProResProfile = void 0;
+const labelProResProfile = (profile) => {
+    if (profile === '4444') {
+        return '4444';
+    }
+    if (profile === '4444-xq') {
+        return '4444 XQ (Best)';
+    }
+    if (profile === 'hq') {
+        return 'HQ';
+    }
+    if (profile === 'proxy') {
+        return 'Proxy (Worst)';
+    }
+    if (profile === 'light') {
+        return 'Light';
+    }
+    if (profile === 'standard') {
+        return 'Standard';
+    }
+    throw new TypeError(`Unknown ProRes profile: ${profile}`);
+};
+exports.labelProResProfile = labelProResProfile;

package/dist/editor/helpers/render-modal-sections.d.ts

@@ -0,0 +1,9 @@
+import type { Codec } from '@remotion/renderer';
+import type { RenderType } from '../components/RenderModal/RenderModalAdvanced';
+type Section = 'general' | 'picture' | 'advanced' | 'data' | 'gif' | 'audio';
+export declare const useRenderModalSections: (renderMode: RenderType, codec: Codec) => {
+    tab: Section;
+    setTab: import("react").Dispatch<import("react").SetStateAction<Section>>;
+    shownTabs: Section[];
+};
+export {};

package/dist/editor/helpers/render-modal-sections.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useRenderModalSections = void 0;
+const react_1 = require("react");
+const useRenderModalSections = (renderMode, codec) => {
+    const [selectedTab, setTab] = (0, react_1.useState)('general');
+    const shownTabs = (0, react_1.useMemo)(() => {
+        if (renderMode === 'audio') {
+            return ['general', 'data', 'audio', 'advanced'];
+        }
+        if (renderMode === 'still') {
+            return ['general', 'data', 'picture', 'advanced'];
+        }
+        if (renderMode === 'sequence') {
+            return ['general', 'data', 'picture', 'advanced'];
+        }
+        if (renderMode === 'video') {
+            if (codec === 'gif') {
+                return ['general', 'data', 'picture', 'gif', 'advanced'];
+            }
+            return ['general', 'data', 'picture', 'audio', 'advanced'];
+        }
+        throw new TypeError('Unknown render mode');
+    }, [codec, renderMode]);
+    const tab = (0, react_1.useMemo)(() => {
+        if (!shownTabs.includes(selectedTab)) {
+            return shownTabs[0];
+        }
+        return selectedTab;
+    }, [selectedTab, shownTabs]);
+    return (0, react_1.useMemo)(() => {
+        return { tab, setTab, shownTabs };
+    }, [tab, shownTabs]);
+};
+exports.useRenderModalSections = useRenderModalSections;

package/dist/editor/helpers/timeline-layout.d.ts

@@ -0,0 +1,3 @@
+export declare const TIMELINE_PADDING = 16;
+export declare const TIMELINE_LAYER_HEIGHT = 40;
+export declare const TIMELINE_BORDER = 1;

package/dist/editor/helpers/timeline-layout.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TIMELINE_BORDER = exports.TIMELINE_LAYER_HEIGHT = exports.TIMELINE_PADDING = void 0;
+exports.TIMELINE_PADDING = 16;
+exports.TIMELINE_LAYER_HEIGHT = 40;
+exports.TIMELINE_BORDER = 1;

package/dist/editor/helpers/use-breakpoint.d.ts

@@ -0,0 +1 @@
+export declare function useBreakpoint(breakpoint: number): boolean;

package/dist/editor/helpers/use-breakpoint.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useBreakpoint = void 0;
+const react_1 = require("react");
+function useBreakpoint(breakpoint) {
+    const [compactUI, setCompactUI] = (0, react_1.useState)(window.innerWidth < breakpoint);
+    (0, react_1.useEffect)(() => {
+        function handleResize() {
+            setCompactUI(window.innerWidth < breakpoint);
+        }
+        window.addEventListener('resize', handleResize);
+        handleResize();
+        return () => window.removeEventListener('resize', handleResize);
+    }, [breakpoint]);
+    return compactUI;
+}
+exports.useBreakpoint = useBreakpoint;

package/dist/editor/helpers/use-file-existence.d.ts

@@ -0,0 +1 @@
+export declare const useFileExistence: (outName: string) => boolean;

package/dist/editor/helpers/use-file-existence.js

@@ -0,0 +1,66 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFileExistence = void 0;
+const react_1 = require("react");
+const event_source_1 = require("../../event-source");
+const actions_1 = require("../components/RenderQueue/actions");
+const client_id_1 = require("./client-id");
+const useFileExistence = (outName) => {
+    const [exists, setExists] = (0, react_1.useState)(false);
+    const state = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx);
+    const clientId = state.type === 'connected' ? state.clientId : undefined;
+    const currentOutName = (0, react_1.useRef)('');
+    currentOutName.current = outName;
+    (0, react_1.useEffect)(() => {
+        if (!clientId) {
+            return;
+        }
+        (0, actions_1.subscribeToFileExistenceWatcher)({
+            file: outName,
+            clientId,
+        }).then((_exists) => {
+            if (currentOutName.current === outName) {
+                setExists(_exists);
+            }
+        });
+        return () => {
+            (0, actions_1.unsubscribeFromFileExistenceWatcher)({ file: outName, clientId });
+        };
+    }, [clientId, outName]);
+    (0, react_1.useEffect)(() => {
+        const listener = (event) => {
+            if (event.type !== 'watched-file-deleted') {
+                return;
+            }
+            if (event.file !== currentOutName.current) {
+                return;
+            }
+            if (currentOutName.current === outName) {
+                setExists(false);
+            }
+        };
+        const unsub = (0, event_source_1.subscribeToEvent)('watched-file-deleted', listener);
+        return () => {
+            unsub();
+        };
+    }, [outName]);
+    (0, react_1.useEffect)(() => {
+        const listener = (event) => {
+            if (event.type !== 'watched-file-undeleted') {
+                return;
+            }
+            if (event.file !== outName) {
+                return;
+            }
+            if (currentOutName.current === outName) {
+                setExists(true);
+            }
+        };
+        const unsub = (0, event_source_1.subscribeToEvent)('watched-file-undeleted', listener);
+        return () => {
+            unsub();
+        };
+    }, [outName]);
+    return exists;
+};
+exports.useFileExistence = useFileExistence;

package/dist/editor/helpers/use-keybinding.d.ts

@@ -0,0 +1,16 @@
+import type { KeyEventType } from '../state/keybindings';
+export declare const areKeyboardShortcutsDisabled: () => boolean;
+export declare const useKeybinding: () => {
+    registerKeybinding: (options: {
+        event: KeyEventType;
+        key: string;
+        commandCtrlKey: boolean;
+        callback: (e: KeyboardEvent) => void;
+        preventDefault: boolean;
+        triggerIfInputFieldFocused: boolean;
+        keepRegisteredWhenNotHighestContext: boolean;
+    }) => {
+        unregister: () => void;
+    };
+    isHighestContext: boolean;
+};

package/dist/editor/helpers/use-keybinding.js

@@ -0,0 +1,70 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useKeybinding = exports.areKeyboardShortcutsDisabled = void 0;
+const react_1 = require("react");
+const keybindings_1 = require("../state/keybindings");
+const z_index_1 = require("../state/z-index");
+if (!process.env.KEYBOARD_SHORTCUTS_ENABLED) {
+    // eslint-disable-next-line no-console
+    console.warn('Keyboard shortcuts disabled either due to: a) --disable-keyboard-shortcuts being passed b) Config.setKeyboardShortcutsEnabled(false) being set or c) a Remotion version mismatch.');
+}
+const areKeyboardShortcutsDisabled = () => {
+    return !process.env.KEYBOARD_SHORTCUTS_ENABLED;
+};
+exports.areKeyboardShortcutsDisabled = areKeyboardShortcutsDisabled;
+const useKeybinding = () => {
+    const [paneId] = (0, react_1.useState)(() => String(Math.random()));
+    const context = (0, react_1.useContext)(keybindings_1.KeybindingContext);
+    const { isHighestContext } = (0, z_index_1.useZIndex)();
+    const registerKeybinding = (0, react_1.useCallback)((options) => {
+        if (!process.env.KEYBOARD_SHORTCUTS_ENABLED) {
+            return {
+                unregister: () => undefined,
+            };
+        }
+        if (!isHighestContext && !options.keepRegisteredWhenNotHighestContext) {
+            return {
+                unregister: () => undefined,
+            };
+        }
+        const listener = (e) => {
+            const commandKey = window.navigator.platform.startsWith('Mac')
+                ? e.metaKey
+                : e.ctrlKey;
+            if (e.key.toLowerCase() === options.key.toLowerCase() &&
+                options.commandCtrlKey === commandKey) {
+                if (!options.triggerIfInputFieldFocused) {
+                    const { activeElement } = document;
+                    if (activeElement instanceof HTMLInputElement) {
+                        return;
+                    }
+                    if (activeElement instanceof HTMLTextAreaElement) {
+                        return;
+                    }
+                }
+                options.callback(e);
+                if (options.preventDefault) {
+                    e.preventDefault();
+                }
+            }
+        };
+        const toRegister = {
+            registeredFromPane: paneId,
+            event: options.event,
+            key: options.key,
+            callback: listener,
+            id: String(Math.random()),
+        };
+        context.registerKeybinding(toRegister);
+        return {
+            unregister: () => context.unregisterKeybinding(toRegister),
+        };
+    }, [context, isHighestContext, paneId]);
+    (0, react_1.useEffect)(() => {
+        return () => {
+            context.unregisterPane(paneId);
+        };
+    }, [context, paneId]);
+    return (0, react_1.useMemo)(() => ({ registerKeybinding, isHighestContext }), [registerKeybinding, isHighestContext]);
+};
+exports.useKeybinding = useKeybinding;

package/dist/editor/helpers/use-menu-structure.d.ts

@@ -0,0 +1,7 @@
+import type { Menu } from '../components/Menu/MenuItem';
+import type { TQuickSwitcherResult } from '../components/QuickSwitcher/QuickSwitcherResult';
+import type { ModalState } from '../state/modals';
+type Structure = Menu[];
+export declare const useMenuStructure: (closeMenu: () => void) => Structure;
+export declare const makeSearchResults: (actions: Structure, setSelectedModal: (value: React.SetStateAction<ModalState | null>) => void) => TQuickSwitcherResult[];
+export {};