@remotion/cli 4.0.0-lambda.3 → 4.0.0-newpaths.1

package/dist/editor/icons/file.d.ts

@@ -0,0 +1,2 @@
+import type { SVGProps } from 'react';
+export declare const FileIcon: (props: SVGProps<SVGSVGElement>) => JSX.Element;

package/dist/editor/icons/file.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FileIcon = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const FileIcon = (props) => ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 384 512", ...props, children: (0, jsx_runtime_1.jsx)("path", { fill: "currentcolor", d: "M0 64C0 28.65 28.65 0 64 0h156.1c12.7 0 25 5.057 34 14.06L369.9 129.9c9 9 14.1 21.3 14.1 34V448c0 35.3-28.7 64-64 64H64c-35.35 0-64-28.7-64-64V64zm352 128H240c-26.5 0-48-21.5-48-48V32H64c-17.67 0-32 14.33-32 32v384c0 17.7 14.33 32 32 32h256c17.7 0 32-14.3 32-32V192zm-4.7-39.4L231.4 36.69c-2-2.07-4.6-3.51-7.4-4.21V144c0 8.8 7.2 16 16 16h111.5c-.7-2.8-2.1-5.4-4.2-7.4z" }) }));
+exports.FileIcon = FileIcon;

package/dist/editor/icons/film.d.ts

@@ -1,2 +1,3 @@
-import React, { SVGProps } from 'react';
+import type { SVGProps } from 'react';
+import React from 'react';
 export declare const FilmIcon: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/folder.d.ts

@@ -1,3 +1,4 @@
-import React, { SVGProps } from 'react';
+import type { SVGProps } from 'react';
+import React from 'react';
 export declare const CollapsedFolderIcon: React.FC<SVGProps<SVGSVGElement>>;
 export declare const ExpandedFolderIcon: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/frame.d.ts

@@ -0,0 +1,2 @@
+import type { SVGProps } from 'react';
+export declare const PicIcon: (props: SVGProps<SVGSVGElement>) => JSX.Element;

package/dist/editor/icons/frame.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PicIcon = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const PicIcon = (props) => ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", ...props, children: (0, jsx_runtime_1.jsx)("path", { fill: "currentcolor", d: "M324.9 157.8c-11.38-17.38-39.89-17.31-51.23-.063L200.5 268.5l-16.4-22.6c-11.4-16.8-38.2-16-49.7 0l-64.52 89.16c-6.797 9.406-7.75 21.72-2.547 32C72.53 377.5 83.05 384 94.75 384h322.5c11.41 0 21.8-6.281 27.14-16.38a30.922 30.922 0 0 0-1.516-31.56L324.9 157.8zM95.8 352l62.39-87.38 29.91 41.34c3.1 4.24 8.3 7.24 13.3 6.64 5.25-.125 10.12-2.781 13.02-7.188l83.83-129.9L415 352H95.8zM447.1 32h-384C28.65 32-.01 60.65-.01 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96c.01-35.35-27.79-64-63.99-64zM480 416c0 17.64-14.36 32-32 32H64c-17.64 0-32-14.36-32-32V96c0-17.64 14.36-32 32-32h384c17.64 0 32 14.36 32 32v320zM144 192c26.5 0 48-21.5 48-48s-21.5-48-48-48-48 21.5-48 48 21.5 48 48 48zm0-64c8.822 0 15.1 7.178 15.1 16s-6.3 16-15.1 16-16-7.2-16-16 7.2-16 16-16z" }) }));
+exports.PicIcon = PicIcon;

package/dist/editor/icons/gear.d.ts

@@ -0,0 +1,2 @@
+import type { SVGProps } from 'react';
+export declare const GearIcon: (props: SVGProps<SVGSVGElement>) => JSX.Element;

