@remotion/cli 4.0.113 → 4.0.115

package/dist/editor/components/Splitter/SplitterHandle.js

@@ -1,128 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SplitterHandle = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const player_1 = require("@remotion/player");
-const react_1 = require("react");
-const SplitterContext_1 = require("./SplitterContext");
-const SPLITTER_HANDLE_SIZE = 3;
-const containerRow = {
-    height: SPLITTER_HANDLE_SIZE,
-    cursor: 'row-resize',
-};
-const containerColumn = {
-    width: SPLITTER_HANDLE_SIZE,
-    cursor: 'col-resize',
-};
-const SplitterHandle = ({ allowToCollapse, onCollapse }) => {
-    const context = (0, react_1.useContext)(SplitterContext_1.SplitterContext);
-    if (!context) {
-        throw new Error('Cannot find splitter context');
-    }
-    const [lastPointerUp, setLastPointerUp] = (0, react_1.useState)(() => Date.now());
-    const ref = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(() => {
-        if (context.isDragging.current) {
-            return;
-        }
-        if (!context.domRect) {
-            return;
-        }
-        const { current } = ref;
-        if (!current) {
-            return;
-        }
-        const getNewValue = (e, clamp) => {
-            if (!context.isDragging.current) {
-                throw new Error('cannot get value if not dragging');
-            }
-            if (!context.domRect) {
-                throw new Error('domRect is not mounted');
-            }
-            const { width, height } = context.domRect;
-            const change = (() => {
-                if (context.orientation === 'vertical') {
-                    return ((e.clientX - context.isDragging.current.x) /
-                        (width - SPLITTER_HANDLE_SIZE));
-                }
-                return ((e.clientY - context.isDragging.current.y) /
-                    (height - SPLITTER_HANDLE_SIZE));
-            })();
-            const newFlex = context.flexValue + change;
-            if (clamp) {
-                return Math.min(context.maxFlex, Math.max(context.minFlex, newFlex));
-            }
-            return newFlex;
-        };
-        const onPointerDown = (e) => {
-            var _a;
-            if (e.button !== 0) {
-                return;
-            }
-            context.isDragging.current = {
-                x: e.clientX,
-                y: e.clientY,
-            };
-            (_a = ref.current) === null || _a === void 0 ? void 0 : _a.classList.add('remotion-splitter-active');
-            window.addEventListener('pointerup', (ev) => {
-                if (!context.isDragging.current) {
-                    return;
-                }
-                context.persistFlex(getNewValue(ev, true));
-                cleanup();
-                setLastPointerUp(Date.now());
-            }, { once: true });
-            window.addEventListener('pointermove', onPointerMove);
-        };
-        const onPointerMove = (e) => {
-            if (context.isDragging.current) {
-                const val = getNewValue(e, true);
-                context.setFlexValue(val);
-                if (allowToCollapse === 'left') {
-                    const unclamped = getNewValue(e, false);
-                    if (unclamped < context.minFlex / 2) {
-                        cleanup();
-                        onCollapse();
-                        setLastPointerUp(Date.now());
-                    }
-                }
-                if (allowToCollapse === 'right') {
-                    const unclamped = 1 - getNewValue(e, false);
-                    if (unclamped < (1 - context.maxFlex) / 2) {
-                        cleanup();
-                        onCollapse();
-                        setLastPointerUp(Date.now());
-                    }
-                }
-            }
-        };
-        const cleanup = () => {
-            var _a;
-            context.isDragging.current = false;
-            (_a = ref.current) === null || _a === void 0 ? void 0 : _a.classList.remove('remotion-splitter-active');
-            current.removeEventListener('pointerdown', onPointerDown);
-            window.removeEventListener('pointermove', onPointerMove);
-            player_1.PlayerInternals.updateAllElementsSizes();
-        };
-        current.addEventListener('pointerdown', onPointerDown);
-        return () => {
-            if (!context.isDragging.current) {
-                cleanup();
-            }
-        };
-    }, [
-        allowToCollapse,
-        context,
-        context.domRect,
-        context.flexValue,
-        lastPointerUp,
-        onCollapse,
-    ]);
-    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: [
-            'remotion-splitter',
-            context.orientation === 'horizontal'
-                ? 'remotion-splitter-horizontal'
-                : 'remotion-splitter-vertical',
-        ].join(' '), style: context.orientation === 'horizontal' ? containerRow : containerColumn }));
-};
-exports.SplitterHandle = SplitterHandle;

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

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-import type { AssetMetadata } from '../helpers/get-asset-metadata';
-export declare const StaticFilePreview: React.FC<{
-    currentAsset: string;
-    assetMetadata: AssetMetadata | null;
-}>;

