@remotion/studio 4.0.491 → 4.0.493

package/dist/components/import-assets.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.insertElement = exports.insertComposition = exports.insertComponent = exports.insertExistingAssets = exports.insertRemoteAudio = exports.importRemoteAsset = exports.importAssets = exports.pickFilesToImport = exports.getComponentDimensions = exports.getElementPositionForDrop = exports.getAssetElementFromPath = exports.getAssetElement = void 0;
+exports.insertElement = exports.insertComposition = exports.insertComponent = exports.insertExistingAssets = exports.insertRemoteAudio = exports.importRemoteAsset = exports.importAssets = exports.pickFilesToImport = exports.getComponentDimensions = exports.getCompositionPositionForDrop = exports.getElementPositionForDrop = exports.getAssetElementFromPath = exports.getAssetElement = void 0;
 const media_utils_1 = require("@remotion/media-utils");
 const studio_shared_1 = require("@remotion/studio-shared");
 const remotion_1 = require("remotion");
@@ -181,6 +181,19 @@ const getElementPositionForDrop = ({ dimensions, dropPosition, }) => {
     return getCenteredPosition({ dimensions, dropPosition });
 };
 exports.getElementPositionForDrop = getElementPositionForDrop;
+const getCompositionPositionForDrop = ({ compositionDimensions, destinationDimensions, dropPosition, }) => {
+    // No translation makes an equal-sized composition fill the destination.
+    if (destinationDimensions !== null &&
+        compositionDimensions.width === destinationDimensions.width &&
+        compositionDimensions.height === destinationDimensions.height) {
+        return null;
+    }
+    return getCenteredPosition({
+        dimensions: compositionDimensions,
+        dropPosition,
+    });
+};
+exports.getCompositionPositionForDrop = getCompositionPositionForDrop;
 const getComponentPropNumber = (props, name) => {
     const prop = props.find((p) => p.name === name);
     return typeof (prop === null || prop === void 0 ? void 0 : prop.value) === 'number' ? prop.value : null;
@@ -313,11 +326,11 @@ const getAssetElementFromStaticAsset = async (assetPath) => {
     }
     return (0, exports.getAssetElementFromPath)(assetPath);
 };