package/dist/editor/icons/gear.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GearIcon = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const GearIcon = (props) => ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", ...props, children: (0, jsx_runtime_1.jsx)("path", { fill: "currentcolor", d: "M168 255.1c0-47.7 39.4-88 88-88s88 40.3 88 88c0 49.5-39.4 88.9-88 88.9s-88-39.4-88-88.9zm88-56c-30.9 0-56 26-56 56 0 31.8 25.1 56 56 56s56-24.2 56-56c0-30-25.1-56-56-56zM65.67 230.6l-40.33-36.8c-11.12-10.1-13.68-26.6-6.16-39.6l30.24-52.4c7.52-13.02 23.09-19.05 37.42-14.48l51.96 16.58c13.4-10.34 28.2-18.94 44-25.47l11.7-53.27C197.7 10.47 210.7 0 225.8 0h60.4c15.1 0 28.1 10.47 31.3 25.16l11.7 53.27c14.9 6.53 30.6 15.13 44 25.47l52-16.58c14.3-4.57 29.9 1.46 37.4 14.48l30.2 52.4c7.5 13 5 29.5-6.1 39.6l-40.4 36.8c1.1 8.3 1.7 16.8 1.7 24.5 0 9.5-.6 18-1.7 26.3l40.4 36.8c11.1 10.1 13.6 26.6 6.1 39.6l-30.2 52.4c-7.5 13-23.1 19-37.4 14.5l-52-16.6c-13.4 10.3-29.1 18.9-44 25.5l-11.7 53.2c-3.2 14.7-16.2 25.2-31.3 25.2h-60.4c-15.1 0-28.1-10.5-31.3-25.2l-11.7-53.2c-15.8-6.6-30.6-15.2-44-25.5l-51.96 16.6c-14.33 4.5-29.9-1.5-37.42-14.5l-30.24-52.4c-7.52-13-4.96-29.5 6.16-39.6l40.33-36.8c-1.1-8.3-1.67-16.8-1.67-26.3 0-7.7.57-16.2 1.67-24.5zm92.73-101.4-13.3 10.3-67.97-21.7-30.24 52.4 52.69 48-2.19 16.6c-.92 6.9-1.39 14-1.39 20.3 0 8.1.47 15.2 1.39 22.1l2.19 16.6-52.69 48 30.24 52.4 67.97-21.7 13.3 10.3c11.1 8.6 23.5 15.8 36.6 20.3l15.5 7.3 15.3 69.6h60.4l15.3-69.6 14.6-7.3c14-4.5 26.4-11.7 37.5-20.3l13.3-10.3 68 21.7 30.2-52.4-52.7-48 2.2-16.6c.9-6.9 1.4-14 1.4-21.2 0-7.2-.5-14.3-1.4-21.2l-2.2-16.6 52.7-48-30.2-52.4-68 21.7-13.3-10.3c-11.1-8.6-23.5-15.8-37.5-21.2l-14.6-6.4L286.2 32h-60.4l-15.3 69.6L195 108c-13.1 5.4-25.5 12.6-36.6 21.2z" }) }));
+exports.GearIcon = GearIcon;

package/dist/editor/icons/gif.d.ts

@@ -0,0 +1,2 @@
+import type { SVGProps } from 'react';
+export declare const GifIcon: (props: SVGProps<SVGSVGElement>) => JSX.Element;

package/dist/editor/icons/gif.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GifIcon = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const GifIcon = (props) => ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 576 512", ...props, children: (0, jsx_runtime_1.jsx)("path", { fill: "currentcolor", d: "M512 32H64C28.65 32 0 60.65 0 96v320c0 35.35 28.65 64 64 64h448c35.35 0 64-28.65 64-64V96c0-35.35-28.7-64-64-64zm32 384c0 17.64-14.36 32-32 32H64c-17.64 0-32-14.36-32-32V96c0-17.64 14.36-32 32-32h448c17.64 0 32 14.36 32 32v320zm-80-256h-96c-8.8 0-16 7.2-16 16v160c0 8.844 7.156 16 16 16s16-7.156 16-16v-64h56c8.844 0 16-7.156 16-16s-7.156-16-16-16h-56v-48h80c8.8 0 16-7.2 16-16s-7.2-16-16-16zm-160 0c-8.8 0-16 7.2-16 16v160c0 8.844 7.156 16 16 16s16-7.156 16-16V176c0-8.8-7.2-16-16-16zm-64 80h-64c-8.8 0-16 7.2-16 16s7.156 16 16 16h48v33.45c-24.83 19.91-69.13 18.16-91.48-4.203-24.95-24.95-24.95-65.55 0-90.5 25.03-25 64.19-25 89.22 0 6.25 6.25 16.38 6.25 22.62 0s6.25-16.38 0-22.62c-37.69-37.72-96.78-37.72-134.5 0-37.42 37.42-37.42 98.33 0 135.8C127.8 341.8 153.5 352 180.6 352c27.06 0 52.84-10.25 70.7-28.12 3-2.98 4.7-7.08 4.7-11.28V256c0-8.8-7.2-16-16-16z" }) }));
+exports.GifIcon = GifIcon;