package/dist/editor/components/StaticFilePreview.js

@@ -1,39 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.StaticFilePreview = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const remotion_1 = require("remotion");
-const client_id_1 = require("../helpers/client-id");
-const colors_1 = require("../helpers/colors");
-const FilePreview_1 = require("./FilePreview");
-const Preview_1 = require("./Preview");
-const msgStyle = {
-    fontSize: 13,
-    color: 'white',
-    fontFamily: 'sans-serif',
-    display: 'flex',
-    justifyContent: 'center',
-};
-const errMsgStyle = {
-    ...msgStyle,
-    color: colors_1.LIGHT_TEXT,
-};
-const StaticFilePreview = ({ currentAsset, assetMetadata }) => {
-    const fileType = (0, Preview_1.getPreviewFileType)(currentAsset);
-    const staticFileSrc = (0, remotion_1.staticFile)(currentAsset);
-    const staticFiles = (0, remotion_1.getStaticFiles)();
-    const connectionStatus = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx).type;
-    const exists = staticFiles.find((file) => file.name === currentAsset);
-    if (connectionStatus === 'disconnected') {
-        return (0, jsx_runtime_1.jsx)("div", { style: errMsgStyle, children: "Studio server disconnected" });
-    }
-    if (!exists) {
-        return ((0, jsx_runtime_1.jsxs)("div", { style: errMsgStyle, children: [currentAsset, " does not exist in your public folder."] }));
-    }
-    if (!currentAsset) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsx)(FilePreview_1.FilePreview, { currentAsset: currentAsset, fileType: fileType, src: staticFileSrc, assetMetadata: assetMetadata }));
-};
-exports.StaticFilePreview = StaticFilePreview;

package/dist/editor/components/Tabs/index.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-export declare const Tabs: React.FC<{
-    children: React.ReactNode;
-    style?: React.CSSProperties;
-}>;
-export declare const Tab: React.FC<{
-    children: React.ReactNode;
-    onClick: React.MouseEventHandler<HTMLButtonElement>;
-    style?: React.CSSProperties;
-    selected: boolean;
-}>;

package/dist/editor/components/Tabs/index.js

