@remotion/cli 3.2.34 → 3.2.35

package/LICENSE.md

@@ -1,34 +1,34 @@
 # Remotion License
 
-Depending on the type of your legal entity, you are granted permission to use Remotion for your project. Individuals and small companies are allowed to use Remotion create videos for free (even commercial), while a company license is required for for-profit organisations of a certain size. This two-tier system was designed to ensure funding for this project while still allowing the source code to be available and the program to be free for most. Read below for the exact terms of use.
+Depending on the type of your legal entity, you are granted permission to use Remotion for your project. Individuals and small companies are allowed to use Remotion to create videos for free (even commercial), while a company license is required for for-profit organizations of a certain size. This two-tier system was designed to ensure funding for this project while still allowing the source code to be available and the program to be free for most. Read below for the exact terms of use.
 
 - [Free license](#free-license)
 - [Company license](#company-license)
 
 ## Free license
 
-Copyright © 2022 [Jonny Burger](https://jonny.io)
+Copyright © 2022 [Remotion](https://www.remotion.dev/)
 
 ### Eligibility
 
 You are eligible to use Remotion for free if you are:
 
 - an individual
-- a for-profit organisation with up to 3 employees
-- a non-profit or not-for-profit organisation
+- a for-profit organization with up to 3 employees
+- a non-profit or not-for-profit organization
 - evaluating whether Remotion is a good fit, and are not yet using it in a commercial way
 
 ### Allowed use cases
 
-Permission is hereby granted, free of charge, to any person eligible for the "Free license", to use the software non-commercially or commercially for the purpose of creating videos and images and to modify and the software to their own liking, for the purpose of fulfilling their custom use case or to contribute bug fixes or improvements back to Remotion.
+Permission is hereby granted, free of charge, to any person eligible for the "Free license", to use the software non-commercially or commercially for the purpose of creating videos and images and to modify the software to their own liking, for the purpose of fulfilling their custom use case or to contribute bug fixes or improvements back to Remotion.
 
 ### Disallowed use cases
 
-It is not allowed to copy or modify Remotion code for the purpose of selling, renting, licensing, relicensing, sublicensing your own derivate of Remotion.
+It is not allowed to copy or modify Remotion code for the purpose of selling, renting, licensing, relicensing, or sublicensing your own derivate of Remotion.
 
 ### Warranty notice
 
-The software is provided "as is", without warranty of any kind, express or implied, including but not limited to the warranties of merchantability, fitness for a particular purpose and noninfringement. In no event shall the author or copyright holders be liable for any claim, damages or other liability, whether in an action of contract, tort or otherwise, arising from, out of or in connection with the software or the use or other dealings in the software.
+The software is provided "as is", without warranty of any kind, express or implied, including but not limited to the warranties of merchantability, fitness for a particular purpose, and non-infringement. In no event shall the author or copyright holders be liable for any claim, damages or other liability, whether in an action of contract, tort or otherwise, arising from, out of or in connection with the software or the use or other dealings in the software.
 
 ### Support
 

package/dist/check-version.d.ts

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

package/dist/check-version.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.checkNodeVersion = void 0;
+const log_1 = require("./log");
+const semver = require('semver');
+const current = process.version;
+const supported = '>=12.10.0';
+const checkNodeVersion = () => {
+    if (!semver.satisfies(current, supported)) {
+        log_1.Log.warn(`Required node version ${supported} not satisfied with current version ${current}.`);
+        log_1.Log.warn(`Update your node version to ${supported}`);
+    }
+};
+exports.checkNodeVersion = checkNodeVersion;

package/dist/editor/components/Editor.js

@@ -19,6 +19,7 @@ const KeyboardShortcutsModal_1 = require("./KeyboardShortcutsModal");
 const NewComposition_1 = __importDefault(require("./NewComposition/NewComposition"));
 const NoRegisterRoot_1 = require("./NoRegisterRoot");
 const NotificationCenter_1 = require("./Notifications/NotificationCenter");
+const QuickSwitcher_1 = __importDefault(require("./QuickSwitcher/QuickSwitcher"));
 const UpdateModal_1 = require("./UpdateModal/UpdateModal");
 const ZoomPersistor_1 = require("./ZoomPersistor");
 const background = {
@@ -48,6 +49,8 @@ const Editor = () => {
         });
         return () => cleanup();
     }, [Root, waitForRoot]);
-    return ((0, jsx_runtime_1.jsxs)(z_index_1.HigherZIndex, { onEscape: noop_1.noop, onOutsideClick: noop_1.noop, children: [(0, jsx_runtime_1.jsx)(timeline_zoom_1.TimelineZoomContext, { children: (0, jsx_runtime_1.jsxs)("div", { style: background, children: [Root === null ? null : (0, jsx_runtime_1.jsx)(Root, {}), (0, jsx_runtime_1.jsxs)(remotion_1.Internals.CanUseRemotionHooksProvider, { children: [(0, jsx_runtime_1.jsx)(FramePersistor_1.FramePersistor, {}), (0, jsx_runtime_1.jsx)(ZoomPersistor_1.ZoomPersistor, {}), Root === null ? (0, jsx_runtime_1.jsx)(NoRegisterRoot_1.NoRegisterRoot, {}) : (0, jsx_runtime_1.jsx)(EditorContent_1.EditorContent, {}), (0, jsx_runtime_1.jsx)(GlobalKeybindings_1.GlobalKeybindings, {})] })] }) }), (0, jsx_runtime_1.jsx)(NotificationCenter_1.NotificationCenter, {}), modalContextType && modalContextType.type === 'new-comp' && ((0, jsx_runtime_1.jsx)(NewComposition_1.default, { initialCompType: modalContextType.compType })), modalContextType && modalContextType.type === 'update' && ((0, jsx_runtime_1.jsx)(UpdateModal_1.UpdateModal, { info: modalContextType.info })), modalContextType && modalContextType.type === 'shortcuts' && ((0, jsx_runtime_1.jsx)(KeyboardShortcutsModal_1.KeyboardShortcuts, {}))] }));
+    return ((0, jsx_runtime_1.jsxs)(z_index_1.HigherZIndex, { onEscape: noop_1.noop, onOutsideClick: noop_1.noop, children: [(0, jsx_runtime_1.jsx)(timeline_zoom_1.TimelineZoomContext, { children: (0, jsx_runtime_1.jsxs)("div", { style: background, children: [Root === null ? null : (0, jsx_runtime_1.jsx)(Root, {}), (0, jsx_runtime_1.jsxs)(remotion_1.Internals.CanUseRemotionHooksProvider, { children: [(0, jsx_runtime_1.jsx)(FramePersistor_1.FramePersistor, {}), (0, jsx_runtime_1.jsx)(ZoomPersistor_1.ZoomPersistor, {}), Root === null ? (0, jsx_runtime_1.jsx)(NoRegisterRoot_1.NoRegisterRoot, {}) : (0, jsx_runtime_1.jsx)(EditorContent_1.EditorContent, {}), (0, jsx_runtime_1.jsx)(GlobalKeybindings_1.GlobalKeybindings, {})] }), (0, jsx_runtime_1.jsx)(NotificationCenter_1.NotificationCenter, {}), modalContextType && modalContextType.type === 'quick-switcher' && (
+                        // Quick switcher here because requires timeline zoom ctx
+                        (0, jsx_runtime_1.jsx)(QuickSwitcher_1.default, {}))] }) }), modalContextType && modalContextType.type === 'new-comp' && ((0, jsx_runtime_1.jsx)(NewComposition_1.default, { initialCompType: modalContextType.compType })), modalContextType && modalContextType.type === 'update' && ((0, jsx_runtime_1.jsx)(UpdateModal_1.UpdateModal, { info: modalContextType.info })), modalContextType && modalContextType.type === 'shortcuts' && ((0, jsx_runtime_1.jsx)(KeyboardShortcutsModal_1.KeyboardShortcuts, {}))] }));
 };
 exports.Editor = Editor;

package/dist/editor/components/GlobalKeybindings.js

@@ -21,6 +21,16 @@ const GlobalKeybindings = () => {
             },
             commandCtrlKey: false,
         });
