@remotion/studio 4.0.504 → 4.0.505

package/dist/components/TopPanel.js

@@ -32,9 +32,6 @@ var __importStar = (this && this.__importStar) || (function () {
         return result;
     };
 })();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TopPanel = exports.useResponsiveSidebarStatus = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
@@ -48,7 +45,6 @@ const CanvasIfSizeIsAvailable_1 = require("./CanvasIfSizeIsAvailable");
 const CurrentCompositionSideEffects_1 = require("./CurrentCompositionSideEffects");
 const use_is_ruler_visible_1 = require("./EditorRuler/use-is-ruler-visible");
 const ExplorerPanel_1 = require("./ExplorerPanel");
-const MobilePanel_1 = __importDefault(require("./MobilePanel"));
 const ObserveDefaultPropsContext_1 = require("./ObserveDefaultPropsContext");
 const OptionsPanel_1 = require("./OptionsPanel");
 const PreviewToolbar_1 = require("./PreviewToolbar");
@@ -72,8 +68,12 @@ const MAX_SIDEBAR_WIDTH = 350;
 const MIN_SIDEBAR_WIDTH = 250;
 const useResponsiveSidebarStatus = () => {
     const { sidebarCollapsedStateLeft } = (0, react_1.useContext)(sidebar_1.SidebarContext);
+    const isMobileLayout = (0, mobile_layout_1.useMobileLayout)();
     const responsiveLeftStatus = (0, use_breakpoint_1.useBreakpoint)(1200) ? 'collapsed' : 'expanded';
     const actualStateLeft = (0, react_1.useMemo)(() => {
+        if (isMobileLayout) {
+            return 'collapsed';
+        }
         if (sidebarCollapsedStateLeft === 'collapsed') {
             return 'collapsed';
         }
@@ -81,7 +81,7 @@ const useResponsiveSidebarStatus = () => {
             return 'expanded';
         }
         return responsiveLeftStatus;
-    }, [sidebarCollapsedStateLeft, responsiveLeftStatus]);
+    }, [isMobileLayout, sidebarCollapsedStateLeft, responsiveLeftStatus]);
     return actualStateLeft;
 };
 exports.useResponsiveSidebarStatus = useResponsiveSidebarStatus;