@@ -1,56 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Tab = exports.Tabs = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const colors_1 = require("../../helpers/colors");
-const z_index_1 = require("../../state/z-index");
-const tabsContainer = {
-    display: 'flex',
-    flexDirection: 'row',
-};
-const Tabs = ({ children, style }) => {
-    const definiteStyle = (0, react_1.useMemo)(() => {
-        return {
-            ...tabsContainer,
-            ...style,
-        };
-    }, [style]);
-    return (0, jsx_runtime_1.jsx)("div", { style: definiteStyle, children: children });
-};
-exports.Tabs = Tabs;
-const selectorButton = {
-    border: 'none',
-    flex: 1,
-    padding: 8,
-    paddingLeft: 16,
-    display: 'flex',
-    flexDirection: 'row',
-    fontSize: 14,
-    color: 'inherit',
-    alignItems: 'center',
-};
-const Tab = ({ children, onClick, style, selected }) => {
-    const [hovered, setHovered] = (0, react_1.useState)(false);
-    const { tabIndex } = (0, z_index_1.useZIndex)();
-    const onPointerEnter = (0, react_1.useCallback)(() => {
-        setHovered(true);
-    }, []);
-    const onPointerLeave = (0, react_1.useCallback)(() => {
-        setHovered(false);
-    }, []);
-    const definiteStyle = (0, react_1.useMemo)(() => ({
-        ...selectorButton,
-        backgroundColor: selected
-            ? colors_1.BACKGROUND
-            : hovered
-                ? colors_1.CLEAR_HOVER
-                : colors_1.INPUT_BACKGROUND,
-        color: selected ? 'white' : colors_1.LIGHT_TEXT,
-        borderTop: selected ? '2px solid ' + colors_1.BLUE : '2px solid transparent',
-        boxShadow: selected ? 'none' : undefined,
-        ...style,
-    }), [hovered, selected, style]);
-    return ((0, jsx_runtime_1.jsx)("button", { style: definiteStyle, type: "button", onClick: onClick, tabIndex: tabIndex, onPointerLeave: onPointerLeave, onPointerEnter: onPointerEnter, children: children }));
-};
-exports.Tab = Tab;

package/dist/editor/components/Tabs/vertical.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-export declare const VerticalTab: React.FC<{
-    children: React.ReactNode;
-    onClick: React.MouseEventHandler<HTMLButtonElement>;
-    style?: React.CSSProperties;
-    selected: boolean;
-}>;

package/dist/editor/components/Tabs/vertical.js

@@ -1,43 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.VerticalTab = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const colors_1 = require("../../helpers/colors");
-const z_index_1 = require("../../state/z-index");
-const selectorButton = {
-    border: 'none',
-    flex: 1,
-    padding: 8,
-    paddingLeft: 16,
-    display: 'flex',
-    flexDirection: 'row',
-    fontSize: 14,
-    color: 'inherit',
-    alignItems: 'center',
-};
-const VerticalTab = ({ children, onClick, style, selected }) => {
-    const [hovered, setHovered] = (0, react_1.useState)(false);
-    const { tabIndex } = (0, z_index_1.useZIndex)();
-    const onPointerEnter = (0, react_1.useCallback)(() => {
-        setHovered(true);
-    }, []);
-    const onPointerLeave = (0, react_1.useCallback)(() => {
-        setHovered(false);
-    }, []);
-    const definiteStyle = (0, react_1.useMemo)(() => {
-        return {
-            ...selectorButton,
-            backgroundColor: selected
-                ? colors_1.SELECTED_BACKGROUND
-                : hovered
-                    ? colors_1.CLEAR_HOVER
-                    : 'transparent',
-            color: selected ? 'white' : colors_1.LIGHT_TEXT,
-            boxShadow: selected ? 'none' : undefined,
-            ...style,
-        };
-    }, [hovered, selected, style]);
-    return ((0, jsx_runtime_1.jsx)("button", { style: definiteStyle, type: "button", onClick: onClick, tabIndex: tabIndex, onPointerLeave: onPointerLeave, onPointerEnter: onPointerEnter, children: children }));
-};
-exports.VerticalTab = VerticalTab;

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

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-export declare const TextViewer: React.FC<{
-    src: string;
-}>;

package/dist/editor/components/TextViewer.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextViewer = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const textStyle = {
-    margin: 14,
-    fontFamily: 'monospace',
-    flex: 1,
-    color: 'white',
-    whiteSpace: 'pre-wrap',
-};
-const TextViewer = ({ src }) => {
-    const [txt, setTxt] = (0, react_1.useState)('');
-    (0, react_1.useEffect)(() => {
-        fetch(src).then(async (res) => {
-            if (!res.ok || !res.body) {
-                return;
-            }
-            const text = await res.text();
-            setTxt(text);
-        });
-    }, [src]);
-    return (0, jsx_runtime_1.jsxs)("div", { style: textStyle, children: [txt, " "] });
-};
-exports.TextViewer = TextViewer;

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

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