+        const cmdKKey = keybindings.registerKeybinding({
+            event: 'keydown',
+            key: 'k',
+            callback: () => {
+                setSelectedModal({
+                    type: 'quick-switcher',
+                });
+            },
+            commandCtrlKey: true,
+        });
         const cKey = keybindings.registerKeybinding({
             event: 'keypress',
             key: 't',
@@ -43,6 +53,7 @@ const GlobalKeybindings = () => {
             nKey.unregister();
             cKey.unregister();
             questionMark.unregister();
+            cmdKKey.unregister();
         };
     }, [keybindings, setCheckerboard, setSelectedModal]);
     return null;

package/dist/editor/components/MenuToolbar.js

@@ -3,22 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.MenuToolbar = 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 pick_color_1 = require("../helpers/pick-color");
-const use_keybinding_1 = require("../helpers/use-keybinding");
-const Checkmark_1 = require("../icons/Checkmark");
-const checkerboard_1 = require("../state/checkerboard");
-const modals_1 = require("../state/modals");
-const preview_size_1 = require("../state/preview-size");
-const rich_timeline_1 = require("../state/rich-timeline");
-const sidebar_1 = require("../state/sidebar");
-const timeline_ref_1 = require("../state/timeline-ref");
+const use_menu_structure_1 = require("../helpers/use-menu-structure");
 const layout_1 = require("./layout");
 const MenuItem_1 = require("./Menu/MenuItem");
 const MenuBuildIndicator_1 = require("./MenuBuildIndicator");