-const pickFilesToImport = () => {
+const pickFilesToImport = ({ multiple = true, } = {}) => {
     return new Promise((resolve) => {
         const input = document.createElement('input');
         input.type = 'file';
-        input.multiple = true;
+        input.multiple = multiple;
         input.style.display = 'none';
         let didResolve = false;
         const resolveOnce = (files) => {
@@ -584,7 +597,7 @@ const serializeResolvedPropsForSourceCode = (props) => {
         staticBase: window.remotion_staticBase,
     }).serializedString;
 };
-const insertComposition = async ({ composition, compositionFile, compositionId, dropPosition, }) => {
+const insertComposition = async ({ composition, compositionFile, compositionId, destinationDimensions, dropPosition, }) => {
     if (composition.compositionId === compositionId) {
         (0, NotificationCenter_1.showNotification)('Cannot add a composition to itself', 3000);
         return;
@@ -614,8 +627,9 @@ const insertComposition = async ({ composition, compositionFile, compositionId,
                 width: calculated.width,
                 height: calculated.height,
                 serializedResolvedPropsWithCustomSchema: serializeResolvedPropsForSourceCode(calculated.props),
-                position: getCenteredPosition({
-                    dimensions,
+                position: (0, exports.getCompositionPositionForDrop)({
+                    compositionDimensions: dimensions,
+                    destinationDimensions,
                     dropPosition,
                 }),
             },

package/dist/components/root-composition-menu-items.d.ts

@@ -0,0 +1,8 @@
+import type { SetStateAction } from 'react';
+import type { ModalState } from '../state/modals';
+import type { ComboboxValue } from './NewComposition/ComboBox';
+export declare const getRootCompositionMenuItems: ({ connectionStatus, readOnlyStudio, setSelectedModal, }: {
+    connectionStatus: "connected" | "disconnected" | "init";
+    readOnlyStudio: boolean;
+    setSelectedModal: (value: SetStateAction<ModalState | null>) => void;
+}) => ComboboxValue[];

package/dist/components/root-composition-menu-items.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getRootCompositionMenuItems = void 0;
+const getRootCompositionMenuItems = ({ connectionStatus, readOnlyStudio, setSelectedModal, }) => {
+    return [
+        {
+            id: 'new-root-composition',
+            keyHint: null,
+            label: 'New composition...',
+            leftItem: null,
+            onClick: () => {
+                setSelectedModal({
+                    type: 'new-comp',
+                    folderName: null,
+                    parentName: null,
+                    stack: null,
+                });
+            },
+            quickSwitcherLabel: 'New composition...',
+            subMenu: null,
+            type: 'item',
+            value: 'new-root-composition',
+            disabled: readOnlyStudio || connectionStatus !== 'connected',
+        },
+        {
+            id: 'new-root-folder',
+            keyHint: null,
+            label: 'New folder...',
+            leftItem: null,
+            onClick: () => {
+                setSelectedModal({
+                    type: 'new-folder',
+                    parentName: null,
+                    stack: null,
+                });
+            },
+            quickSwitcherLabel: 'New folder...',
+            subMenu: null,
+            type: 'item',
+            value: 'new-root-folder',
+            disabled: readOnlyStudio || connectionStatus !== 'connected',
+        },
+    ];
+};
+exports.getRootCompositionMenuItems = getRootCompositionMenuItems;

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

@@ -48,10 +48,6 @@ export declare const getOutlineSelectionInteraction: ({ shiftKey, metaKey, ctrlK
     readonly metaKey: boolean;
     readonly ctrlKey: boolean;
 }) => TimelineSelectionInteraction;
-export declare const getOutlineDoubleClickAction: ({ button, canOpenInEditor, }: {
-    readonly button: number;
-    readonly canOpenInEditor: boolean;
-}) => "open-in-editor" | null;
 type SelectedEffectFields = {
     allFields: boolean;
     fieldKeys: Set<string>;
@@ -62,9 +58,10 @@ type SelectedTransformOriginInfo = {
     readonly displayFrame: number | null;
 };
 export declare const getSelectedTransformOriginInfo: (selectedItems: readonly TimelineSelection[]) => SelectedTransformOriginInfo | null;
-export declare const getSequencesWithSelectableOutlines: ({ sequences, overrideIdsToNodePaths, }: {
+export declare const getSequencesWithSelectableOutlines: ({ sequences, overrideIdsToNodePaths, compositions, }: {
     readonly sequences: readonly TSequence[];
     readonly overrideIdsToNodePaths: OverrideIdToNodePaths;
+    readonly compositions?: readonly import("remotion").AnyComposition[] | undefined;
 }) => SequenceWithSelectedOutline[];
 export declare const measureOutlines: (container: SVGSVGElement, targets: readonly SelectedOutlineTarget[]) => SelectedOutline[];
 export declare const outlinesAreEqual: (a: readonly SelectedOutline[], b: readonly SelectedOutline[]) => boolean;

package/dist/components/selected-outline-measurement.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.outlinesAreEqual = exports.measureOutlines = exports.getSequencesWithSelectableOutlines = exports.getSelectedTransformOriginInfo = exports.getSelectedEffectFieldsBySequenceKey = exports.getOutlineDoubleClickAction = exports.getOutlineSelectionInteraction = exports.getSequenceKeysContainingSelection = exports.getSelectedSequenceKeys = exports.getTransformedSvgViewportPoints = exports.getSelectedOutlineRotationPivot = exports.getSelectedOutlineRotationCornerInfo = exports.getRotationCursor = exports.getSelectedOutlineRotationDeltaDegrees = exports.getAngleDegrees = exports.vectorBetween = exports.vectorLength = exports.dot = exports.getOutlineCenter = exports.midpoint = exports.pointToString = void 0;
+exports.outlinesAreEqual = exports.measureOutlines = exports.getSequencesWithSelectableOutlines = exports.getSelectedTransformOriginInfo = exports.getSelectedEffectFieldsBySequenceKey = exports.getOutlineSelectionInteraction = exports.getSequenceKeysContainingSelection = exports.getSelectedSequenceKeys = exports.getTransformedSvgViewportPoints = exports.getSelectedOutlineRotationPivot = exports.getSelectedOutlineRotationCornerInfo = exports.getRotationCursor = exports.getSelectedOutlineRotationDeltaDegrees = exports.getAngleDegrees = exports.vectorBetween = exports.vectorLength = exports.dot = exports.getOutlineCenter = exports.midpoint = exports.pointToString = void 0;
 const calculate_timeline_1 = require("../helpers/calculate-timeline");
 const colors_1 = require("../helpers/colors");
 const get_box_quads_ponyfill_1 = require("../helpers/get-box-quads-ponyfill");
@@ -220,8 +220,6 @@ const getOutlineSelectionInteraction = ({ shiftKey, metaKey, ctrlKey, }) => ({
     toggleKey: metaKey || ctrlKey,
 });
 exports.getOutlineSelectionInteraction = getOutlineSelectionInteraction;
-const getOutlineDoubleClickAction = ({ button, canOpenInEditor, }) => button === 0 && canOpenInEditor ? 'open-in-editor' : null;
-exports.getOutlineDoubleClickAction = getOutlineDoubleClickAction;
 const getKeyframeOrEasingField = (item) => {
     if (item.type !== 'keyframe' && item.type !== 'easing') {
         return null;
@@ -308,10 +306,11 @@ const getSelectedTransformOriginInfo = (selectedItems) => {
     };
 };
 exports.getSelectedTransformOriginInfo = getSelectedTransformOriginInfo;
-const getSequencesWithSelectableOutlines = ({ sequences, overrideIdsToNodePaths, }) => {
+const getSequencesWithSelectableOutlines = ({ sequences, overrideIdsToNodePaths, compositions = [], }) => {
     return (0, calculate_timeline_1.calculateTimeline)({
         sequences: [...sequences],
         overrideIdsToNodePaths,
+        compositions,
     })
         .filter((track) => {
         if (track.nodePathInfo === null) {