package/dist/editor/components/TimeValue.js

@@ -1,41 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TimeValue = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const remotion_1 = require("remotion");
-const is_current_selected_still_1 = require("../helpers/is-current-selected-still");
-const render_frame_1 = require("../state/render-frame");
-const layout_1 = require("./layout");
-const text = {
-    color: 'white',
-    fontSize: 18,
-    display: 'flex',
-    flexDirection: 'row',
-    alignItems: 'flex-end',
-    fontVariantNumeric: 'tabular-nums',
-    lineHeight: 1,
-};
-const time = {
-    display: 'inline-block',
-    fontSize: 18,
-    lineHeight: 1,
-};
-const frameStyle = {
-    color: '#ccc',
-    fontSize: 10,
-    fontWeight: 500,
-    lineHeight: 1,
-};
-const TimeValue = () => {
-    const frame = (0, remotion_1.useCurrentFrame)();
-    const config = remotion_1.Internals.useUnsafeVideoConfig();
-    const isStill = (0, is_current_selected_still_1.useIsStill)();
-    if (!config) {
-        return null;
-    }
-    if (isStill) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsxs)("div", { style: text, children: [(0, jsx_runtime_1.jsx)("div", { style: time, children: (0, render_frame_1.renderFrame)(frame, config.fps) }), " ", (0, jsx_runtime_1.jsx)(layout_1.Spacing, { x: 1 }), (0, jsx_runtime_1.jsxs)("div", { style: frameStyle, children: [frame, " ", (0, jsx_runtime_1.jsxs)("span", { style: frameStyle, children: ["(", config.fps, " fps)"] })] })] }));
-};
-exports.TimeValue = TimeValue;

package/dist/editor/components/Timeline/LoopedIndicator.d.ts

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

package/dist/editor/components/Timeline/LoopedIndicator.js

@@ -1,44 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LoopedIndicator = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const remotion_1 = require("remotion");
-const width = {
-    width: 30,
-    flexDirection: 'row',
-    display: 'flex',
-    position: 'relative',
-};
-const icon = {
-    height: 14,
-    width: 14,
-};
-const Icon = () => ((0, jsx_runtime_1.jsx)("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "repeat", className: "svg-inline--fa fa-repeat fa-w-16", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", style: icon, children: (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M512 256c0 88.224-71.775 160-160 160H170.067l34.512 32.419c9.875 9.276 10.119 24.883.539 34.464l-10.775 10.775c-9.373 9.372-24.568 9.372-33.941 0l-92.686-92.686c-9.373-9.373-9.373-24.568 0-33.941l92.686-92.686c9.373-9.373 24.568-9.373 33.941 0l10.775 10.775c9.581 9.581 9.337 25.187-.539 34.464L170.067 352H352c52.935 0 96-43.065 96-96 0-13.958-2.996-27.228-8.376-39.204-4.061-9.039-2.284-19.626 4.723-26.633l12.183-12.183c11.499-11.499 30.965-8.526 38.312 5.982C505.814 205.624 512 230.103 512 256zM72.376 295.204C66.996 283.228 64 269.958 64 256c0-52.935 43.065-96 96-96h181.933l-34.512 32.419c-9.875 9.276-10.119 24.883-.539 34.464l10.775 10.775c9.373 9.372 24.568 9.372 33.941 0l92.686-92.686c9.373-9.373 9.373-24.568 0-33.941l-92.686-92.686c-9.373-9.373-24.568-9.373-33.941 0L306.882 29.12c-9.581 9.581-9.337 25.187.539 34.464L341.933 96H160C71.775 96 0 167.776 0 256c0 25.897 6.186 50.376 17.157 72.039 7.347 14.508 26.813 17.481 38.312 5.982l12.183-12.183c7.008-7.008 8.786-17.595 4.724-26.634z" }) }));
-const topLine = {
-    top: 0,
-    height: 5,
-    width: 1,
-    background: 'white',
-};
-const bottomLine = {
-    top: 0,
-    height: 5,
-    width: 1,
-    background: 'white',
-};
-const topContainer = {
-    justifyContent: 'flex-start',
-    alignItems: 'center',
-};
-const centerContainer = {
-    justifyContent: 'center',
-    alignItems: 'center',
-};
-const bottomContainer = {
-    justifyContent: 'flex-end',
-    alignItems: 'center',
-};
-const LoopedIndicator = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { style: width, children: [(0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { style: topContainer, children: (0, jsx_runtime_1.jsx)("div", { style: topLine }) }), (0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { style: bottomContainer, children: (0, jsx_runtime_1.jsx)("div", { style: bottomLine }) }), (0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { style: centerContainer, children: (0, jsx_runtime_1.jsx)(Icon, {}) })] }));
-};
-exports.LoopedIndicator = LoopedIndicator;

