@remotion/studio 4.0.512 → 4.0.513

package/dist/components/Timeline/delete-selected-timeline-item.d.ts

@@ -4,14 +4,6 @@ import type { ConfirmationDialogFunction } from '../ConfirmationDialog-types';
 import type { SetPropStatuses } from './save-sequence-prop';
 import { type TimelineSelection } from './TimelineSelection';
 export declare const deleteSequencesFromSource: (nodePathInfos: SequenceNodePathInfo[], confirm: ConfirmationDialogFunction) => Promise<boolean>;
-export declare const deleteSelectedTimelineItem: ({ selection, sequences, overrideIdsToNodePaths, setPropStatuses, clientId, confirm, }: {
-    selection: TimelineSelection;
-    sequences: TSequence[];
-    overrideIdsToNodePaths: OverrideIdToNodePaths;
-    setPropStatuses: SetPropStatuses;
-    clientId: string;
-    confirm: ConfirmationDialogFunction;
-}) => Promise<boolean> | null;
 export declare const getTimelineSelectionAfterDeletingItems: ({ selections, sequences, overrideIdsToNodePaths, propStatuses, timelinePosition, }: {
     readonly selections: readonly TimelineSelection[];
     readonly sequences?: TSequence[] | undefined;

package/dist/components/Timeline/delete-selected-timeline-item.js

@@ -1,12 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.deleteSelectedTimelineItems = exports.getTimelineSelectionAfterDeletingItems = exports.deleteSelectedTimelineItem = exports.deleteSequencesFromSource = void 0;
+exports.deleteSelectedTimelineItems = exports.getTimelineSelectionAfterDeletingItems = exports.deleteSequencesFromSource = void 0;
 const remotion_1 = require("remotion");
 const call_api_1 = require("../call-api");
 const NotificationCenter_1 = require("../Notifications/NotificationCenter");
 const delete_selected_keyframe_1 = require("./delete-selected-keyframe");
 const find_track_for_node_path_info_1 = require("./find-track-for-node-path-info");
 const get_easing_selection_after_keyframe_delete_1 = require("./get-easing-selection-after-keyframe-delete");
+const get_timeline_keyframes_1 = require("./get-timeline-keyframes");
 const parse_keyframe_field_from_node_path_1 = require("./parse-keyframe-field-from-node-path");
 const TimelineSelection_1 = require("./TimelineSelection");
 const update_selected_easing_1 = require("./update-selected-easing");
@@ -88,45 +89,6 @@ const deleteEffects = (effects) => {
         return false;
     });
 };
-const deleteSelectedTimelineItem = ({ selection, sequences, overrideIdsToNodePaths, setPropStatuses, clientId, confirm, }) => {
-    var _a;
-    if (selection.type === 'keyframe') {
-        const promise = (0, delete_selected_keyframe_1.deleteSelectedKeyframe)({
-            nodePathInfo: selection.nodePathInfo,
-            frame: selection.frame,
-            sequences,
-            overrideIdsToNodePaths,
-            setPropStatuses,
-            clientId,
-        });
-        return (_a = promise === null || promise === void 0 ? void 0 : promise.then(() => true)) !== null && _a !== void 0 ? _a : null;
-    }
-    switch (selection.type) {
-        case 'guide':
-            return null;
-        case 'sequence':
-            return (0, exports.deleteSequencesFromSource)([selection.nodePathInfo], confirm);
-        case 'sequence-effect':
-            return deleteEffects([
-                {
-                    type: 'single-effect',
-                    nodePathInfo: selection.nodePathInfo,
-                    effectIndex: selection.i,
-                },
-            ]);
-        case 'sequence-prop':
-        case 'sequence-effect-prop':
-        case 'easing':
-            return null;
-        case 'sequence-all-effects':
-            return deleteEffects([
-                { type: 'all-effects', nodePathInfo: selection.nodePathInfo },
-            ]);
-        default:
-            throw new Error(`Unexpected timeline selection type: ${selection}`);
-    }
-};
-exports.deleteSelectedTimelineItem = deleteSelectedTimelineItem;
 const isSequenceRowSelection = (selection) => selection.type === 'sequence';
 const isSequenceEffectSelection = (selection) => selection.type === 'sequence-effect';
 const isSequenceAllEffectsSelection = (selection) => selection.type === 'sequence-all-effects';
