"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.EditorContent = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const remotion_1 = require("remotion");
const GlobalKeybindings_1 = require("./GlobalKeybindings");
const InitialCompositionLoader_1 = require("./InitialCompositionLoader");
const MenuToolbar_1 = require("./MenuToolbar");
const SplitterContainer_1 = require("./Splitter/SplitterContainer");
const SplitterElement_1 = require("./Splitter/SplitterElement");
const SplitterHandle_1 = require("./Splitter/SplitterHandle");
const should_clear_selection_on_pointer_down_1 = require("./Timeline/should-clear-selection-on-pointer-down");
const Timeline_1 = require("./Timeline/Timeline");
const TimelineEmptyState_1 = require("./Timeline/TimelineEmptyState");
const TimelineKeyframeDragState_1 = require("./Timeline/TimelineKeyframeDragState");
const TimelineSelection_1 = require("./Timeline/TimelineSelection");
const noop = () => undefined;
const container = {
    display: 'flex',
    flexDirection: 'column',
    flex: 1,
    height: 0,
};
const StudioClearSelectionArea = ({ children }) => {
    const { clearSelection } = (0, TimelineSelection_1.useTimelineSelection)();
    const onPointerDown = (0, react_1.useCallback)((e) => {
        if (!(0, should_clear_selection_on_pointer_down_1.shouldClearSelectionOnPointerDown)(e)) {
            return;
        }
        clearSelection();
    }, [clearSelection]);
    return (jsx_runtime_1.jsx("div", { style: container, onPointerDown: onPointerDown, children: children }));
};
const EditorContent = ({ readOnlyStudio, children }) => {
    const { canvasContent } = (0, react_1.useContext)(remotion_1.Internals.CompositionManager);
    const showTimeline = canvasContent !== null && canvasContent.type === 'composition';
    const content = (jsx_runtime_1.jsxs(SplitterContainer_1.SplitterContainer, { orientation: "horizontal", id: "top-to-bottom", maxFlex: 0.9, minFlex: 0.2, defaultFlex: 0.75, children: [
            jsx_runtime_1.jsx(SplitterElement_1.SplitterElement, { sticky: null, type: "flexer", children: children }), jsx_runtime_1.jsx(SplitterHandle_1.SplitterHandle, { allowToCollapse: "none", onCollapse: noop }), jsx_runtime_1.jsx(SplitterElement_1.SplitterElement, { sticky: null, type: "anti-flexer", children: showTimeline ? jsx_runtime_1.jsx(Timeline_1.Timeline, {}) : jsx_runtime_1.jsx(TimelineEmptyState_1.TimelineEmptyState, {}) })
        ] }));
    return (jsx_runtime_1.jsx(TimelineSelection_1.TimelineSelectionProvider, { children: jsx_runtime_1.jsxs(StudioClearSelectionArea, { children: [
                jsx_runtime_1.jsx(InitialCompositionLoader_1.InitialCompositionLoader, {}), jsx_runtime_1.jsx(MenuToolbar_1.MenuToolbar, { readOnlyStudio: readOnlyStudio }), jsx_runtime_1.jsx(GlobalKeybindings_1.GlobalKeybindings, {}), jsx_runtime_1.jsx(TimelineKeyframeDragState_1.TimelineKeyframeDragStateProvider, { children: content })
            ] }) }));
};
exports.EditorContent = EditorContent;