package/dist/editor/components/Timeline/LoopedTimelineIndicators.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-export declare const LoopedTimelineIndicator: React.FC<{
-    loops: number;
-}>;

package/dist/editor/components/Timeline/LoopedTimelineIndicators.js

@@ -1,22 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LoopedTimelineIndicator = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importDefault(require("react"));
-const remotion_1 = require("remotion");
-const layout_1 = require("../layout");
-const LoopedIndicator_1 = require("./LoopedIndicator");
-const row = {
-    flexDirection: 'row',
-};
-const LoopedTimelineIndicator = ({ loops }) => {
-    return ((0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { style: row, children: new Array(loops).fill(true).map((_l, i) => {
-            return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment
-            // eslint-disable-next-line
-            , { children: [(0, jsx_runtime_1.jsx)(layout_1.Flex, {}), i === loops - 1 ? null : (0, jsx_runtime_1.jsx)(LoopedIndicator_1.LoopedIndicator, {})] }, i));
-        }) }));
-};
-exports.LoopedTimelineIndicator = LoopedTimelineIndicator;

package/dist/editor/components/Timeline/MaxTimelineTracks.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-export declare const DEFAULT_TIMELINE_TRACKS = 90;
-export declare const MAX_TIMELINE_TRACKS: number;
-export declare const MAX_TIMELINE_TRACKS_NOTICE_HEIGHT = 24;
-export declare const MaxTimelineTracksReached: React.FC;

package/dist/editor/components/Timeline/MaxTimelineTracks.js

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MaxTimelineTracksReached = exports.MAX_TIMELINE_TRACKS_NOTICE_HEIGHT = exports.MAX_TIMELINE_TRACKS = exports.DEFAULT_TIMELINE_TRACKS = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const timeline_layout_1 = require("../../helpers/timeline-layout");
-exports.DEFAULT_TIMELINE_TRACKS = 90;
-exports.MAX_TIMELINE_TRACKS = typeof process.env.MAX_TIMELINE_TRACKS === 'undefined'
-    ? exports.DEFAULT_TIMELINE_TRACKS
-    : Number(process.env.MAX_TIMELINE_TRACKS);
-exports.MAX_TIMELINE_TRACKS_NOTICE_HEIGHT = 24;
-const container = {
-    height: exports.MAX_TIMELINE_TRACKS_NOTICE_HEIGHT,
-    display: 'flex',
-    alignItems: 'center',
-    color: 'rgba(255, 255, 255, 0.6)',
-    fontFamily: 'sans-serif',
-    fontSize: 12,
-    backgroundColor: 'rgba(255, 255, 255, 0.1)',
-    paddingLeft: timeline_layout_1.TIMELINE_PADDING + 5,
-};
-const MaxTimelineTracksReached = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { style: container, children: ["Limited display to ", exports.MAX_TIMELINE_TRACKS, " tracks to sustain performance.", '', "You can change this by setting Config.setMaxTimelineTracks() in your remotion.config.ts file."] }));
-};
-exports.MaxTimelineTracksReached = MaxTimelineTracksReached;

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

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