@@ -173,7 +135,6 @@ const getEasingSelectionAfterDeletingKeyframes = ({ selections, sequences, overr
         return null;
     }
     const nodePath = selection.nodePathInfo.sequenceSubscriptionKey;
-    const sourceFrame = selection.frame - track.keyframeDisplayOffset;
     if (field.type === 'sequence') {
         const sequencePropStatus = (_a = remotion_1.Internals.getPropStatusesCtx(propStatuses, nodePath)) === null || _a === void 0 ? void 0 : _a[field.fieldKey];
         if ((sequencePropStatus === null || sequencePropStatus === void 0 ? void 0 : sequencePropStatus.status) !== 'keyframed' ||
@@ -181,7 +142,13 @@ const getEasingSelectionAfterDeletingKeyframes = ({ selections, sequences, overr
             return null;
         }
         return (0, get_easing_selection_after_keyframe_delete_1.getEasingSelectionAfterKeyframeDelete)({
-            deletedSourceFrames: [sourceFrame],
+            deletedSourceFrames: [
+                selection.frame -
+                    (0, get_timeline_keyframes_1.getKeyframeDisplayOffset)({
+                        propStatus: sequencePropStatus,
+                        keyframeDisplayOffset: track.keyframeDisplayOffset,
+                    }),
+            ],
             keyframeDisplayOffset: track.keyframeDisplayOffset,
             nodePathInfo: selection.nodePathInfo,
             propStatus: sequencePropStatus,
@@ -201,7 +168,13 @@ const getEasingSelectionAfterDeletingKeyframes = ({ selections, sequences, overr
         return null;
     }
     return (0, get_easing_selection_after_keyframe_delete_1.getEasingSelectionAfterKeyframeDelete)({
-        deletedSourceFrames: [sourceFrame],
+        deletedSourceFrames: [
+            selection.frame -
+                (0, get_timeline_keyframes_1.getKeyframeDisplayOffset)({
+                    propStatus: effectPropStatus,
+                    keyframeDisplayOffset: track.keyframeDisplayOffset,
+                }),
+        ],
         keyframeDisplayOffset: track.keyframeDisplayOffset,
         nodePathInfo: selection.nodePathInfo,
         propStatus: effectPropStatus,

package/dist/components/Timeline/get-easing-selection-after-keyframe-delete.js

@@ -1,10 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getEasingSelectionAfterKeyframeDelete = void 0;
+const get_timeline_keyframes_1 = require("./get-timeline-keyframes");
 const getEasingSelectionAfterKeyframeDelete = ({ deletedSourceFrames, keyframeDisplayOffset, nodePathInfo, propStatus, timelinePosition, }) => {
+    const resolvedKeyframeDisplayOffset = (0, get_timeline_keyframes_1.getKeyframeDisplayOffset)({
+        propStatus,
+        keyframeDisplayOffset,
+    });
     const deletedSourceFrameSet = new Set(deletedSourceFrames);
     const remainingKeyframes = propStatus.keyframes.filter((keyframe) => !deletedSourceFrameSet.has(keyframe.frame));
-    const sourceFrame = timelinePosition - keyframeDisplayOffset;
+    const sourceFrame = timelinePosition - resolvedKeyframeDisplayOffset;
     for (let i = 0; i < remainingKeyframes.length - 1; i++) {
         const keyframe = remainingKeyframes[i];
         const nextKeyframe = remainingKeyframes[i + 1];
@@ -15,8 +20,8 @@ const getEasingSelectionAfterKeyframeDelete = ({ deletedSourceFrames, keyframeDi
             return {
                 type: 'easing',
                 nodePathInfo,
-                fromFrame: keyframe.frame + keyframeDisplayOffset,
-                toFrame: nextKeyframe.frame + keyframeDisplayOffset,
+                fromFrame: keyframe.frame + resolvedKeyframeDisplayOffset,
+                toFrame: nextKeyframe.frame + resolvedKeyframeDisplayOffset,
                 segmentIndex: i,
             };
         }

package/dist/components/Timeline/get-sequence-context-menu-items.js

@@ -6,6 +6,7 @@ const format_file_location_1 = require("../../helpers/format-file-location");
 const get_open_in_menu_items_1 = require("../get-open-in-menu-items");
 const NotificationCenter_1 = require("../Notifications/NotificationCenter");
 const actions_1 = require("../RenderQueue/actions");
+const use_default_editor_info_1 = require("../use-default-editor-info");
 const timeline_asset_link_1 = require("./timeline-asset-link");
 const normalizeMenuDividers = (items) => {
     var _a;
@@ -26,16 +27,17 @@ const normalizeMenuDividers = (items) => {
 };
 const interactiveSvgComponentIdentity = 'dev.remotion.remotion.Interactive.Svg';
 const getSequenceContextMenuItems = ({ assetLinkInfo, canOpenInEditor, deleteDisabled, disableInteractivityDisabled, duplicateDisabled, isProgrammaticallyDuplicated, includeSourceEditItems, codingAgentInfo, editorInfo, onConfigureApps, onDeleteSequenceFromSource, onDisableSequenceInteractivity, onDuplicateSequenceFromSource, openInCodingAgent, openInEditor, originalLocation, selectAsset, sequence, sourceActions = [], }) => {
-    var _a, _b, _c, _d;
-    var _e, _f, _g;
-    const editorName = window.remotion_editorName;
+    var _a, _b, _c;
+    var _d, _e, _f;
     const isInteractiveSvg = ((_a = sequence.controls) === null || _a === void 0 ? void 0 : _a.componentIdentity) === interactiveSvgComponentIdentity;
-    const installedEditors = (_e = editorInfo === null || editorInfo === void 0 ? void 0 : editorInfo.installedEditors) !== null && _e !== void 0 ? _e : [];
-    const defaultEditorId = (_f = (_b = installedEditors.find((editor) => editor.nameWithType === editorName)) === null || _b === void 0 ? void 0 : _b.id) !== null && _f !== void 0 ? _f : null;
+    const installedEditors = (_d = editorInfo === null || editorInfo === void 0 ? void 0 : editorInfo.installedEditors) !== null && _d !== void 0 ? _d : [];
+    const defaultEditorId = (0, use_default_editor_info_1.getPreferredEditorId)(editorInfo);
+    const defaultEditor = installedEditors.find((editor) => editor.id === defaultEditorId);
+    const editorName = (_e = defaultEditor === null || defaultEditor === void 0 ? void 0 : defaultEditor.nameWithType) !== null && _e !== void 0 ? _e : null;
     const defaultCodingAgent = codingAgentInfo === null || codingAgentInfo === void 0 ? void 0 : codingAgentInfo.installedCodingAgents.find((codingAgent) => codingAgent.id === codingAgentInfo.defaultCodingAgent);
     const contextForAgents = (0, format_file_location_1.formatContextForAgents)({
         location: originalLocation,
-        name: sequence.displayName || ((_c = sequence.controls) === null || _c === void 0 ? void 0 : _c.componentName) || null,
+        name: sequence.displayName || ((_b = sequence.controls) === null || _b === void 0 ? void 0 : _b.componentName) || null,
         root: window.remotion_cwd,
     });
     const openInCodingAgentWithContext = (codingAgentId, codingAgentName) => {
@@ -46,7 +48,7 @@ const getSequenceContextMenuItems = ({ assetLinkInfo, canOpenInEditor, deleteDis
             codingAgentInfo,
             editorDisabled: !canOpenInEditor || !originalLocation,
             editorInfo,
-            excludeCodingAgentId: (_g = defaultCodingAgent === null || defaultCodingAgent === void 0 ? void 0 : defaultCodingAgent.id) !== null && _g !== void 0 ? _g : null,
+            excludeCodingAgentId: (_f = defaultCodingAgent === null || defaultCodingAgent === void 0 ? void 0 : defaultCodingAgent.id) !== null && _f !== void 0 ? _f : null,
             excludeEditorId: defaultEditorId,
             fileManagerDisabled: !(originalLocation === null || originalLocation === void 0 ? void 0 : originalLocation.source),
             folder: false,
@@ -161,7 +163,7 @@ const getSequenceContextMenuItems = ({ assetLinkInfo, canOpenInEditor, deleteDis
                 keyHint: null,
                 label: 'Copy SVG',
                 leftItem: null,
-                disabled: !((_d = sequence.refForOutline) === null || _d === void 0 ? void 0 : _d.current),
+                disabled: !((_c = sequence.refForOutline) === null || _c === void 0 ? void 0 : _c.current),
                 onClick: () => {
                     var _a;
                     const svg = (_a = sequence.refForOutline) === null || _a === void 0 ? void 0 : _a.current;

package/dist/components/Timeline/get-timeline-keyframes.d.ts

@@ -4,3 +4,7 @@ export declare const getTimelineKeyframes: (propStatus: CanUpdateSequencePropSta
     frame: number;
     value: unknown;
 }[];
+export declare const getKeyframeDisplayOffset: ({ propStatus, keyframeDisplayOffset, }: {
+    propStatus: CanUpdateSequencePropStatus | null | undefined;
+    keyframeDisplayOffset: number;
+}) => number;

package/dist/components/Timeline/get-timeline-keyframes.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getTimelineKeyframes = exports.getComputedStatusLabel = void 0;
+exports.getKeyframeDisplayOffset = exports.getTimelineKeyframes = exports.getComputedStatusLabel = void 0;
 const getComputedStatusLabel = (propStatus) => {
     if (propStatus.status === 'computed') {
         return 'computed';
@@ -16,12 +16,25 @@ const getTimelineKeyframes = (propStatus, keyframeDisplayOffset = 0) => {
         return [];
     }
     const { keyframes } = propStatus;
-    if (keyframeDisplayOffset === 0) {
+    const resolvedKeyframeDisplayOffset = (0, exports.getKeyframeDisplayOffset)({
+        propStatus,
+        keyframeDisplayOffset,
+    });
+    if (resolvedKeyframeDisplayOffset === 0) {
         return keyframes;
     }
     return keyframes.map((keyframe) => ({
         ...keyframe,
-        frame: keyframe.frame + keyframeDisplayOffset,
+        frame: keyframe.frame + resolvedKeyframeDisplayOffset,
     }));
 };
 exports.getTimelineKeyframes = getTimelineKeyframes;
+const getKeyframeDisplayOffset = ({ propStatus, keyframeDisplayOffset, }) => {
+    return (keyframeDisplayOffset +
+        ((propStatus === null || propStatus === void 0 ? void 0 : propStatus.status) === 'keyframed' || (propStatus === null || propStatus === void 0 ? void 0 : propStatus.status) === 'static'
+            ? propStatus.keyframeDisplayOffsetAdjustment === null
+                ? 0
+                : propStatus.keyframeDisplayOffsetAdjustment
+            : 0));
+};
+exports.getKeyframeDisplayOffset = getKeyframeDisplayOffset;

package/dist/components/Timeline/keyframe-clipboard.js

@@ -4,6 +4,7 @@ exports.getPasteKeyframeTarget = exports.isKeyframeValueCompatible = exports.get
 const studio_shared_1 = require("@remotion/studio-shared");
 const remotion_1 = require("remotion");
 const find_track_for_node_path_info_1 = require("./find-track-for-node-path-info");
+const get_timeline_keyframes_1 = require("./get-timeline-keyframes");
 const parse_keyframe_field_from_node_path_1 = require("./parse-keyframe-field-from-node-path");
 const getKeyframeClipboardFieldType = ({ schema, fieldKey, }) => {
     const field = remotion_1.Internals.getFlatSchemaWithAllKeys(schema)[fieldKey];
@@ -68,7 +69,10 @@ const resolveKeyframeField = ({ selection, sequences, overrideIdsToNodePaths, pr
                 fieldKey: identity.fieldKey,
             }),
             propStatus: sequencePropStatus,
-            keyframeDisplayOffset: track.keyframeDisplayOffset,
+            keyframeDisplayOffset: (0, get_timeline_keyframes_1.getKeyframeDisplayOffset)({
+                propStatus: sequencePropStatus,
+                keyframeDisplayOffset: track.keyframeDisplayOffset,
+            }),
         };
     }
     const effect = track.sequence.effects[identity.effectIndex];
@@ -93,7 +97,10 @@ const resolveKeyframeField = ({ selection, sequences, overrideIdsToNodePaths, pr
             fieldKey: identity.fieldKey,
         }),
         propStatus: effectPropStatus,
-        keyframeDisplayOffset: track.keyframeDisplayOffset,
+        keyframeDisplayOffset: (0, get_timeline_keyframes_1.getKeyframeDisplayOffset)({
+            propStatus: effectPropStatus,
+            keyframeDisplayOffset: track.keyframeDisplayOffset,
+        }),
     };
 };
 const areResolvedFieldsEqual = (first, second) => {

package/dist/components/Timeline/use-open-sequence-in-apps.js

@@ -13,21 +13,21 @@ const useOpenSequenceInApps = (sequence) => {
     const { previewServerState } = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx);
     const previewConnected = previewServerState.type === 'connected';
     const { resolvedLocation: originalLocation } = (0, use_resolved_stack_react_to_change_1.useResolveStackAndReactToChange)(sequence.getStack, (_b = (_a = sequence.controls) === null || _a === void 0 ? void 0 : _a.overrideId) !== null && _b !== void 0 ? _b : sequence.id);
-    const editorPickerAvailable = (0, use_default_editor_info_1.canUseEditorPicker)(previewConnected);
-    const editorInfo = (0, use_default_editor_info_1.useDefaultEditorInfo)(editorPickerAvailable);
-    const codingAgentInfo = (0, use_default_editor_info_1.useDefaultCodingAgentInfo)(editorPickerAvailable);
-    const canOpenInEditor = (0, react_1.useMemo)(() => Boolean(window.remotion_editorName && previewConnected && originalLocation), [originalLocation, previewConnected]);
+    const { canConfigureApps, canOpenInEditor: editorAvailable, defaultEditorId, editorInfo, } = (0, use_default_editor_info_1.useEditorOpening)(previewConnected);
+    const codingAgentInfo = (0, use_default_editor_info_1.useDefaultCodingAgentInfo)(canConfigureApps);
+    const canOpenInEditor = (0, react_1.useMemo)(() => Boolean(editorAvailable && originalLocation), [editorAvailable, originalLocation]);
     const openInEditor = (0, react_1.useCallback)(async (editorId) => {
-        if (!canOpenInEditor || !originalLocation) {
+        const resolvedEditorId = editorId !== null && editorId !== void 0 ? editorId : defaultEditorId;
+        if (!canOpenInEditor || !originalLocation || !resolvedEditorId) {
             return;
         }
         try {
-            await (0, open_in_editor_1.openOriginalPositionInEditor)(originalLocation, editorId);
+            await (0, open_in_editor_1.openOriginalPositionInEditor)(originalLocation, resolvedEditorId);
         }
         catch (err) {
             (0, NotificationCenter_1.showNotification)(err.message, 2000);
         }
-    }, [canOpenInEditor, originalLocation]);
+    }, [canOpenInEditor, defaultEditorId, originalLocation]);
     const openInCodingAgent = (0, react_1.useCallback)(async (codingAgentId, codingAgentName, contextForAgents) => {
         try {
             const response = await (0, open_in_editor_1.openInCodingAgent)(codingAgentId, contextForAgents);
@@ -41,7 +41,7 @@ const useOpenSequenceInApps = (sequence) => {
     }, []);
     return {
         canOpenInEditor,
-        canConfigureApps: editorPickerAvailable,
+        canConfigureApps,
         codingAgentInfo,
         editorInfo,
         openInCodingAgent,

package/dist/components/Timeline/use-timeline-keyframe-drag.js

@@ -10,6 +10,7 @@ const timeline_layout_1 = require("../../helpers/timeline-layout");
 const call_move_keyframe_1 = require("./call-move-keyframe");
 const find_track_for_node_path_info_1 = require("./find-track-for-node-path-info");
 const get_bounded_keyframe_drag_delta_1 = require("./get-bounded-keyframe-drag-delta");
+const get_timeline_keyframes_1 = require("./get-timeline-keyframes");
 const parse_keyframe_field_from_node_path_1 = require("./parse-keyframe-field-from-node-path");
 const TimelineKeyframeDragState_1 = require("./TimelineKeyframeDragState");
 const TimelineSelection_1 = require("./TimelineSelection");
@@ -101,7 +102,7 @@ const getTimelineSelectionsAfterEasingKeyframeDrag = ({ delta, selections, targe
 exports.getTimelineSelectionsAfterEasingKeyframeDrag = getTimelineSelectionsAfterEasingKeyframeDrag;
 const getCodeValueForTarget = ({ propStatuses, nodePath, }) => propStatuses[remotion_1.Internals.makeSequencePropsSubscriptionKey(nodePath)];
 const getTimelineKeyframeDragTarget = ({ propStatuses, displayFrame, nodePathInfo, overrideIdsToNodePaths, sequences, }) => {
-    var _a, _b;
+    var _a, _b, _c;
     const field = (0, parse_keyframe_field_from_node_path_1.parseKeyframeFieldFromNodePath)(nodePathInfo.auxiliaryKeys);
     if (field === null) {
         return null;
@@ -115,7 +116,6 @@ const getTimelineKeyframeDragTarget = ({ propStatuses, displayFrame, nodePathInf
     if (!(sequence === null || sequence === void 0 ? void 0 : sequence.controls)) {
         return null;
     }
-    const sourceFrame = displayFrame - ((_b = track === null || track === void 0 ? void 0 : track.keyframeDisplayOffset) !== null && _b !== void 0 ? _b : 0);
     const nodePath = nodePathInfo.sequenceSubscriptionKey;
     const fileName = nodePath.absolutePath;
     const sequenceStatus = getCodeValueForTarget({ propStatuses, nodePath });
@@ -132,7 +132,12 @@ const getTimelineKeyframeDragTarget = ({ propStatuses, displayFrame, nodePathInf
         if ((effectPropStatus === null || effectPropStatus === void 0 ? void 0 : effectPropStatus.status) !== 'keyframed') {
             return null;
         }
-        if (!effectPropStatus.keyframes.some((keyframe) => keyframe.frame === sourceFrame)) {
+        const effectSourceFrame = displayFrame -
+            (0, get_timeline_keyframes_1.getKeyframeDisplayOffset)({
+                propStatus: effectPropStatus,
+                keyframeDisplayOffset: (_b = track === null || track === void 0 ? void 0 : track.keyframeDisplayOffset) !== null && _b !== void 0 ? _b : 0,
+            });
+        if (!effectPropStatus.keyframes.some((keyframe) => keyframe.frame === effectSourceFrame)) {
             return null;
         }
         return {
@@ -145,13 +150,18 @@ const getTimelineKeyframeDragTarget = ({ propStatuses, displayFrame, nodePathInf
             nodePathInfo,
             propStatus: effectPropStatus,
             schema: effect.schema,
-            sourceFrame,
+            sourceFrame: effectSourceFrame,
         };
     }
     const sequencePropStatus = sequenceStatus.props[field.fieldKey];
     if ((sequencePropStatus === null || sequencePropStatus === void 0 ? void 0 : sequencePropStatus.status) !== 'keyframed') {
         return null;
     }
+    const sourceFrame = displayFrame -
+        (0, get_timeline_keyframes_1.getKeyframeDisplayOffset)({
+            propStatus: sequencePropStatus,
+            keyframeDisplayOffset: (_c = track === null || track === void 0 ? void 0 : track.keyframeDisplayOffset) !== null && _c !== void 0 ? _c : 0,
+        });
     if (!sequencePropStatus.keyframes.some((keyframe) => keyframe.frame === sourceFrame)) {
         return null;
     }

package/dist/components/VisualControls/ClickableFileName.js

@@ -3,18 +3,25 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ClickableFileName = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
+const client_id_1 = require("../../helpers/client-id");
 const colors_1 = require("../../helpers/colors");
 const open_in_editor_1 = require("../../helpers/open-in-editor");
 const NotificationCenter_1 = require("../Notifications/NotificationCenter");
 const Fieldset_1 = require("../RenderModal/SchemaEditor/Fieldset");
 const source_attribution_1 = require("../Timeline/TimelineStack/source-attribution");
+const use_default_editor_info_1 = require("../use-default-editor-info");
 const container = {
     paddingLeft: (0, Fieldset_1.getSchemaEditorFieldsetPadding)(),
     paddingTop: (0, Fieldset_1.getSchemaEditorFieldsetPadding)() / 2,
 };
 const ClickableFileName = ({ originalFileName, }) => {
     const [titleHovered, setTitleHovered] = (0, react_1.useState)(false);
-    const hoverEffect = titleHovered && originalFileName.type === 'loaded';
+    const { previewServerState } = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx);
+    const { canOpenInEditor, defaultEditorId } = (0, use_default_editor_info_1.useEditorOpening)(previewServerState.type === 'connected');
+    const canOpen = canOpenInEditor &&
+        defaultEditorId !== null &&
+        originalFileName.type === 'loaded';
+    const hoverEffect = titleHovered && canOpen;
     const onTitlePointerEnter = (0, react_1.useCallback)(() => {
         setTitleHovered(true);
     }, []);
@@ -24,19 +31,19 @@ const ClickableFileName = ({ originalFileName, }) => {
     const style = (0, react_1.useMemo)(() => {
         return {
             fontSize: 12,
-            cursor: originalFileName.type === 'loaded' ? 'pointer' : undefined,
+            cursor: canOpen ? 'pointer' : undefined,
             borderBottom: hoverEffect ? colors_1.BORDER_WHITE : 'none',
             color: hoverEffect ? colors_1.WHITE_HEX : colors_1.LIGHT_COLOR,
         };
-    }, [originalFileName, hoverEffect]);
+    }, [canOpen, hoverEffect]);
     const onClick = (0, react_1.useCallback)(() => {
-        if (originalFileName.type !== 'loaded') {
+        if (originalFileName.type !== 'loaded' || !canOpen || !defaultEditorId) {
             return;
         }
-        (0, open_in_editor_1.openOriginalPositionInEditor)(originalFileName.originalFileName, null).catch((err) => {
+        (0, open_in_editor_1.openOriginalPositionInEditor)(originalFileName.originalFileName, defaultEditorId).catch((err) => {
             (0, NotificationCenter_1.showNotification)(err.message, 2000);
         });
-    }, [originalFileName]);
+    }, [canOpen, defaultEditorId, originalFileName]);
     return (jsx_runtime_1.jsx("div", { style: container, children: jsx_runtime_1.jsx("span", { style: style, onClick: onClick, onPointerEnter: onTitlePointerEnter, onPointerLeave: onTitlePointerLeave, children: originalFileName.type === 'loaded'
                 ? (0, source_attribution_1.getOriginalSourceAttribution)(originalFileName.originalFileName)
                 : originalFileName.type === 'loading'

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

@@ -1,8 +1,9 @@
+import type { EditorPickerId } from '@remotion/studio-shared';
 import type { SetStateAction } from 'react';
 import type { ResolvedStackLocation } from 'remotion';
 import type { ModalState } from '../state/modals';
 import type { ComboboxValue } from './NewComposition/ComboBox';
-export declare const getCompositionMenuItems: ({ composition, connectionStatus, resolvedLocation, setSelectedModal, closeMenu, readOnlyStudio, includeCompositionManagementItems, }: {
+export declare const getCompositionMenuItems: ({ composition, connectionStatus, resolvedLocation, setSelectedModal, closeMenu, readOnlyStudio, includeCompositionManagementItems, editorId, editorName, }: {
     composition: import("remotion").AnyComposition | null;
     connectionStatus: "connected" | "disconnected" | "init";
     resolvedLocation: ResolvedStackLocation | null;
@@ -10,6 +11,8 @@ export declare const getCompositionMenuItems: ({ composition, connectionStatus,
     closeMenu: () => void;
     readOnlyStudio: boolean;
     includeCompositionManagementItems: boolean;
+    editorId: EditorPickerId | null;
+    editorName: string | null;
 }) => ComboboxValue[];
 export declare const getCompositionContextMenuItems: (args: Omit<{
     composition: import("remotion").AnyComposition | null;
@@ -19,6 +22,8 @@ export declare const getCompositionContextMenuItems: (args: Omit<{
     closeMenu: () => void;
     readOnlyStudio: boolean;
     includeCompositionManagementItems: boolean;
+    editorId: EditorPickerId | null;
+    editorName: string | null;
 }, "includeCompositionManagementItems"> & {
     readonly includeCompositionManagementItems: boolean;
 }) => ComboboxValue[];

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

@@ -6,13 +6,15 @@ const format_file_location_1 = require("../helpers/format-file-location");
 const open_in_editor_1 = require("../helpers/open-in-editor");
 const NotificationCenter_1 = require("./Notifications/NotificationCenter");
 const open_in_new_window_1 = require("./open-in-new-window");
-const getCompositionMenuItems = ({ composition, connectionStatus, resolvedLocation, setSelectedModal, closeMenu, readOnlyStudio, includeCompositionManagementItems, }) => {
-    const editorName = window.remotion_editorName;
+const getCompositionMenuItems = ({ composition, connectionStatus, resolvedLocation, setSelectedModal, closeMenu, readOnlyStudio, includeCompositionManagementItems, editorId, editorName, }) => {
     const fileLocation = (0, format_file_location_1.formatFileLocation)({
         location: resolvedLocation,
         root: window.remotion_cwd,
     });
-    const showInEditorDisabled = !composition || connectionStatus !== 'connected' || !resolvedLocation;
+    const showInEditorDisabled = !editorId ||
+        !composition ||
+        connectionStatus !== 'connected' ||
+        !resolvedLocation;
     const openComponentInEditorDisabled = showInEditorDisabled || !(resolvedLocation === null || resolvedLocation === void 0 ? void 0 : resolvedLocation.source);
     const copyFileLocationDisabled = !composition || !fileLocation;
     return [
@@ -24,11 +26,11 @@ const getCompositionMenuItems = ({ composition, connectionStatus, resolvedLocati
                 leftItem: null,
                 onClick: async () => {
                     closeMenu();
-                    if (!composition || !resolvedLocation) {
+                    if (!composition || !resolvedLocation || !editorId) {
                         return;
                     }
                     try {
-                        await (0, open_in_editor_1.openOriginalPositionInEditor)(resolvedLocation, null);
+                        await (0, open_in_editor_1.openOriginalPositionInEditor)(resolvedLocation, editorId);
                     }
                     catch (err) {
                         (0, NotificationCenter_1.showNotification)(err.message, 2000);
@@ -49,13 +51,14 @@ const getCompositionMenuItems = ({ composition, connectionStatus, resolvedLocati
                 leftItem: null,
                 onClick: async () => {
                     closeMenu();
-                    if (!composition || !(resolvedLocation === null || resolvedLocation === void 0 ? void 0 : resolvedLocation.source)) {
+                    if (!composition || !(resolvedLocation === null || resolvedLocation === void 0 ? void 0 : resolvedLocation.source) || !editorId) {
                         return;
                     }
                     try {
                         await (0, open_in_editor_1.openCompositionComponentInEditor)({
                             compositionFile: resolvedLocation.source,
                             compositionId: composition.id,
+                            editorId,
                         });
                     }
                     catch (err) {

package/dist/components/folder-menu-items.d.ts

@@ -1,12 +1,15 @@
+import type { EditorPickerId } from '@remotion/studio-shared';
 import type { SetStateAction } from 'react';
 import type { ResolvedStackLocation } from 'remotion';
 import type { ModalState } from '../state/modals';
 import type { ComboboxValue } from './NewComposition/ComboBox';
-export declare const getFolderMenuItems: ({ closeMenu, connectionStatus, folder, readOnlyStudio, resolvedLocation, setSelectedModal, }: {
+export declare const getFolderMenuItems: ({ closeMenu, connectionStatus, folder, readOnlyStudio, resolvedLocation, setSelectedModal, editorId, editorName, }: {
     closeMenu: () => void;
     connectionStatus: "connected" | "disconnected" | "init";
     folder: import("remotion").TFolder;
     readOnlyStudio: boolean;
     resolvedLocation: ResolvedStackLocation | null;
     setSelectedModal: (value: SetStateAction<ModalState | null>) => void;
+    editorId: EditorPickerId | null;
+    editorName: string | null;
 }) => ComboboxValue[];

package/dist/components/folder-menu-items.js

@@ -6,8 +6,7 @@ const format_file_location_1 = require("../helpers/format-file-location");
 const get_folder_id_1 = require("../helpers/get-folder-id");
 const open_in_editor_1 = require("../helpers/open-in-editor");
 const NotificationCenter_1 = require("./Notifications/NotificationCenter");
-const getFolderMenuItems = ({ closeMenu, connectionStatus, folder, readOnlyStudio, resolvedLocation, setSelectedModal, }) => {
-    const editorName = window.remotion_editorName;
+const getFolderMenuItems = ({ closeMenu, connectionStatus, folder, readOnlyStudio, resolvedLocation, setSelectedModal, editorId, editorName, }) => {
     const folderId = (0, get_folder_id_1.getFolderId)({
         folderName: folder.name,
         parentName: folder.parent,
@@ -16,7 +15,7 @@ const getFolderMenuItems = ({ closeMenu, connectionStatus, folder, readOnlyStudi
         location: resolvedLocation,
         root: window.remotion_cwd,
     });
-    const showInEditorDisabled = connectionStatus !== 'connected' || !resolvedLocation;
+    const showInEditorDisabled = !editorId || connectionStatus !== 'connected' || !resolvedLocation;
     const copyFileLocationDisabled = !fileLocation;
     const codemodDisabled = readOnlyStudio || !folder.stack;
     return [
@@ -28,11 +27,11 @@ const getFolderMenuItems = ({ closeMenu, connectionStatus, folder, readOnlyStudi
                 leftItem: null,
                 onClick: async () => {
                     closeMenu();
-                    if (!resolvedLocation) {
+                    if (!resolvedLocation || !editorId) {
                         return;
                     }
                     try {
-                        await (0, open_in_editor_1.openOriginalPositionInEditor)(resolvedLocation, null);
+                        await (0, open_in_editor_1.openOriginalPositionInEditor)(resolvedLocation, editorId);
                     }
                     catch (err) {
                         (0, NotificationCenter_1.showNotification)(err.message, 2000);

package/dist/components/get-open-in-menu-items.d.ts

@@ -11,7 +11,7 @@ export declare const getOpenInMenuItems: ({ codingAgentInfo, editorDisabled, edi
     readonly fileManagerDisabled: boolean;
     readonly folder: boolean;
     readonly location: OriginalPosition | null;
-    readonly onConfigureApps: () => void;
+    readonly onConfigureApps: (() => void) | null;
     readonly onOpenInCodingAgent: (codingAgentId: "claude-code" | "codex" | "copilot" | "cursor", codingAgentName: string) => void;
     readonly onOpenInEditor: (editorId: EditorPickerId) => void;
     readonly onOpenInFileExplorer: () => void;

package/dist/components/get-open-in-menu-items.js

@@ -174,20 +174,22 @@ const getOpenInMenuItems = ({ codingAgentInfo, editorDisabled, editorInfo, exclu
                 ...systemApps,
             ]
             : []),
-        ...(hasCategorizedApps || systemApps.length > 0
+        ...(onConfigureApps && (hasCategorizedApps || systemApps.length > 0)
             ? [{ type: 'divider', id: 'open-in-settings-divider' }]
             : []),
-        {
-            id: 'change-default-apps',
-            keyHint: null,
-            label: jsx_runtime_1.jsx("span", { style: menuLabel, children: "Change default apps..." }),
-            leftItem: null,
-            onClick: onConfigureApps,
-            quickSwitcherLabel: null,
-            subMenu: null,
-            type: 'item',
-            value: 'change-default-apps',
-        },
-    ];
+        onConfigureApps
+            ? {
+                id: 'change-default-apps',
+                keyHint: null,
+                label: jsx_runtime_1.jsx("span", { style: menuLabel, children: "Change default apps..." }),
+                leftItem: null,
+                onClick: onConfigureApps,
+                quickSwitcherLabel: null,
+                subMenu: null,
+                type: 'item',
+                value: 'change-default-apps',
+            }
+            : null,
+    ].filter(no_react_1.NoReactInternals.truthy);
 };
 exports.getOpenInMenuItems = getOpenInMenuItems;