package/dist/editor/icons/jump-to-start.d.ts

@@ -1,2 +1,2 @@
-import { SVGProps } from 'react';
+import type { SVGProps } from 'react';
 export declare const JumpToStart: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/lock.d.ts

@@ -1,3 +1,4 @@
-import React, { SVGProps } from 'react';
+import type { SVGProps } from 'react';
+import React from 'react';
 export declare const LockIcon: React.FC<SVGProps<SVGSVGElement>>;
 export declare const UnlockIcon: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/minus.d.ts

@@ -0,0 +1,3 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const Minus: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/minus.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Minus = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Minus = (props) => {
+    return ((0, jsx_runtime_1.jsx)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512", children: (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M400 288h-352c-17.69 0-32-14.32-32-32.01s14.31-31.99 32-31.99h352c17.69 0 32 14.3 32 31.99S417.7 288 400 288z" }) }));
+};
+exports.Minus = Minus;

package/dist/editor/icons/pause.d.ts

@@ -1,2 +1,3 @@
-import React, { SVGProps } from 'react';
+import type { SVGProps } from 'react';
+import React from 'react';
 export declare const Pause: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/play.d.ts

@@ -1,2 +1,3 @@
-import React, { SVGProps } from 'react';
+import type { SVGProps } from 'react';
+import React from 'react';
 export declare const Play: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/plus.d.ts

@@ -0,0 +1,3 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const Plus: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/plus.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Plus = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Plus = (props) => {
+    return ((0, jsx_runtime_1.jsx)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512", children: (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M432 256c0 17.69-14.33 32.01-32 32.01H256v144c0 17.69-14.33 31.99-32 31.99s-32-14.3-32-31.99v-144H48c-17.67 0-32-14.32-32-32.01s14.33-31.99 32-31.99H192v-144c0-17.69 14.33-32.01 32-32.01s32 14.32 32 32.01v144h144C417.7 224 432 238.3 432 256z" }) }));
+};
+exports.Plus = Plus;

package/dist/editor/icons/render.d.ts

@@ -0,0 +1,5 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const RenderIcon: React.FC<{
+    svgProps: SVGProps<SVGSVGElement>;
+}>;