-const SizeSelector_1 = require("./SizeSelector");
-const TimelineInOutToggle_1 = require("./TimelineInOutToggle");
 const UpdateCheck_1 = require("./UpdateCheck");
 const row = {
     alignItems: 'center',
@@ -34,20 +23,8 @@ const row = {
 const flex = {
     flex: 1,
 };
-const openExternal = (link) => {
-    window.open(link, '_blank');
-};
-const rotate = {
-    transform: `rotate(90deg)`,
-};
-const ICON_SIZE = 16;
 const MenuToolbar = () => {
     const [selected, setSelected] = (0, react_1.useState)(null);
-    const { setSelectedModal } = (0, react_1.useContext)(modals_1.ModalsContext);
-    const { checkerboard, setCheckerboard } = (0, react_1.useContext)(checkerboard_1.CheckerboardContext);
-    const { richTimeline, setRichTimeline } = (0, react_1.useContext)(rich_timeline_1.RichTimelineContext);
-    const { size, setSize } = (0, react_1.useContext)(preview_size_1.PreviewSizeContext);
-    const { setSidebarCollapsedState, sidebarCollapsedState } = (0, react_1.useContext)(sidebar_1.SidebarContext);
     const itemClicked = (0, react_1.useCallback)((itemId) => {
         setSelected(itemId);
     }, [setSelected]);
@@ -56,433 +33,10 @@ const MenuToolbar = () => {
             setSelected(itemId);
         }
     }, [selected, setSelected]);
-    const close = (0, react_1.useCallback)(() => {
+    const closeMenu = (0, react_1.useCallback)(() => {
         setSelected(null);
     }, []);
-    const sizes = (0, SizeSelector_1.getUniqueSizes)(size);
-    const structure = (0, react_1.useMemo)(() => {
-        const struct = [
-            {
-                id: 'remotion',
-                label: ((0, jsx_runtime_1.jsx)(layout_1.Row, { align: "center", justify: "center", children: (0, jsx_runtime_1.jsx)("svg", { width: ICON_SIZE, height: ICON_SIZE, viewBox: "-100 -100 400 400", style: rotate, children: (0, jsx_runtime_1.jsx)("path", { fill: "#fff", stroke: "#fff", strokeWidth: "100", strokeLinejoin: "round", d: "M 2 172 a 196 100 0 0 0 195 5 A 196 240 0 0 0 100 2.259 A 196 240 0 0 0 2 172 z" }) }) })),
-                leaveLeftPadding: false,
-                items: [
-                    {
-                        id: 'about',
-                        value: 'about',
-                        label: 'About Remotion',
-                        onClick: () => {
-                            close();
-                            openExternal('https://remotion.dev');
-                        },
-                        type: 'item',
-                        keyHint: null,
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'changelog',
-                        value: 'changelog',
-                        label: 'Changelog',
-                        onClick: () => {
-                            close();
-                            openExternal('https://github.com/remotion-dev/remotion/releases');
-                        },
-                        type: 'item',
-                        keyHint: null,
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'license',
-                        value: 'license',
-                        label: 'License',
-                        onClick: () => {
-                            close();
-                            openExternal('https://github.com/remotion-dev/remotion/blob/main/LICENSE.md');
-                        },
-                        type: 'item',
-                        keyHint: null,
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                ],
-            },
-            {
-                id: 'file',
-                label: 'File',
-                leaveLeftPadding: false,
-                items: [
-                    {
-                        id: 'new-sequence',
-                        value: 'new-sequence',
-                        label: 'New composition...',
-                        onClick: () => {
-                            close();
-                            setSelectedModal({
-                                compType: 'composition',
-                                type: 'new-comp',
-                            });
-                        },
-                        type: 'item',
-                        keyHint: 'N',
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'new-still',
-                        value: 'new-still',
-                        label: 'New still...',
-                        onClick: () => {
-                            close();
-                            setSelectedModal({
-                                compType: 'still',
-                                type: 'new-comp',
-                            });
-                        },
-                        type: 'item',
-                        keyHint: null,
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                ],
-            },
-            {
-                id: 'view',
-                label: 'View',
-                leaveLeftPadding: true,
-                items: [
-                    {
-                        id: 'preview-size',
-                        keyHint: null,
-                        label: 'Preview size',
-                        onClick: () => undefined,
-                        type: 'item',
-                        value: 'preview-size',
-                        leftItem: null,
-                        subMenu: {
-                            leaveLeftSpace: true,
-                            preselectIndex: sizes.findIndex((s) => String(size.size) === String(s.size)),
-                            items: sizes.map((newSize) => ({
-                                id: String(newSize.size),
-                                keyHint: newSize.size === 1 ? '0' : null,
-                                label: (0, SizeSelector_1.getPreviewSizeLabel)(newSize),
-                                leftItem: String(newSize.size) === String(size.size) ? ((0, jsx_runtime_1.jsx)(Checkmark_1.Checkmark, {})) : null,
-                                onClick: () => {
-                                    close();
-                                    setSize(() => newSize);
-                                },
-                                subMenu: null,
-                                type: 'item',
-                                value: newSize.size,
-                            })),
-                        },
-                    },
-                    {
-                        id: 'timeline-divider',
-                        type: 'divider',
-                    },
-                    {
-                        id: 'left-sidebar',
-                        label: 'Sidebar',
-                        keyHint: null,
-                        type: 'item',
-                        value: 'preview-size',
-                        leftItem: null,
-                        subMenu: {
-                            leaveLeftSpace: true,
-                            preselectIndex: 0,
-                            items: [
-                                {
-                                    id: 'sidebar-responsive',
-                                    keyHint: null,
-                                    label: 'Responsive',
-                                    leftItem: sidebarCollapsedState === 'responsive' ? ((0, jsx_runtime_1.jsx)(Checkmark_1.Checkmark, {})) : null,
-                                    onClick: () => {
-                                        setSidebarCollapsedState('responsive');
-                                    },
-                                    subMenu: null,
-                                    type: 'item',
-                                    value: 'responsive',
-                                },
-                                {
-                                    id: 'sidebar-expanded',
-                                    keyHint: null,
-                                    label: 'Expanded',
-                                    leftItem: sidebarCollapsedState === 'expanded' ? (0, jsx_runtime_1.jsx)(Checkmark_1.Checkmark, {}) : null,
-                                    onClick: () => {
-                                        setSidebarCollapsedState('expanded');
-                                    },
-                                    subMenu: null,
-                                    type: 'item',
-                                    value: 'expanded',
-                                },
-                                {
-                                    id: 'sidebar-collapsed',
-                                    keyHint: null,
-                                    label: 'Collapsed',
-                                    leftItem: sidebarCollapsedState === 'collapsed' ? ((0, jsx_runtime_1.jsx)(Checkmark_1.Checkmark, {})) : null,
-                                    onClick: () => {
-                                        setSidebarCollapsedState('collapsed');
-                                    },
-                                    subMenu: null,
-                                    type: 'item',
-                                    value: 'collapsed',
-                                },
-                            ],
-                        },
-                        onClick: () => undefined,
-                    },
-                    {
-                        id: 'timeline-divider',
-                        type: 'divider',
-                    },
-                    {
-                        id: 'checkerboard',
-                        keyHint: 'T',
-                        label: 'Transparency as checkerboard',
-                        onClick: () => {
-                            close();
-                            setCheckerboard((c) => !c);
-                        },
-                        type: 'item',
-                        value: 'checkerboard',
-                        leftItem: checkerboard ? (0, jsx_runtime_1.jsx)(Checkmark_1.Checkmark, {}) : null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'timeline-divider',
-                        type: 'divider',
-                    },
-                    {
-                        id: 'rich-timeline',
-                        keyHint: null,
-                        label: 'Rich timeline',
-                        onClick: () => {
-                            close();
-                            setRichTimeline((r) => !r);
-                        },
-                        type: 'item',
-                        value: 'rich-timeline',
-                        leftItem: richTimeline ? (0, jsx_runtime_1.jsx)(Checkmark_1.Checkmark, {}) : null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'expand-all',
-                        keyHint: null,
-                        label: 'Expand all',
-                        onClick: () => {
-                            var _a;
-                            close();
-                            (_a = timeline_ref_1.timelineRef.current) === null || _a === void 0 ? void 0 : _a.expandAll();
-                        },
-                        type: 'item',
-                        value: 'expand-all',
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'collapse-all',
-                        keyHint: null,
-                        label: 'Collapse all',
-                        onClick: () => {
-                            var _a;
-                            close();
-                            (_a = timeline_ref_1.timelineRef.current) === null || _a === void 0 ? void 0 : _a.collapseAll();
-                        },
-                        type: 'item',
-                        value: 'collapse-all',
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'in-out-divider',
-                        type: 'divider',
-                    },
-                    {
-                        id: 'in-mark',
-                        keyHint: 'I',
-                        label: 'In Mark',
-                        leftItem: null,
-                        onClick: () => {
-                            var _a;
-                            close();
-                            (_a = TimelineInOutToggle_1.inOutHandles.current) === null || _a === void 0 ? void 0 : _a.inMarkClick(null);
-                        },
-                        subMenu: null,
-                        type: 'item',
-                        value: 'in-mark',
-                    },
-                    {
-                        id: 'out-mark',
-                        keyHint: 'O',
-                        label: 'Out Mark',
-                        leftItem: null,
-                        onClick: () => {
-                            var _a;
-                            close();
-                            (_a = TimelineInOutToggle_1.inOutHandles.current) === null || _a === void 0 ? void 0 : _a.outMarkClick(null);
-                        },
-                        subMenu: null,
-                        type: 'item',
-                        value: 'out-mark',
-                    },
-                    {
-                        id: 'x-mark',
-                        keyHint: 'X',
-                        label: 'Clear In/Out Marks',
-                        leftItem: null,
-                        onClick: () => {
-                            var _a;
-                            close();
-                            (_a = TimelineInOutToggle_1.inOutHandles.current) === null || _a === void 0 ? void 0 : _a.clearMarks();
-                        },
-                        subMenu: null,
-                        type: 'item',
-                        value: 'clear-marks',
-                    },
-                ],
-            },
-            'EyeDropper' in window
-                ? {
-                    id: 'tools',
-                    label: 'Tools',
-                    leaveLeftPadding: false,
-                    items: [
-                        {
-                            id: 'color-picker',
-                            value: 'color-picker',
-                            label: 'Color Picker',
-                            onClick: () => (0, pick_color_1.pickColor)(),
-                            leftItem: null,
-                            keyHint: null,
-                            subMenu: null,
-                            type: 'item',
-                        },
-                    ],
-                }
-                : null,
-            {
-                id: 'help',
-                label: 'Help',
-                leaveLeftPadding: false,
-                items: [
-                    {
-                        id: 'shortcuts',
-                        value: 'shortcuts',
-                        label: (0, use_keybinding_1.areKeyboardShortcutsDisabled)()
-                            ? 'Shortcuts (disabled)'
-                            : 'Shortcuts',
-                        onClick: () => {
-                            close();
-                            setSelectedModal({
-                                type: 'shortcuts',
-                            });
-                        },
-                        keyHint: '?',
-                        leftItem: null,
-                        subMenu: null,
-                        type: 'item',
-                    },
-                    {
-                        id: 'docs',
-                        value: 'docs',
-                        label: 'Docs',
-                        onClick: () => {
-                            close();
-                            openExternal('https://remotion.dev/docs');
-                        },
-                        type: 'item',
-                        keyHint: null,
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'file-issue',
-                        value: 'file-issue',
-                        label: 'File an issue',
-                        onClick: () => {
-                            close();
-                            openExternal('https://github.com/remotion-dev/remotion/issues/new/choose');
-                        },
-                        type: 'item',
-                        keyHint: null,
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'discord',
-                        value: 'discord',
-                        label: 'Join Discord community',
-                        onClick: () => {
-                            close();
-                            openExternal('https://discord.com/invite/6VzzNDwUwV');
-                        },
-                        type: 'item',
-                        keyHint: null,
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'help-divider',
-                        type: 'divider',
-                    },
-                    {
-                        id: 'insta',
-                        value: 'insta',
-                        label: 'Instagram',
-                        onClick: () => {
-                            close();
-                            openExternal('https://instagram.com/remotion.dev');
-                        },
-                        type: 'item',
-                        keyHint: null,
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'twitter',
-                        value: 'twitter',
-                        label: 'Twitter',
-                        onClick: () => {
-                            close();
-                            openExternal('https://twitter.com/remotion_dev');
-                        },
-                        type: 'item',
-                        keyHint: null,
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                    {
-                        id: 'tiktok',
-                        value: 'tiktok',
-                        label: 'TikTok',
-                        onClick: () => {
-                            close();
-                            openExternal('https://www.tiktok.com/@remotion.dev');
-                        },
-                        type: 'item',
-                        keyHint: null,
-                        leftItem: null,
-                        subMenu: null,
-                    },
-                ],
-            },
-        ].filter(remotion_1.Internals.truthy);
-        return struct;
-    }, [
-        checkerboard,
-        close,
-        richTimeline,
-        setCheckerboard,
-        setRichTimeline,
-        setSelectedModal,
-        setSidebarCollapsedState,
-        setSize,
-        sidebarCollapsedState,
-        size.size,
-        sizes,
-    ]);
+    const structure = (0, use_menu_structure_1.useMenuStructure)(closeMenu);
     const menus = (0, react_1.useMemo)(() => {
         return structure.map((s) => s.id);
     }, [structure]);

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

@@ -8,7 +8,7 @@ export declare type SubMenu = {
     leaveLeftSpace: boolean;
     items: ComboboxValue[];
 };
-declare type SelectionItem = {
+export declare type SelectionItem = {
     type: 'item';
     id: string;
     label: React.ReactNode;
@@ -17,6 +17,7 @@ declare type SelectionItem = {
     keyHint: string | null;
     leftItem: React.ReactNode;
     subMenu: SubMenu | null;
+    quickSwitcherLabel: string | null;
 };
 export declare type ComboboxValue = DividerItem | SelectionItem;
 export declare const Combobox: React.FC<{

package/dist/editor/components/NewComposition/NewComposition.js

@@ -147,6 +147,7 @@ const NewComposition = (props) => {
                 keyHint: null,
                 leftItem: String(frameRate) === selectedFrameRate ? (0, jsx_runtime_1.jsx)(Checkmark_1.Checkmark, {}) : null,
                 subMenu: null,
+                quickSwitcherLabel: null,
             };
         });
     }, [onFpsChange, selectedFrameRate]);
@@ -164,6 +165,7 @@ const NewComposition = (props) => {
                 subMenu: null,
                 type: 'item',
                 value: 'composition',
+                quickSwitcherLabel: null,
             },
             {
                 id: 'still',
@@ -174,6 +176,7 @@ const NewComposition = (props) => {
                 subMenu: null,
                 type: 'item',
                 value: 'still',
+                quickSwitcherLabel: null,
             },
         ];
     }, [onTypeChanged]);

package/dist/editor/components/PlayPause.js

@@ -46,9 +46,10 @@ const PlayPause = ({ playbackRate, loop }) => {
     }, [pause, play, playing]);
     const onEnter = (0, react_1.useCallback)((e) => {
         if (playing) {
+            // Don't prevent keyboard navigation
+            e.preventDefault();
             pauseAndReturnToPlayStart();
         }
-        e.preventDefault();
     }, [pauseAndReturnToPlayStart, playing]);
     const onArrowLeft = (0, react_1.useCallback)((e) => {
         e.preventDefault();

package/dist/editor/components/PlaybackRateSelector.js

@@ -44,6 +44,7 @@ const PlaybackRateSelector = ({ playbackRate, setPlaybackRate }) => {
                 keyHint: null,
                 leftItem: String(playbackRate) === String(newPlaybackRate) ? ((0, jsx_runtime_1.jsx)(Checkmark_1.Checkmark, {})) : null,
                 subMenu: null,
+                quickSwitcherLabel: null,
             };
         });
         const middle = Math.floor(exports.commonPlaybackRates.length / 2);

package/dist/editor/components/QuickSwitcher/NoResults.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export declare type Mode = 'commands' | 'compositions';
+export declare const QuickSwitcherNoResults: React.FC<{
+    query: string;
+    mode: Mode;
+}>;