package/dist/editor/components/Timeline/Timeline.js

@@ -1,92 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Timeline = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const remotion_1 = require("remotion");
-const calculate_timeline_1 = require("../../helpers/calculate-timeline");
-const colors_1 = require("../../helpers/colors");
-const timeline_layout_1 = require("../../helpers/timeline-layout");
-const timeline_ref_1 = require("../../state/timeline-ref");
-const is_menu_item_1 = require("../Menu/is-menu-item");
-const SplitterContainer_1 = require("../Splitter/SplitterContainer");
-const SplitterElement_1 = require("../Splitter/SplitterElement");
-const SplitterHandle_1 = require("../Splitter/SplitterHandle");
-const is_collapsed_1 = require("./is-collapsed");
-const MaxTimelineTracks_1 = require("./MaxTimelineTracks");
-const timeline_refs_1 = require("./timeline-refs");
-const timeline_state_reducer_1 = require("./timeline-state-reducer");
-const TimelineDragHandler_1 = require("./TimelineDragHandler");
-const TimelineInOutPointer_1 = require("./TimelineInOutPointer");
-const TimelineList_1 = require("./TimelineList");
-const TimelinePlayCursorSyncer_1 = require("./TimelinePlayCursorSyncer");
-const TimelineScrollable_1 = require("./TimelineScrollable");
-const TimelineSlider_1 = require("./TimelineSlider");
-const TimelineTimeIndicators_1 = require("./TimelineTimeIndicators");
-const TimelineTracks_1 = require("./TimelineTracks");
-const TimelineWidthProvider_1 = require("./TimelineWidthProvider");
-const container = {
-    minHeight: '100%',
-    flex: 1,
-    display: 'flex',
-    height: 0,
-    overflowY: 'auto',
-    backgroundColor: colors_1.BACKGROUND,
-};
-const noop = () => undefined;
-const Timeline = () => {
-    var _a;
-    const { sequences } = (0, react_1.useContext)(remotion_1.Internals.SequenceManager);
-    const videoConfig = remotion_1.Internals.useUnsafeVideoConfig();
-    const [state, dispatch] = (0, react_1.useReducer)(timeline_state_reducer_1.timelineStateReducer, {
-        collapsed: {},
-    });
-    const timeline = (0, react_1.useMemo)(() => {
-        if (!videoConfig) {
-            return [];
-        }
-        return (0, calculate_timeline_1.calculateTimeline)({
-            sequences,
-            sequenceDuration: videoConfig.durationInFrames,
-        });
-    }, [sequences, videoConfig]);
-    (0, react_1.useImperativeHandle)(timeline_ref_1.timelineRef, () => {
-        return {
-            expandAll: () => {
-                dispatch({
-                    type: 'expand-all',
-                    allHashes: timeline.map((t) => t.hash),
-                });
-            },
-            collapseAll: () => {
-                dispatch({
-                    type: 'collapse-all',
-                    allHashes: timeline.map((t) => t.hash),
-                });
-            },
-        };
-    }, [timeline]);
-    const durationInFrames = (_a = videoConfig === null || videoConfig === void 0 ? void 0 : videoConfig.durationInFrames) !== null && _a !== void 0 ? _a : 0;
-    const filtered = (0, react_1.useMemo)(() => {
-        const withoutHidden = timeline.filter((t) => !(0, is_collapsed_1.isTrackHidden)(t, timeline, state));
-        const withoutAfter = withoutHidden.filter((t) => {
-            return t.sequence.from <= durationInFrames && t.sequence.duration > 0;
-        });
-        return withoutAfter;
-    }, [durationInFrames, state, timeline]);
-    const shown = filtered.slice(0, MaxTimelineTracks_1.MAX_TIMELINE_TRACKS);
-    const hasBeenCut = filtered.length > shown.length;
-    const inner = (0, react_1.useMemo)(() => {
-        return {
-            height: shown.length * (timeline_layout_1.TIMELINE_LAYER_HEIGHT + timeline_layout_1.TIMELINE_BORDER * 2) +
-                (hasBeenCut ? MaxTimelineTracks_1.MAX_TIMELINE_TRACKS_NOTICE_HEIGHT : 0) +
-                TimelineTimeIndicators_1.TIMELINE_TIME_INDICATOR_HEIGHT,
-            display: 'flex',
-            flex: 1,
-            minHeight: '100%',
-            overflowX: 'hidden',
-        };
-    }, [hasBeenCut, shown.length]);
-    return ((0, jsx_runtime_1.jsx)("div", { ref: timeline_refs_1.timelineVerticalScroll, style: container, className: 'css-reset ' + is_menu_item_1.VERTICAL_SCROLLBAR_CLASSNAME, children: (0, jsx_runtime_1.jsx)(TimelineWidthProvider_1.TimelineWidthProvider, { children: (0, jsx_runtime_1.jsx)("div", { style: inner, children: (0, jsx_runtime_1.jsxs)(SplitterContainer_1.SplitterContainer, { orientation: "vertical", defaultFlex: 0.2, id: "names-to-timeline", maxFlex: 0.5, minFlex: 0.15, children: [(0, jsx_runtime_1.jsx)(SplitterElement_1.SplitterElement, { type: "flexer", children: (0, jsx_runtime_1.jsx)(TimelineList_1.TimelineList, { dispatchStateChange: dispatch, viewState: state, timeline: shown }) }), (0, jsx_runtime_1.jsx)(SplitterHandle_1.SplitterHandle, { onCollapse: noop, allowToCollapse: "none" }), (0, jsx_runtime_1.jsx)(SplitterElement_1.SplitterElement, { type: "anti-flexer", children: (0, jsx_runtime_1.jsxs)(TimelineScrollable_1.TimelineScrollable, { children: [(0, jsx_runtime_1.jsx)(TimelineTracks_1.TimelineTracks, { viewState: state, timeline: shown, hasBeenCut: hasBeenCut }), (0, jsx_runtime_1.jsx)(TimelineInOutPointer_1.TimelineInOutPointer, {}), (0, jsx_runtime_1.jsx)(TimelineDragHandler_1.TimelineDragHandler, {}), (0, jsx_runtime_1.jsx)(TimelineSlider_1.TimelineSlider, {}), (0, jsx_runtime_1.jsx)(TimelinePlayCursorSyncer_1.TimelinePlayCursorSyncer, {})] }) })] }) }) }) }));
-};
-exports.Timeline = Timeline;

package/dist/editor/components/Timeline/TimelineCollapseToggle.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-export declare const TimelineCollapseToggle: React.FC<{
-    collapsed: boolean;
-    color: string;
-}>;

package/dist/editor/components/Timeline/TimelineCollapseToggle.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TimelineCollapseToggle = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const container = {
-    height: 10,
-    width: 10,
-    display: 'flex',
-    justifyContent: 'center',
-    alignItems: 'center',
-};
-const Icon = ({ color, ...props }) => {
-    return ((0, jsx_runtime_1.jsx)("svg", { viewBox: "0 0 8 10", ...props, style: { height: 10, width: 8 }, children: (0, jsx_runtime_1.jsx)("path", { d: "M 0 0 L 8 5 L 0 10 z", fill: color }) }));
-};
-const TimelineCollapseToggle = ({ collapsed, color }) => {
-    return ((0, jsx_runtime_1.jsx)("div", { style: collapsed ? container : { ...container, transform: 'rotate(90deg)' }, children: (0, jsx_runtime_1.jsx)(Icon, { color: color }) }));
-};
-exports.TimelineCollapseToggle = TimelineCollapseToggle;

package/dist/editor/components/Timeline/TimelineDragHandler.d.ts

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