package/dist/editor/icons/render.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RenderIcon = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const RenderIcon = (props) => {
+    return ((0, jsx_runtime_1.jsx)("svg", { ...props.svgProps, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", children: (0, jsx_runtime_1.jsx)("path", { fill: 'currentColor', d: "M408 143.1C408 166.1 390.1 183.1 368 183.1C345.9 183.1 328 166.1 328 143.1C328 121.9 345.9 103.1 368 103.1C390.1 103.1 408 121.9 408 143.1zM384 312.1V394.2C384 419.7 370.6 443.2 348.7 456.2L260.2 508.6C252.8 513 243.6 513.1 236.1 508.9C228.6 504.6 224 496.6 224 488V373.3C224 350.6 215 328.1 199 312.1C183 296.1 161.4 288 138.7 288H24C15.38 288 7.414 283.4 3.146 275.9C-1.123 268.4-1.042 259.2 3.357 251.8L55.83 163.3C68.79 141.4 92.33 127.1 117.8 127.1H199.9C281.7-3.798 408.8-8.546 483.9 5.272C495.6 7.411 504.6 16.45 506.7 28.07C520.5 103.2 515.8 230.3 384 312.1V312.1zM197.9 253.9C210.8 260.2 222.6 268.7 232.1 279C243.3 289.4 251.8 301.2 258.1 314.1C363.9 284.1 414.8 234.5 439.7 188C464.7 141.3 466.1 90.47 461.7 50.33C421.5 45.02 370.7 47.34 323.1 72.33C277.5 97.16 227.9 148.1 197.9 253.9H197.9zM41.98 345.5C76.37 311.1 132.1 311.1 166.5 345.5C200.9 379.9 200.9 435.6 166.5 470C117 519.5 .4765 511.5 .4765 511.5C.4765 511.5-7.516 394.1 41.98 345.5V345.5zM64.58 447.4C64.58 447.4 103.3 450.1 119.8 433.6C131.2 422.2 131.2 403.6 119.8 392.2C108.3 380.8 89.81 380.8 78.38 392.2C61.92 408.7 64.58 447.4 64.58 447.4z" }) }));
+};
+exports.RenderIcon = RenderIcon;

package/dist/editor/icons/step-back.d.ts

@@ -1,2 +1,3 @@
-import React, { SVGProps } from 'react';
+import type { SVGProps } from 'react';
+import React from 'react';
 export declare const StepBack: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/step-forward.d.ts

@@ -1,2 +1,3 @@
-import React, { SVGProps } from 'react';
+import type { SVGProps } from 'react';
+import React from 'react';
 export declare const StepForward: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/still.d.ts

@@ -1,2 +1,3 @@
-import React, { SVGProps } from 'react';
+import type { SVGProps } from 'react';
+import React from 'react';
 export declare const StillIcon: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/timeline.d.ts

@@ -1,2 +1,3 @@
-import React, { SVGProps } from 'react';
+import type { SVGProps } from 'react';
+import React from 'react';
 export declare const TimelineIcon: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/timelineInOutPointer.d.ts

@@ -1,3 +1,4 @@
-import React, { SVGProps } from 'react';
+import type { SVGProps } from 'react';
+import React from 'react';
 export declare const TimelineInPointer: React.FC<SVGProps<SVGSVGElement>>;
 export declare const TimelineOutPointer: React.FC<SVGProps<SVGSVGElement>>;

package/dist/editor/icons/video.d.ts

@@ -0,0 +1,5 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const FilmIcon: React.FC<SVGProps<SVGSVGElement> & {
+    color: string;
+}>;

package/dist/editor/icons/video.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FilmIcon = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const FilmIcon = ({ color, ...props }) => {
+    return ((0, jsx_runtime_1.jsx)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", children: (0, jsx_runtime_1.jsx)("path", { fill: color, d: "M448 32H64C28.65 32 0 60.65 0 96v320c0 35.35 28.65 64 64 64h384c35.35 0 64-28.65 64-64V96C512 60.65 483.3 32 448 32zM384 64v176H128V64H384zM32 96c0-17.64 14.36-32 32-32h32v80H32V96zM32 176h64v64H32V176zM32 272h64v64H32V272zM64 448c-17.64 0-32-14.36-32-32v-48h64V448H64zM128 448V272h256V448H128zM480 416c0 17.64-14.36 32-32 32h-32v-80h64V416zM480 336h-64v-64h64V336zM480 240h-64v-64h64V240zM480 144h-64V64h32c17.64 0 32 14.36 32 32V144z" }) }));
+};
+exports.FilmIcon = FilmIcon;

package/dist/editor/state/folders.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ExpandedFoldersState } from '../helpers/persist-open-folders';
+import type { ExpandedFoldersState } from '../helpers/persist-open-folders';
 declare type TFolderContext = {
     foldersExpanded: ExpandedFoldersState;
     setFoldersExpanded: React.Dispatch<React.SetStateAction<ExpandedFoldersState>>;

package/dist/editor/state/in-out.d.ts

@@ -0,0 +1,12 @@
+import type React from 'react';
+export declare type TimelineInOutContextValue = {
+    inFrame: number | null;
+    outFrame: number | null;
+};
+export declare type SetTimelineInOutContextValue = {
+    setInAndOutFrames: (u: React.SetStateAction<TimelineInOutContextValue>) => void;
+};
+export declare const TimelineInOutContext: React.Context<TimelineInOutContextValue>;
+export declare const SetTimelineInOutContext: React.Context<SetTimelineInOutContextValue>;
+export declare const useTimelineInOutFramePosition: () => TimelineInOutContextValue;
+export declare const useTimelineSetInOutFramePosition: () => SetTimelineInOutContextValue;

package/dist/editor/state/in-out.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTimelineSetInOutFramePosition = exports.useTimelineInOutFramePosition = exports.SetTimelineInOutContext = exports.TimelineInOutContext = void 0;
+const react_1 = require("react");
+exports.TimelineInOutContext = (0, react_1.createContext)({
+    inFrame: null,
+    outFrame: null,
+});
+exports.SetTimelineInOutContext = (0, react_1.createContext)({
+    setInAndOutFrames: () => {
+        throw new Error('default');
+    },
+});
+const useTimelineInOutFramePosition = () => {
+    const state = (0, react_1.useContext)(exports.TimelineInOutContext);
+    return state;
+};
+exports.useTimelineInOutFramePosition = useTimelineInOutFramePosition;
+const useTimelineSetInOutFramePosition = () => {
+    const { setInAndOutFrames } = (0, react_1.useContext)(exports.SetTimelineInOutContext);
+    return { setInAndOutFrames };
+};
+exports.useTimelineSetInOutFramePosition = useTimelineSetInOutFramePosition;

package/dist/editor/state/keybindings.js

@@ -4,7 +4,9 @@ exports.KeybindingContextProvider = exports.KeybindingContext = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 exports.KeybindingContext = (0, react_1.createContext)({
-    registerKeybinding: () => undefined,
+    registerKeybinding: () => {
+        throw new Error('Has no keybinding context');
+    },
     unregisterKeybinding: () => undefined,
     unregisterPane: () => undefined,
 });

package/dist/editor/state/modals.d.ts

@@ -1,5 +1,6 @@
-import React from 'react';
-import { UpdateInfo } from '../components/UpdateCheck';
+import type React from 'react';
+import type { QuickSwitcherMode } from '../components/QuickSwitcher/NoResults';
+import type { UpdateInfo } from '../components/UpdateCheck';
 export declare type CompType = 'composition' | 'still';
 export declare type ModalState = {
     type: 'new-comp';
@@ -8,7 +9,9 @@ export declare type ModalState = {
     type: 'update';
     info: UpdateInfo;
 } | {
-    type: 'shortcuts';
+    type: 'quick-switcher';
+    mode: QuickSwitcherMode;
+    invocationTimestamp: number;
 };
 export declare type ModalContextType = {
     selectedModal: ModalState | null;

package/dist/editor/state/preview-size.d.ts

@@ -1,10 +1,13 @@
-/// <reference types="react" />
-import { PreviewSize } from '@remotion/player';
+import type { PreviewSize } from '@remotion/player';
+import React from 'react';
 declare type PreviewSizeCtx = {
     size: PreviewSize;
     setSize: (cb: (oldSize: PreviewSize) => PreviewSize) => void;
 };
 export declare const persistPreviewSizeOption: (option: PreviewSize) => void;
 export declare const loadPreviewSizeOption: () => PreviewSize;
-export declare const PreviewSizeContext: import("react").Context<PreviewSizeCtx>;
+export declare const PreviewSizeContext: React.Context<PreviewSizeCtx>;
+export declare const PreviewSizeProvider: React.FC<{
+    children: React.ReactNode;
+}>;
 export {};

package/dist/editor/state/preview-size.js

@@ -1,20 +1,54 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PreviewSizeContext = exports.loadPreviewSizeOption = exports.persistPreviewSizeOption = void 0;
+exports.PreviewSizeProvider = exports.PreviewSizeContext = exports.loadPreviewSizeOption = exports.persistPreviewSizeOption = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
+const key = 'remotion.previewSize';
 const persistPreviewSizeOption = (option) => {
-    localStorage.setItem('previewSize', String(option));
+    localStorage.setItem(key, JSON.stringify(option));
 };
 exports.persistPreviewSizeOption = persistPreviewSizeOption;
 const loadPreviewSizeOption = () => {
-    const item = localStorage.getItem('previewSize');
+    const item = localStorage.getItem(key);
     if (item === null) {
-        return 'auto';
+        return {
+            size: 'auto',
+            translation: {
+                x: 0,
+                y: 0,
+            },
+        };
     }
-    return item;
+    return JSON.parse(item);
 };
 exports.loadPreviewSizeOption = loadPreviewSizeOption;
 exports.PreviewSizeContext = (0, react_1.createContext)({
     setSize: () => undefined,
     size: (0, exports.loadPreviewSizeOption)(),
 });
+const PreviewSizeProvider = ({ children }) => {
+    const [size, setSizeState] = (0, react_1.useState)(() => (0, exports.loadPreviewSizeOption)());
+    const [translation, setTranslation] = (0, react_1.useState)(() => {
+        return {
+            x: 0,
+            y: 0,
+        };
+    });
+    const setSize = (0, react_1.useCallback)((newValue) => {
+        setSizeState((prevState) => {
+            const newVal = newValue(prevState);
+            (0, exports.persistPreviewSizeOption)(newVal);
+            return newVal;
+        });
+    }, []);
+    const previewSizeCtx = (0, react_1.useMemo)(() => {
+        return {
+            size,
+            setSize,
+            translation,
+            setTranslation,
+        };
+    }, [setSize, size, translation, setTranslation]);
+    return ((0, jsx_runtime_1.jsx)(exports.PreviewSizeContext.Provider, { value: previewSizeCtx, children: children }));
+};
+exports.PreviewSizeProvider = PreviewSizeProvider;

package/dist/editor/state/render-frame.js

@@ -2,10 +2,19 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.renderFrame = void 0;
 const renderFrame = (frame, fps) => {
-    const minutes = Math.floor(frame / fps / 60);
-    const remainingSec = frame - minutes * fps * 60;
+    const hours = Math.floor(frame / fps / 3600);
+    const remainingMinutes = frame - hours * fps * 3600;
+    const minutes = Math.floor(remainingMinutes / 60 / fps);
+    const remainingSec = frame - hours * fps * 3600 - minutes * fps * 60;
     const seconds = Math.floor(remainingSec / fps);
     const frameAfterSec = Math.round(frame % fps);
-    return `${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}.${String(frameAfterSec).padStart(2, '0')}`;
+    const hoursStr = String(hours);
+    const minutesStr = String(minutes).padStart(2, '0');
+    const secondsStr = String(seconds).padStart(2, '0');
+    const frameStr = String(frameAfterSec).padStart(2, '0');
+    if (hours > 0) {
+        return `${hoursStr}:${minutesStr}:${secondsStr}.${frameStr}`;
+    }
+    return `${minutesStr}:${secondsStr}.${frameStr}`;
 };
 exports.renderFrame = renderFrame;

package/dist/editor/state/timeline-zoom.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export declare const TIMELINE_MIN_ZOOM = 1;
+export declare const TIMELINE_MAX_ZOOM = 5;
+export declare const TimelineZoomCtx: React.Context<{
+    zoom: number;
+    setZoom: (prev: (prevZoom: number) => number) => void;
+}>;
+export declare const TimelineZoomContext: React.FC<{
+    children: React.ReactNode;
+}>;

package/dist/editor/state/timeline-zoom.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TimelineZoomContext = exports.TimelineZoomCtx = exports.TIMELINE_MAX_ZOOM = exports.TIMELINE_MIN_ZOOM = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const imperative_state_1 = require("../components/Timeline/imperative-state");
+const timeline_scroll_logic_1 = require("../components/Timeline/timeline-scroll-logic");
+exports.TIMELINE_MIN_ZOOM = 1;
+exports.TIMELINE_MAX_ZOOM = 5;
+exports.TimelineZoomCtx = (0, react_1.createContext)({
+    zoom: -1,
+    setZoom: () => {
+        throw new Error('has no context');
+    },
+});
+const TimelineZoomContext = ({ children }) => {
+    const [zoom, setZoom] = (0, react_1.useState)(exports.TIMELINE_MIN_ZOOM);
+    const value = (0, react_1.useMemo)(() => {
+        return {
+            zoom,
+            setZoom: (callback) => {
+                setZoom((prevZoom) => {
+                    const newZoomWithFloatingPointErrors = Math.min(exports.TIMELINE_MAX_ZOOM, Math.max(exports.TIMELINE_MIN_ZOOM, callback(prevZoom)));
+                    const newZoom = Math.round(newZoomWithFloatingPointErrors * 10) / 10;
+                    (0, timeline_scroll_logic_1.zoomAndPreserveCursor)({
+                        oldZoom: prevZoom,
+                        newZoom,
+                        currentDurationInFrames: (0, imperative_state_1.getCurrentDuration)(),
+                        currentFrame: (0, imperative_state_1.getCurrentFrame)(),
+                    });
+                    return newZoom;
+                });
+            },
+        };
+    }, [zoom]);
+    return ((0, jsx_runtime_1.jsx)(exports.TimelineZoomCtx.Provider, { value: value, children: children }));
+};
+exports.TimelineZoomContext = TimelineZoomContext;

package/dist/editor/state/z-index.js

@@ -12,7 +12,13 @@ exports.ZIndexContext = (0, react_1.createContext)({
 const EscapeHook = ({ onEscape }) => {
     const keybindings = (0, use_keybinding_1.useKeybinding)();
     (0, react_1.useEffect)(() => {
-        const escape = keybindings.registerKeybinding('keydown', 'Escape', onEscape);
+        const escape = keybindings.registerKeybinding({
+            event: 'keydown',
+            key: 'Escape',
+            callback: onEscape,
+            commandCtrlKey: false,
+            preventDefault: true,
+        });
         return () => {
             escape.unregister();
         };
@@ -29,20 +35,33 @@ const HigherZIndex = ({ children, onEscape, onOutsideClick }) => {
         return () => highestContext.unregisterZIndex(currentIndex);
     }, [currentIndex, highestContext]);
     (0, react_1.useEffect)(() => {
-        const listener = (e) => {
+        let onUp = null;
+        const listener = (downEvent) => {
             var _a;
-            const outsideClick = !((_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target));
-            if (outsideClick &&
-                highestContext.highestIndex === currentIndex &&
-                !(0, input_dragger_click_lock_1.getClickLock)() &&
-                // Don't trigger if that click removed that node
-                document.contains(e.target)) {
-                e.stopPropagation();
-                onOutsideClick();
+            const outsideClick = !((_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.contains(downEvent.target));
+            if (!outsideClick) {
+                return;
             }
+            onUp = (upEvent) => {
+                if (outsideClick &&
+                    highestContext.highestIndex === currentIndex &&
+                    !(0, input_dragger_click_lock_1.getClickLock)() &&
+                    // Don't trigger if that click removed that node
+                    document.contains(upEvent.target)) {
+                    upEvent.stopPropagation();
+                    onOutsideClick();
+                }
+            };
+            window.addEventListener('pointerup', onUp, { once: true });
+        };
+        window.addEventListener('pointerdown', listener);
+        return () => {
+            if (onUp) {
+                // @ts-expect-error
+                window.removeEventListener('pointerup', onUp, { once: true });
+            }
+            return window.removeEventListener('pointerdown', listener);
         };
-        window.addEventListener('click', listener);
-        return () => window.removeEventListener('click', listener);
     }, [currentIndex, highestContext.highestIndex, onOutsideClick]);
     const value = (0, react_1.useMemo)(() => {
         return {

package/dist/entry-point.d.ts

@@ -0,0 +1,5 @@
+export declare const findEntryPoint: (args: string[], remotionRoot: string) => {
+    file: string | null;
+    remainingArgs: string[];
+    reason: string;
+};