@remotion/cli 3.2.35-crf.3 → 3.2.35

package/LICENSE.md

@@ -7,7 +7,7 @@ Depending on the type of your legal entity, you are granted permission to use Re
 
 ## Free license
 
-Copyright © 2022 [Jonny Burger](https://jonny.io)
+Copyright © 2022 [Remotion](https://www.remotion.dev/)
 
 ### Eligibility
 

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;
+}>;

package/dist/editor/components/QuickSwitcher/NoResults.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.QuickSwitcherNoResults = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const colors_1 = require("../../helpers/colors");
+const container = {
+    padding: 80,
+    color: colors_1.LIGHT_TEXT,
+    textAlign: 'center',
+    fontSize: 14,
+};
+const QuickSwitcherNoResults = ({ query, mode }) => {
+    return ((0, jsx_runtime_1.jsxs)("div", { style: container, children: ["No ", mode === 'commands' ? 'commands' : 'compositions', " matching ", '"', query, '"'] }));
+};
+exports.QuickSwitcherNoResults = QuickSwitcherNoResults;

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

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const QuickSwitcher: React.FC;
+export default QuickSwitcher;

package/dist/editor/components/QuickSwitcher/QuickSwitcher.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const modals_1 = require("../../state/modals");
+const ModalContainer_1 = require("../ModalContainer");
+const QuickSwitcherContent_1 = require("./QuickSwitcherContent");
+const QuickSwitcher = () => {
+    const { setSelectedModal } = (0, react_1.useContext)(modals_1.ModalsContext);
+    const onQuit = (0, react_1.useCallback)(() => {
+        setSelectedModal(null);
+    }, [setSelectedModal]);
+    // Separate child component to correctly capture keybindings
+    return ((0, jsx_runtime_1.jsx)(ModalContainer_1.ModalContainer, { onOutsideClick: onQuit, onEscape: onQuit, children: (0, jsx_runtime_1.jsx)(QuickSwitcherContent_1.QuickSwitcherContent, {}) }));
+};
+exports.default = QuickSwitcher;

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

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