@@ -111,11 +111,10 @@ const TopPanelInner = ({ readOnlyStudio, onMounted, drawRef, bufferStateDelayInM
     const onCollapseRight = (0, react_1.useCallback)(() => {
         setSidebarCollapsedState({ left: null, right: 'collapsed' });
     }, [setSidebarCollapsedState]);
-    const isMobileLayout = (0, mobile_layout_1.useMobileLayout)();
     return (jsx_runtime_1.jsx(ObserveDefaultPropsContext_1.ObserveDefaultProps, { compositionId: (canvasContent === null || canvasContent === void 0 ? void 0 : canvasContent.type) === 'composition'
             ? canvasContent.compositionId
             : null, readOnlyStudio: readOnlyStudio, children: jsx_runtime_1.jsxs("div", { style: container, children: [
-                jsx_runtime_1.jsx("div", { style: row, children: jsx_runtime_1.jsxs(SplitterContainer_1.SplitterContainer, { minFlex: 0.15, maxFlex: 0.4, defaultFlex: 0.2, maxFlexerSize: MAX_SIDEBAR_WIDTH, minFlexerSize: null, maxAntiFlexerSize: null, minAntiFlexerSize: null, id: "sidebar-to-preview", orientation: "vertical", children: [actualStateLeft === 'expanded' ? (isMobileLayout ? (jsx_runtime_1.jsx(MobilePanel_1.default, { onClose: onCollapseLeft, children: jsx_runtime_1.jsx(ExplorerPanel_1.ExplorerPanel, { readOnlyStudio: readOnlyStudio }) })) : (jsx_runtime_1.jsx(SplitterElement_1.SplitterElement, { sticky: null, type: "flexer", children: jsx_runtime_1.jsx(ExplorerPanel_1.ExplorerPanel, { readOnlyStudio: readOnlyStudio }) }))) : null, actualStateLeft === 'expanded' && !isMobileLayout ? (jsx_runtime_1.jsx(SplitterHandle_1.SplitterHandle, { allowToCollapse: "left", onCollapse: onCollapseLeft })) : null, jsx_runtime_1.jsx(SplitterElement_1.SplitterElement, { sticky: null, type: "anti-flexer", children: jsx_runtime_1.jsxs(SplitterContainer_1.SplitterContainer, { minFlex: 0.5, maxFlex: 0.8, defaultFlex: 0.7, maxFlexerSize: null, minFlexerSize: null, maxAntiFlexerSize: MAX_SIDEBAR_WIDTH, minAntiFlexerSize: MIN_SIDEBAR_WIDTH, id: "canvas-to-right-sidebar", orientation: "vertical", children: [
+                jsx_runtime_1.jsx("div", { style: row, children: jsx_runtime_1.jsxs(SplitterContainer_1.SplitterContainer, { minFlex: 0.15, maxFlex: 0.4, defaultFlex: 0.2, maxFlexerSize: MAX_SIDEBAR_WIDTH, minFlexerSize: null, maxAntiFlexerSize: null, minAntiFlexerSize: null, id: "sidebar-to-preview", orientation: "vertical", children: [actualStateLeft === 'expanded' ? (jsx_runtime_1.jsx(SplitterElement_1.SplitterElement, { sticky: null, type: "flexer", children: jsx_runtime_1.jsx(ExplorerPanel_1.ExplorerPanel, { readOnlyStudio: readOnlyStudio }) })) : null, actualStateLeft === 'expanded' ? (jsx_runtime_1.jsx(SplitterHandle_1.SplitterHandle, { allowToCollapse: "left", onCollapse: onCollapseLeft })) : null, jsx_runtime_1.jsx(SplitterElement_1.SplitterElement, { sticky: null, type: "anti-flexer", children: jsx_runtime_1.jsxs(SplitterContainer_1.SplitterContainer, { minFlex: 0.5, maxFlex: 0.8, defaultFlex: 0.7, maxFlexerSize: null, minFlexerSize: null, maxAntiFlexerSize: MAX_SIDEBAR_WIDTH, minAntiFlexerSize: MIN_SIDEBAR_WIDTH, id: "canvas-to-right-sidebar", orientation: "vertical", children: [
                                         jsx_runtime_1.jsx(SplitterElement_1.SplitterElement, { sticky: null, type: "flexer", children: jsx_runtime_1.jsx("div", { ref: drawRef, style: canvasContainerStyle, children: jsx_runtime_1.jsx(CanvasIfSizeIsAvailable_1.CanvasIfSizeIsAvailable, {}) }) }), actualStateRight === 'expanded' ? (jsx_runtime_1.jsx(SplitterHandle_1.SplitterHandle, { allowToCollapse: "right", onCollapse: onCollapseRight })) : null, actualStateRight === 'expanded' ? (jsx_runtime_1.jsx(SplitterElement_1.SplitterElement, { sticky: null, type: "anti-flexer", children: jsx_runtime_1.jsx(OptionsPanel_1.OptionsPanel, { readOnlyStudio: readOnlyStudio }) })) : null] }) })
                         ] }) }), jsx_runtime_1.jsx(PreviewToolbar_1.PreviewToolbar, { bufferStateDelayInMilliseconds: bufferStateDelayInMilliseconds, readOnlyStudio: readOnlyStudio }), jsx_runtime_1.jsx(CurrentCompositionSideEffects_1.TitleUpdater, {})
             ] }) }));

package/dist/components/selected-outline-types.d.ts

@@ -3,7 +3,7 @@ import type { SequenceNodePathInfo } from '../helpers/get-timeline-sequence-sort
 import type { ComboboxValue } from './NewComposition/ComboBox';
 import type { SelectedOutlineUvHandle } from './selected-outline-uv';
 import type { TimelineSelection } from './Timeline/TimelineSelection';
-export type SelectedOutlineContextMenuOpenResult = false | void | readonly ComboboxValue[];
+export type SelectedOutlineContextMenuOpenResult = false | readonly ComboboxValue[];
 export type SelectedOutlineContextMenuOpenHandler = () => SelectedOutlineContextMenuOpenResult | Promise<SelectedOutlineContextMenuOpenResult>;
 export type SelectedOutlineTarget = {
     readonly key: string;