@remotion/studio 4.0.500 → 4.0.502

package/dist/components/Timeline/Timeline.js

@@ -37,6 +37,7 @@ exports.Timeline = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
 const remotion_1 = require("remotion");
+const browser_studio_operations_1 = require("../../helpers/browser-studio-operations");
 const calculate_timeline_1 = require("../../helpers/calculate-timeline");
 const client_id_1 = require("../../helpers/client-id");
 const colors_1 = require("../../helpers/colors");
@@ -74,6 +75,7 @@ const TimelineTracks_1 = require("./TimelineTracks");
 const TimelineWidthProvider_1 = require("./TimelineWidthProvider");
 const use_resolved_stack_1 = require("./use-resolved-stack");
 const use_timeline_asset_drop_1 = require("./use-timeline-asset-drop");
+const MIN_TIMELINE_LABELS_WIDTH = 240;
 const container = {
     minHeight: '100%',
     flex: 1,
@@ -93,6 +95,8 @@ const TimelineContextMenuArea = ({ children }) => {
     const { previewServerState } = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx);
     const previewConnected = previewServerState.type === 'connected';
     const previewInteractive = previewConnected && (0, interactivity_enabled_1.isStudioInteractivityEnabled)();
+    const browserStudioOperations = (0, browser_studio_operations_1.getBrowserStudioOperations)();
+    const browserStudioCanInsertSolid = browserStudioOperations !== null;
     const currentCompositionId = (canvasContent === null || canvasContent === void 0 ? void 0 : canvasContent.type) === 'composition' ? canvasContent.compositionId : null;
     const currentComposition = (0, react_1.useMemo)(() => {
         var _a;
@@ -102,12 +106,14 @@ const TimelineContextMenuArea = ({ children }) => {
         return ((_a = compositions.find((composition) => composition.id === currentCompositionId)) !== null && _a !== void 0 ? _a : null);
     }, [compositions, currentCompositionId]);
     const resolvedCompositionLocation = (0, use_resolved_stack_1.useResolvedStack)((_a = currentComposition === null || currentComposition === void 0 ? void 0 : currentComposition.stack) !== null && _a !== void 0 ? _a : null);
-    const compositionFile = (_b = resolvedCompositionLocation === null || resolvedCompositionLocation === void 0 ? void 0 : resolvedCompositionLocation.source) !== null && _b !== void 0 ? _b : null;
+    const compositionFile = (_b = resolvedCompositionLocation === null || resolvedCompositionLocation === void 0 ? void 0 : resolvedCompositionLocation.source) !== null && _b !== void 0 ? _b : (currentCompositionId && browserStudioOperations
+        ? browserStudioOperations.getCompositionFile(currentCompositionId)
+        : null);
     const compositionComponentInfo = (0, open_in_editor_1.useCachedCompositionComponentInfo)({
         compositionFile,
         compositionId: currentCompositionId,
     });
-    const canInsertSolid = previewInteractive &&
+    const canInsertSolid = (previewInteractive || browserStudioCanInsertSolid) &&
         (compositionComponentInfo === null || compositionComponentInfo === void 0 ? void 0 : compositionComponentInfo.canAddSequence) === true &&
         currentCompositionId !== null &&
         compositionFile !== null &&
@@ -128,7 +134,7 @@ const TimelineContextMenuArea = ({ children }) => {
         }
         setIsAddingSolid(true);
         try {
-            const result = await (0, call_api_1.callApi)('/api/insert-jsx-element', {
+            const request = {
                 compositionFile,
                 compositionId: currentCompositionId,
                 from: null,
@@ -138,7 +144,10 @@ const TimelineContextMenuArea = ({ children }) => {
                     height: videoConfig.height,
                     position: null,
                 },
-            });
+            };
+            const result = browserStudioOperations
+                ? await browserStudioOperations.insertSolid(request)
+                : await (0, call_api_1.callApi)('/api/insert-jsx-element', request);
             if (result.success) {
                 (0, NotificationCenter_1.showNotification)('Added <Solid> to source file', 2000);
                 return;
@@ -151,7 +160,13 @@ const TimelineContextMenuArea = ({ children }) => {
         finally {
             setIsAddingSolid(false);
         }
-    }, [canInsertSolid, compositionFile, currentCompositionId, videoConfig]);
+    }, [
+        browserStudioOperations,
+        canInsertSolid,
+        compositionFile,
+        currentCompositionId,
+        videoConfig,
+    ]);
     const insertAsset = (0, react_1.useCallback)(async () => {
         if (!canInsertAsset ||
             currentCompositionId === null ||
@@ -253,7 +268,7 @@ const TimelineInner = () => {
                 }
                 return (jsx_runtime_1.jsx(SubscribeToNodePaths_1.SubscribeToNodePaths, { overrideId: sequence.controls.overrideId, componentIdentity: sequence.controls.componentIdentity, schema: sequence.controls.schema, getStack: sequence.getStack, effects: sequence.effects }, sequence.id));
             }), (0, interactivity_enabled_1.isStudioInteractivityEnabled)() ? jsx_runtime_1.jsx(SequencePropsObserver_1.SequencePropsObserver, {}) : null, jsx_runtime_1.jsx(TimelineKeyframeTracksContext_1.TimelineKeyframeTracksProvider, { tracks: filtered, children: jsx_runtime_1.jsxs(TimelineSelection_1.TimelineSelectableItemsProvider, { timeline: shown, children: [(0, interactivity_enabled_1.isStudioInteractivityEnabled)() ? (jsx_runtime_1.jsx(TimelineSelection_1.TimelineSelectAllKeybindings, { timeline: shown })) : null, jsx_runtime_1.jsx(TimelineHeightContainer_1.TimelineHeightContainer, { shown: shown, hasBeenCut: hasBeenCut, children: isStill ? (jsx_runtime_1.jsx(TimelineList_1.TimelineList, { timeline: shown })) : (jsx_runtime_1.jsxs(TimelineWidthProvider_1.TimelineWidthProvider, { children: [
-                                    jsx_runtime_1.jsx(TimelinePinchZoom_1.TimelinePinchZoom, {}), jsx_runtime_1.jsxs(SplitterContainer_1.SplitterContainer, { orientation: "vertical", defaultFlex: 0.2, id: "names-to-timeline", maxFlex: 0.5, minFlex: 0.15, maxFlexerSize: null, maxAntiFlexerSize: null, children: [
+                                    jsx_runtime_1.jsx(TimelinePinchZoom_1.TimelinePinchZoom, {}), jsx_runtime_1.jsxs(SplitterContainer_1.SplitterContainer, { orientation: "vertical", defaultFlex: 0.2, id: "names-to-timeline", maxFlex: 0.5, minFlex: 0.15, maxFlexerSize: null, minFlexerSize: MIN_TIMELINE_LABELS_WIDTH, maxAntiFlexerSize: null, children: [
                                             jsx_runtime_1.jsx(SplitterElement_1.SplitterElement, { type: "flexer", sticky: jsx_runtime_1.jsx(TimelineTimeIndicators_1.TimelineTimePlaceholders, {}), children: jsx_runtime_1.jsx(TimelineList_1.TimelineList, { timeline: shown }) }), jsx_runtime_1.jsx(SplitterHandle_1.SplitterHandle, { onCollapse: noop, allowToCollapse: "none" }), jsx_runtime_1.jsx(SplitterElement_1.SplitterElement, { type: "anti-flexer", sticky: null, children: jsx_runtime_1.jsxs(TimelineScrollable_1.TimelineScrollable, { children: [
                                                         jsx_runtime_1.jsx(TimelineTracks_1.TimelineTracks, { timeline: shown, hasBeenCut: hasBeenCut }), jsx_runtime_1.jsx(TimelinePlayCursorSyncer_1.TimelinePlayCursorSyncer, {}), jsx_runtime_1.jsx(TimelineInOutPointer_1.TimelineInOutPointer, {}), jsx_runtime_1.jsx(TimelineTimeIndicators_1.TimelineTimeIndicators, {}), jsx_runtime_1.jsx(TimelineDragHandler_1.TimelineDragHandler, {}), (0, interactivity_enabled_1.isStudioInteractivityEnabled)() ? (jsx_runtime_1.jsx(TimelineInOutDragHandler_1.TimelineInOutDragHandler, {})) : null, jsx_runtime_1.jsx(TimelineSlider_1.TimelineSlider, {})
                                                     ] }) })

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { CanUpdateSequencePropStatusStatic } from 'remotion';
+import { type CanUpdateSequencePropStatusStatic } from 'remotion';
 import type { SchemaFieldInfo, TimelineFieldOnDragValueChange, TimelineFieldOnSave } from '../../helpers/timeline-layout';
 import { type InspectorInlineActionProps } from '../InspectorPanel/common';
 export type InspectorSourceAction = Omit<InspectorInlineActionProps, 'variant'>;

package/dist/components/Timeline/TimelineAssetField.js

@@ -3,11 +3,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TimelineAssetField = exports.toFileToken = exports.AssetSelectionContext = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
+const remotion_1 = require("remotion");
 const no_react_1 = require("remotion/no-react");
+const write_static_file_1 = require("../../api/write-static-file");
 const pen_1 = require("../../icons/pen");
 const modals_1 = require("../../state/modals");
+const import_assets_1 = require("../import-assets");
 const InlineAction_1 = require("../InlineAction");
 const common_1 = require("../InspectorPanel/common");
+const NotificationCenter_1 = require("../Notifications/NotificationCenter");
+const use_static_files_1 = require("../use-static-files");
 const penIcon = {
     display: 'block',
     height: 14,
@@ -30,6 +35,7 @@ const TimelineAssetField = ({ field, effectiveValue, propStatus, onSave, onDragV
         throw new Error('TimelineAssetField rendered for non-asset field');
     }
     const { setSelectedModal } = (0, react_1.useContext)(modals_1.ModalsContext);
+    const staticFiles = (0, use_static_files_1.useStaticFiles)();
     const { getSourceAction, initialQuery, sourceAction } = (0, react_1.useContext)(exports.AssetSelectionContext);
     const inlineSourceAction = (0, react_1.useMemo)(() => {
         if (field.key !== 'src') {
@@ -49,6 +55,32 @@ const TimelineAssetField = ({ field, effectiveValue, propStatus, onSave, onDragV
             onDragEnd();
         });
     }, [propStatus.codeValue, onDragValueChange, onSave, onDragEnd]);
+    const selectFile = (0, react_1.useCallback)(async () => {
+        const [file] = await (0, import_assets_1.pickFilesToImport)({ multiple: false });
+        if (!file) {
+            return;
+        }
+        const existing = staticFiles.find((candidate) => candidate.name === file.name);
+        if (existing && existing.sizeInBytes !== file.size) {
+            (0, NotificationCenter_1.showNotification)(`File with name ${file.name} already exists and is different`, 4000);
+            return;
+        }
+        try {
+            if (!existing) {
+                await (0, write_static_file_1.writeStaticFile)({
+                    contents: await file.arrayBuffer(),
+                    filePath: file.name,
+                });
+            }
+            onSelect(file.name, (0, remotion_1.staticFile)(file.name));
+            if (!existing) {
+                (0, NotificationCenter_1.showNotification)(`Created ${file.name} in public folder`, 3000);
+            }
+        }
+        catch (error) {
+            (0, NotificationCenter_1.showNotification)(`Could not upload asset: ${error instanceof Error ? error.message : String(error)}`, 4000);
+        }
+    }, [onSelect, staticFiles]);
     const openAssetSelection = (0, react_1.useCallback)(() => {
         setSelectedModal({
             type: 'quick-switcher',
@@ -56,10 +88,14 @@ const TimelineAssetField = ({ field, effectiveValue, propStatus, onSave, onDragV
             invocationTimestamp: Date.now(),
             assetSelection: {
                 initialQuery,
+                onSelectFile: () => {
+                    selectFile().catch(() => undefined);
+                },
                 onSelected: (asset) => onSelect(asset.name, asset.src),
             },
+            compositionSelection: null,
         });
-    }, [initialQuery, onSelect, setSelectedModal]);
+    }, [initialQuery, onSelect, selectFile, setSelectedModal]);
     const action = (jsx_runtime_1.jsx(InlineAction_1.InlineAction, { onClick: openAssetSelection, disabled: window.remotion_isReadOnlyStudio, title: "Change source", renderAction: (color) => jsx_runtime_1.jsx(pen_1.PenIcon, { color: color, style: penIcon }) }));
     if (inlineSourceAction === null) {
         return action;

package/dist/components/Timeline/TimelineDragHandler.js

@@ -89,7 +89,7 @@ const TimelineDragHandler = () => {
     if (!canvasContent || canvasContent.type !== 'composition') {
         return null;
     }
-    return (jsx_runtime_1.jsx("div", { ref: timeline_refs_1.sliderAreaRef, style: containerStyle, [TimelineSelection_1.TIMELINE_SCRUBBER_ATTR]: true, children: video && (0, interactivity_enabled_1.isStudioInteractivityEnabled)() ? (jsx_runtime_1.jsx(TimelineDragHandlerInnerMemo, {})) : null }));
+    return (jsx_runtime_1.jsx("div", { ref: timeline_refs_1.sliderAreaRef, style: containerStyle, [TimelineSelection_1.TIMELINE_SCRUBBER_ATTR]: true, children: video && (0, interactivity_enabled_1.isStudioSelectionEnabled)() ? (jsx_runtime_1.jsx(TimelineDragHandlerInnerMemo, {})) : null }));
 };
 exports.TimelineDragHandler = TimelineDragHandler;
 const TimelineDragHandlerInner = () => {

package/dist/components/Timeline/TimelineExpandedKeyframeRow.js

@@ -42,8 +42,14 @@ const TimelineKeyframeDiamond_1 = require("./TimelineKeyframeDiamond");
 const TimelineKeyframeEasingLine_1 = require("./TimelineKeyframeEasingLine");
 const TimelineSelection_1 = require("./TimelineSelection");
 const TimelineWidthProvider_1 = require("./TimelineWidthProvider");
-const row = {
+const rowClipper = {
+    marginLeft: -timeline_layout_1.TIMELINE_PADDING,
+    marginRight: -timeline_layout_1.TIMELINE_PADDING,
     overflow: 'hidden',
+    paddingLeft: timeline_layout_1.TIMELINE_PADDING,
+    paddingRight: timeline_layout_1.TIMELINE_PADDING,
+};
+const row = {
     position: 'relative',
 };
 const rowSeparator = {
@@ -55,7 +61,7 @@ const TimelineExpandedKeyframeRowUnmemoized = ({ height, keyframes, canEditEasin
     const easingSegments = canEditEasing
         ? (0, get_timeline_easing_segments_1.getTimelineEasingSegments)(keyframes)
         : [];
-    return (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [showSeparator ? jsx_runtime_1.jsx("div", { style: rowSeparator }) : null, jsx_runtime_1.jsxs("div", { style: { ...row, height }, children: [rowHighlightBackground && timelineWidth !== null ? (jsx_runtime_1.jsx("div", { style: (0, TimelineSelection_1.getTimelineSelectedTrackHighlightStyle)(timelineWidth, rowHighlightBackground) })) : null, easingSegments.map((segment) => (jsx_runtime_1.jsx(TimelineKeyframeEasingLine_1.TimelineKeyframeEasingLine, { fromFrame: segment.fromFrame, toFrame: segment.toFrame, rowHeight: height, nodePathInfo: nodePathInfo, segmentIndex: segment.segmentIndex }, `${segment.segmentIndex}-${segment.fromFrame}-${segment.toFrame}`))), keyframes.map((keyframe) => (jsx_runtime_1.jsx(TimelineKeyframeDiamond_1.TimelineKeyframeDiamond, { frame: keyframe.frame, rowHeight: height, nodePathInfo: nodePathInfo }, keyframe.frame)))] })
+    return (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [showSeparator ? jsx_runtime_1.jsx("div", { style: rowSeparator }) : null, jsx_runtime_1.jsx("div", { style: { ...rowClipper, height }, children: jsx_runtime_1.jsxs("div", { style: { ...row, height }, children: [rowHighlightBackground && timelineWidth !== null ? (jsx_runtime_1.jsx("div", { style: (0, TimelineSelection_1.getTimelineSelectedTrackHighlightStyle)(timelineWidth, rowHighlightBackground) })) : null, easingSegments.map((segment) => (jsx_runtime_1.jsx(TimelineKeyframeEasingLine_1.TimelineKeyframeEasingLine, { fromFrame: segment.fromFrame, toFrame: segment.toFrame, rowHeight: height, nodePathInfo: nodePathInfo, segmentIndex: segment.segmentIndex }, `${segment.segmentIndex}-${segment.fromFrame}-${segment.toFrame}`))), keyframes.map((keyframe) => (jsx_runtime_1.jsx(TimelineKeyframeDiamond_1.TimelineKeyframeDiamond, { frame: keyframe.frame, rowHeight: height, nodePathInfo: nodePathInfo }, keyframe.frame)))] }) })
         ] }));
 };
 exports.TimelineExpandedKeyframeRow = react_1.default.memo(TimelineExpandedKeyframeRowUnmemoized);

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

@@ -1,9 +1,13 @@
 import React from 'react';
 import type { ArrayFieldSchema, CanUpdateSequencePropStatusStatic, SequencePropsSubscriptionKey, VisibleFieldSchema } from 'remotion';
 import type { SchemaFieldInfo, TimelineFieldOnDragValueChange, TimelineFieldOnSave } from '../../helpers/timeline-layout';
+type CaptionsFieldSchema = Extract<VisibleFieldSchema, {
+    type: 'remotion-captions';
+}>;
+type PrimitiveFieldSchema = Exclude<VisibleFieldSchema, ArrayFieldSchema | CaptionsFieldSchema>;
 export type TimelinePrimitiveFieldInfo = Omit<SchemaFieldInfo, 'fieldSchema' | 'typeName'> & {
-    readonly fieldSchema: Exclude<VisibleFieldSchema, ArrayFieldSchema>;
-    readonly typeName: Exclude<VisibleFieldSchema['type'], 'array'>;
+    readonly fieldSchema: PrimitiveFieldSchema;
+    readonly typeName: PrimitiveFieldSchema['type'];
 };
 export declare const isTimelinePrimitiveFieldInfo: (field: SchemaFieldInfo) => field is TimelinePrimitiveFieldInfo;
 export declare const TimelinePrimitiveFieldValue: React.FC<{
@@ -15,3 +19,4 @@ export declare const TimelinePrimitiveFieldValue: React.FC<{
     readonly effectiveValue: unknown;
     readonly scaleLockNodePath: SequencePropsSubscriptionKey | null;
 }>;
+export {};

package/dist/components/Timeline/TimelinePrimitiveFieldValue.js

@@ -24,7 +24,9 @@ const assetInlineWrapper = {
     minWidth: 0,
 };
 const isTimelinePrimitiveFieldInfo = (field) => {
-    return field.typeName !== 'array' && field.fieldSchema.type !== 'array';
+    return (field.typeName !== 'array' &&
+        field.fieldSchema.type !== 'array' &&
+        field.fieldSchema.type !== 'remotion-captions');
 };
 exports.isTimelinePrimitiveFieldInfo = isTimelinePrimitiveFieldInfo;
 const TimelinePrimitiveFieldValue = ({ field, onSave, onDragValueChange, onDragEnd, propStatus, effectiveValue, scaleLockNodePath, }) => {

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

@@ -14,9 +14,12 @@ export declare const TimelineRowChrome: React.FC<{
     readonly onSelect: (interaction?: TimelineSelectionInteraction) => void;
     readonly showSelectedBackground: boolean;
     readonly containsSelection: boolean;
+    readonly hovered?: boolean;
     readonly outerHeight: number | null;
     readonly onDragLeave?: (e: React.DragEvent<HTMLDivElement>) => void;
     readonly onDragOver?: (e: React.DragEvent<HTMLDivElement>) => void;
     readonly onDrop?: (e: React.DragEvent<HTMLDivElement>) => void;
     readonly onDoubleClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    readonly onPointerEnter?: () => void;
+    readonly onPointerLeave?: () => void;
 }>;

package/dist/components/Timeline/TimelineRowChrome.js

@@ -24,7 +24,7 @@ const keyframeControlsColumnBaseStyle = {
     flexShrink: 0,
     justifyContent: 'flex-start',
 };
-const TimelineRowChrome = ({ depth, eye, keyframeControls, arrow, children, style, selected, selectable, selectionItem, onSelect, showSelectedBackground, containsSelection, outerHeight, onDragLeave, onDragOver, onDrop, onDoubleClick, }) => {
+const TimelineRowChrome = ({ depth, eye, keyframeControls, arrow, children, style, selected, selectable, selectionItem, onSelect, showSelectedBackground, containsSelection, hovered = false, outerHeight, onDragLeave, onDragOver, onDrop, onDoubleClick, onPointerEnter, onPointerLeave, }) => {
     const ref = (0, react_1.useRef)(null);
     const { basePadding, keyframeControlsPadding, rowBorderRadius, rowHorizontalMargin, } = (0, react_1.useContext)(TimelineRowLayoutContext_1.TimelineRowLayoutContext);
     const indentWidth = (0, timeline_row_layout_1.getTimelineRowIndentWidth)(depth);
@@ -59,6 +59,7 @@ const TimelineRowChrome = ({ depth, eye, keyframeControls, arrow, children, styl
         showSelectedBackground,
         selected,
         containsSelection,
+        hovered,
     });
     const innerRowStyle = (0, react_1.useMemo)(() => ({
         ...rowBase,
@@ -89,8 +90,8 @@ const TimelineRowChrome = ({ depth, eye, keyframeControls, arrow, children, styl
     const chrome = (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
             jsx_runtime_1.jsx("div", { style: leftChromeStyle, children: keyframeControls ? (jsx_runtime_1.jsx("div", { style: keyframeControlsColumnStyle, children: keyframeControls })) : (jsx_runtime_1.jsxs("div", { style: chromeColumnStyle, children: [eye, indentWidth > 0 ? jsx_runtime_1.jsx(Padder_1.Padder, { depth: depth }) : null, arrow] })) }), children] }));
     if (outerStyle) {
-        return (jsx_runtime_1.jsx("div", { ref: ref, style: outerStyle, onDragLeave: onDragLeave, onDragOver: onDragOver, onDrop: onDrop, onPointerDown: selectable ? onPointerDown : undefined, onContextMenu: selectable ? onContextMenu : undefined, onDoubleClick: onDoubleClick, children: jsx_runtime_1.jsx("div", { style: innerRowStyle, children: chrome }) }));
+        return (jsx_runtime_1.jsx("div", { ref: ref, style: outerStyle, onDragLeave: onDragLeave, onDragOver: onDragOver, onDrop: onDrop, onPointerDown: selectable ? onPointerDown : undefined, onContextMenu: selectable ? onContextMenu : undefined, onDoubleClick: onDoubleClick, onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, children: jsx_runtime_1.jsx("div", { style: innerRowStyle, children: chrome }) }));
     }
-    return (jsx_runtime_1.jsx("div", { ref: ref, onDragLeave: onDragLeave, onDragOver: onDragOver, onDrop: onDrop, onPointerDown: selectable ? onPointerDown : undefined, onContextMenu: selectable ? onContextMenu : undefined, onDoubleClick: onDoubleClick, style: innerRowStyle, children: chrome }));
+    return (jsx_runtime_1.jsx("div", { ref: ref, onDragLeave: onDragLeave, onDragOver: onDragOver, onDrop: onDrop, onPointerDown: selectable ? onPointerDown : undefined, onContextMenu: selectable ? onContextMenu : undefined, onDoubleClick: onDoubleClick, onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, style: innerRowStyle, children: chrome }));
 };
 exports.TimelineRowChrome = TimelineRowChrome;

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

@@ -3,16 +3,18 @@ import { type GetDragOverrides, type GetEffectDragOverrides, type PropStatuses }
 import type { SequenceNodePathInfo, TimelineTrackData } from '../../helpers/get-timeline-sequence-sort-key';
 import { type GetIsExpanded } from '../ExpandedTracksProvider';
 export declare const TIMELINE_SELECTED_BACKGROUND = "#3B3F42";
+export declare const TIMELINE_HOVER_BACKGROUND = "rgba(255, 255, 255, 0.05)";
 export declare const TIMELINE_SELECTED_LABEL_BACKGROUND = "#B0B0B0";
 export declare const TIMELINE_SELECTED_LABEL_TEXT = "black";
 export declare const TIMELINE_SELECTED_LABEL_HORIZONTAL_PADDING = 2;
 export declare const getTimelineSelectedLabelStyle: (selected: boolean, subcategory: boolean) => CSSProperties;
 export declare const getTimelineColor: (selected: boolean, subcategory: boolean) => "black" | "rgba(255, 255, 255, 0.8)";
 export declare const getTimelineSelectedTrackHighlightStyle: (timelineWidth: number, backgroundColor?: string) => CSSProperties;
-export declare const getTimelineRowHighlightBackground: ({ showSelectedBackground, selected, containsSelection, }: {
+export declare const getTimelineRowHighlightBackground: ({ showSelectedBackground, selected, containsSelection, hovered, }: {
     readonly showSelectedBackground: boolean;
     readonly selected: boolean;
     readonly containsSelection: boolean;
+    readonly hovered: boolean;
 }) => string | undefined;
 export declare const TIMELINE_BACKGROUND = "#0F1113";
 export declare const TIMELINE_TICKS_BACKGROUND = "rgb(31,36,40)";
@@ -213,5 +215,5 @@ export declare const useTimelineGuideSelection: (guideId: string) => {
     selectionItem: TimelineSelection;
 };
 export declare const useTimelineRowContainsSelection: (nodePathInfo: SequenceNodePathInfo | null) => boolean;
-export declare const useTimelineRowHighlightBackground: (nodePathInfo: SequenceNodePathInfo | null) => string | undefined;
+export declare const useTimelineRowHighlightBackground: (nodePathInfo: SequenceNodePathInfo | null, hovered?: boolean) => string | undefined;
 export {};

package/dist/components/Timeline/TimelineSelection.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useTimelineRowHighlightBackground = exports.useTimelineRowContainsSelection = exports.useTimelineGuideSelection = exports.useTimelineEasingSelection = exports.useTimelineKeyframeSelection = exports.useTimelineRowSelection = exports.useTimelineFocusableItem = exports.useTimelineMarqueeSelectableItem = exports.useTimelineMarqueeSelection = exports.useCurrentTimelineSelectionStateAsRef = exports.TIMELINE_SCRUBBER_ATTR = exports.TIMELINE_MARQUEE_ITEM_ATTR = exports.useTimelineSelection = exports.TimelineSelectionProvider = exports.TimelineSelectableItemsProvider = exports.TimelineSelectAllKeybindings = exports.getTimelineSequenceSelectionKey = exports.getSelectableTimelineItems = exports.getSelectableTimelineSequenceSelections = exports.getTimelineSelectionKey = exports.getTimelineSelectionFromNodePathInfo = exports.TimelineSelectionOrderProvider = exports.extendTimelineMarqueeSelection = exports.getTimelineMarqueeSelection = exports.timelineMarqueeRectsIntersect = exports.getClampedTimelineMarqueePoint = exports.getNormalizedTimelineMarqueeRect = exports.getAvailableTimelineSelectionState = exports.getTimelineSelectionAfterInteraction = exports.EMPTY_TIMELINE_SELECTION_STATE = exports.shouldSelectTimelineRowOnPointerDown = exports.isTimelineSelectionModifierEvent = exports.TIMELINE_TICKS_BACKGROUND = exports.TIMELINE_BACKGROUND = exports.getTimelineRowHighlightBackground = exports.getTimelineSelectedTrackHighlightStyle = exports.getTimelineColor = exports.getTimelineSelectedLabelStyle = exports.TIMELINE_SELECTED_LABEL_HORIZONTAL_PADDING = exports.TIMELINE_SELECTED_LABEL_TEXT = exports.TIMELINE_SELECTED_LABEL_BACKGROUND = exports.TIMELINE_SELECTED_BACKGROUND = void 0;
+exports.useTimelineRowHighlightBackground = exports.useTimelineRowContainsSelection = exports.useTimelineGuideSelection = exports.useTimelineEasingSelection = exports.useTimelineKeyframeSelection = exports.useTimelineRowSelection = exports.useTimelineFocusableItem = exports.useTimelineMarqueeSelectableItem = exports.useTimelineMarqueeSelection = exports.useCurrentTimelineSelectionStateAsRef = exports.TIMELINE_SCRUBBER_ATTR = exports.TIMELINE_MARQUEE_ITEM_ATTR = exports.useTimelineSelection = exports.TimelineSelectionProvider = exports.TimelineSelectableItemsProvider = exports.TimelineSelectAllKeybindings = exports.getTimelineSequenceSelectionKey = exports.getSelectableTimelineItems = exports.getSelectableTimelineSequenceSelections = exports.getTimelineSelectionKey = exports.getTimelineSelectionFromNodePathInfo = exports.TimelineSelectionOrderProvider = exports.extendTimelineMarqueeSelection = exports.getTimelineMarqueeSelection = exports.timelineMarqueeRectsIntersect = exports.getClampedTimelineMarqueePoint = exports.getNormalizedTimelineMarqueeRect = exports.getAvailableTimelineSelectionState = exports.getTimelineSelectionAfterInteraction = exports.EMPTY_TIMELINE_SELECTION_STATE = exports.shouldSelectTimelineRowOnPointerDown = exports.isTimelineSelectionModifierEvent = exports.TIMELINE_TICKS_BACKGROUND = exports.TIMELINE_BACKGROUND = exports.getTimelineRowHighlightBackground = exports.getTimelineSelectedTrackHighlightStyle = exports.getTimelineColor = exports.getTimelineSelectedLabelStyle = exports.TIMELINE_SELECTED_LABEL_HORIZONTAL_PADDING = exports.TIMELINE_SELECTED_LABEL_TEXT = exports.TIMELINE_SELECTED_LABEL_BACKGROUND = exports.TIMELINE_HOVER_BACKGROUND = exports.TIMELINE_SELECTED_BACKGROUND = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const studio_shared_1 = require("@remotion/studio-shared");
 const react_1 = require("react");
@@ -21,6 +21,7 @@ const timeline_refs_1 = require("./timeline-refs");
 const TimelineClipboardKeybindings_1 = require("./TimelineClipboardKeybindings");
 const TimelineDeleteKeybindings_1 = require("./TimelineDeleteKeybindings");
 exports.TIMELINE_SELECTED_BACKGROUND = colors_1.TIMELINE_SELECTED_BACKGROUND_COLOR;
+exports.TIMELINE_HOVER_BACKGROUND = colors_1.WHITE_ALPHA_05;
 exports.TIMELINE_SELECTED_LABEL_BACKGROUND = colors_1.TIMELINE_SELECTED_LABEL_BACKGROUND_COLOR;
 exports.TIMELINE_SELECTED_LABEL_TEXT = colors_1.BLACK;
 exports.TIMELINE_SELECTED_LABEL_HORIZONTAL_PADDING = 2;
@@ -54,10 +55,11 @@ const getTimelineSelectedTrackHighlightStyle = (timelineWidth, backgroundColor =
     width: timelineWidth,
 });
 exports.getTimelineSelectedTrackHighlightStyle = getTimelineSelectedTrackHighlightStyle;
-const getTimelineRowHighlightBackground = ({ showSelectedBackground, selected, containsSelection, }) => {
-    return showSelectedBackground && (selected || containsSelection)
-        ? exports.TIMELINE_SELECTED_BACKGROUND
-        : undefined;
+const getTimelineRowHighlightBackground = ({ showSelectedBackground, selected, containsSelection, hovered, }) => {
+    if (showSelectedBackground && (selected || containsSelection)) {
+        return exports.TIMELINE_SELECTED_BACKGROUND;
+    }
+    return hovered ? exports.TIMELINE_HOVER_BACKGROUND : undefined;
 };
 exports.getTimelineRowHighlightBackground = getTimelineRowHighlightBackground;
 exports.TIMELINE_BACKGROUND = colors_1.TIMELINE_BACKGROUND_COLOR;
@@ -1109,13 +1111,14 @@ const useTimelineRowContainsSelection = (nodePathInfo) => {
     return containsSelection(nodePathInfo);
 };
 exports.useTimelineRowContainsSelection = useTimelineRowContainsSelection;
-const useTimelineRowHighlightBackground = (nodePathInfo) => {
+const useTimelineRowHighlightBackground = (nodePathInfo, hovered = false) => {
     const { selected } = (0, exports.useTimelineRowSelection)(nodePathInfo);
     const containsSelection = (0, exports.useTimelineRowContainsSelection)(nodePathInfo);
     return (0, exports.getTimelineRowHighlightBackground)({
         showSelectedBackground: true,
         selected,
         containsSelection,
+        hovered,
     });
 };
 exports.useTimelineRowHighlightBackground = useTimelineRowHighlightBackground;

package/dist/components/Timeline/TimelineSequence.js

@@ -291,10 +291,7 @@ const TimelineSequenceInner = ({ s, connectedCompositions, windowWidth, nodePath
                     },
                 ],
             });
-            if (result.success) {
-                (0, NotificationCenter_1.showNotification)('Removed sequence from source file', 2000);
-            }
-            else {
+            if (!result.success) {
                 (0, NotificationCenter_1.showNotification)(result.reason, 4000);
             }
         }

package/dist/components/Timeline/TimelineSequenceItem.js

@@ -46,6 +46,7 @@ const studio_runtime_config_1 = require("../../helpers/studio-runtime-config");
 const timeline_layout_1 = require("../../helpers/timeline-layout");
 const use_keybinding_1 = require("../../helpers/use-keybinding");
 const modals_1 = require("../../state/modals");
+const timeline_sequence_hover_1 = require("../../state/timeline-sequence-hover");
 const call_api_1 = require("../call-api");
 const CompositionOrStillIcon_1 = require("../CompositionOrStillIcon");
 const ConfirmationDialog_1 = require("../ConfirmationDialog");
@@ -176,6 +177,7 @@ const TimelineSequenceItem = ({ children, connectedCompositions, nestedDepth, se
     var _a, _b, _c;
     var _d, _e, _f;
     const nodePath = (_d = nodePathInfo === null || nodePathInfo === void 0 ? void 0 : nodePathInfo.sequenceSubscriptionKey) !== null && _d !== void 0 ? _d : null;
+    const { hovered, onPointerEnter, onPointerLeave } = (0, timeline_sequence_hover_1.useTimelineSequenceHover)(nodePathInfo);
     const { previewServerState } = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx);
     const previewConnected = previewServerState.type === 'connected';
     const previewInteractive = previewConnected && (0, interactivity_enabled_1.isStudioInteractivityEnabled)();
@@ -268,10 +270,7 @@ const TimelineSequenceItem = ({ children, connectedCompositions, nestedDepth, se
                     },
                 ],
             });
-            if (result.success) {
-                (0, NotificationCenter_1.showNotification)('Removed sequence from source file', 2000);
-            }
-            else {
+            if (!result.success) {
                 (0, NotificationCenter_1.showNotification)(result.reason, 4000);
             }
         }
@@ -857,7 +856,7 @@ const TimelineSequenceItem = ({ children, connectedCompositions, nestedDepth, se
             clientId: previewServerState.clientId,
         });
     }, [canDropEffect, nodePath, previewServerState, validatedLocation]);
-    const trackRow = (jsx_runtime_1.jsx(TimelineRowChrome_1.TimelineRowChrome, { depth: nestedDepth, eye: canToggleVisibility ? (jsx_runtime_1.jsx(TimelineLayerEye_1.TimelineLayerEye, { type: sequence.type === 'audio' ? 'speaker' : 'eye', hidden: isItemHidden, onInvoked: onToggleVisibility })) : (jsx_runtime_1.jsx(TimelineLayerEye_1.TimelineLayerEyeSpacer, {})), arrow: hasExpandableContent && nodePathInfo !== null ? (jsx_runtime_1.jsx(TimelineSequenceExpandArrow, { disabled: !previewInteractive, isExpanded: isExpanded, nodePathInfo: nodePathInfo, onToggleExpand: onToggleExpand, sequence: sequence })) : (jsx_runtime_1.jsx(TimelineExpandArrowButton_1.TimelineExpandArrowSpacer, {})), style: rowStyle, selected: selected, selectable: selectable, selectionItem: selectionItem, onSelect: onSelect, showSelectedBackground: true, containsSelection: containsSelection, outerHeight: outerHeight, onDragLeave: canDropEffect ? onEffectDragLeave : undefined, onDragOver: canDropEffect ? onEffectDragOver : undefined, onDrop: canDropEffect ? onEffectDrop : undefined, onDoubleClick: canHandleSequenceDoubleClick ? onSequenceDoubleClick : undefined, children: jsx_runtime_1.jsxs("div", { style: labelContainerStyle, children: [connectedCompositions.length > 0 ? (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
+    const trackRow = (jsx_runtime_1.jsx(TimelineRowChrome_1.TimelineRowChrome, { depth: nestedDepth, eye: canToggleVisibility ? (jsx_runtime_1.jsx(TimelineLayerEye_1.TimelineLayerEye, { type: sequence.type === 'audio' ? 'speaker' : 'eye', hidden: isItemHidden, onInvoked: onToggleVisibility })) : (jsx_runtime_1.jsx(TimelineLayerEye_1.TimelineLayerEyeSpacer, {})), arrow: hasExpandableContent && nodePathInfo !== null ? (jsx_runtime_1.jsx(TimelineSequenceExpandArrow, { disabled: !previewInteractive, isExpanded: isExpanded, nodePathInfo: nodePathInfo, onToggleExpand: onToggleExpand, sequence: sequence })) : (jsx_runtime_1.jsx(TimelineExpandArrowButton_1.TimelineExpandArrowSpacer, {})), style: rowStyle, selected: selected, selectable: selectable, selectionItem: selectionItem, onSelect: onSelect, showSelectedBackground: true, containsSelection: containsSelection, hovered: hovered, outerHeight: outerHeight, onDragLeave: canDropEffect ? onEffectDragLeave : undefined, onDragOver: canDropEffect ? onEffectDragOver : undefined, onDrop: canDropEffect ? onEffectDrop : undefined, onDoubleClick: canHandleSequenceDoubleClick ? onSequenceDoubleClick : undefined, onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, children: jsx_runtime_1.jsxs("div", { style: labelContainerStyle, children: [connectedCompositions.length > 0 ? (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
                         jsx_runtime_1.jsx(CompositionOrStillIcon_1.CompositionOrStillIcon, { color: (0, TimelineSelection_1.getTimelineColor)(false, false), composition: connectedCompositions[0], style: connectedCompositionIconStyle }), jsx_runtime_1.jsx(layout_1.Spacing, { x: 0.5 })
                     ] })) : null, jsx_runtime_1.jsx(TimelineSequenceName_1.TimelineSequenceName, { displayName: timelineDisplayName, fallbackDisplayName: fallbackDisplayName, selected: selected, containsSelection: containsSelection, editing: isRenaming, onCancelEditing: onCancelRenaming, onSaveName: onSaveName }), mediaSrc ? (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
                         jsx_runtime_1.jsx(layout_1.Spacing, { x: 0.5 }),

package/dist/components/Timeline/TimelineSequencePropItem.js

@@ -10,6 +10,7 @@ const open_in_editor_1 = require("../../helpers/open-in-editor");
 const ContextMenu_1 = require("../ContextMenu");
 const InspectorPanelLayout_1 = require("../InspectorPanelLayout");
 const call_add_keyframe_1 = require("./call-add-keyframe");
+const get_sequence_prop_reset_changes_1 = require("./get-sequence-prop-reset-changes");
 const save_sequence_prop_1 = require("./save-sequence-prop");
 const TimelineExpandArrowButton_1 = require("./TimelineExpandArrowButton");
 const TimelineFieldRowContent_1 = require("./TimelineFieldRowContent");
@@ -230,16 +231,14 @@ const TimelineSequencePropItem = ({ field, validatedLocation, rowDepth, nodePath
         (0, save_sequence_prop_1.saveSequenceProps)({
             addedKeyframes: null,
             movedKeyframes: null,
-            changes: [
-                {
-                    fileName: validatedLocation.source,
-                    nodePath,
-                    fieldKey: field.key,
-                    value: field.fieldSchema.default,
-                    defaultValue,
-                    schema,
-                },
-            ],
+            changes: (0, get_sequence_prop_reset_changes_1.getSequencePropResetChanges)({
+                fileName: validatedLocation.source,
+                nodePath,
+                fieldKey: field.key,
+                value: field.fieldSchema.default,
+                defaultValue,
+                schema,
+            }),
             setPropStatuses,
             clientId: previewServerState.clientId,
             undoLabel: `Reset ${fieldLabel}`,

package/dist/components/Timeline/TimelineStack/get-stack.js

@@ -6,6 +6,7 @@ const get_source_map_1 = require("../../../error-overlay/react-overlay/utils/get
 const get_location_of_sequence_1 = require("../../../helpers/get-location-of-sequence");
 const traceMapCache = {};
 const traceMapPromises = {};
+const browserStudioOriginalSourcePrefix = 'browser-studio-original://';
 const getSourceMapCache = async (fileName) => {
     if (traceMapCache[fileName]) {
         return traceMapCache[fileName];
@@ -32,6 +33,13 @@ const getOriginalLocationFromStack = async (stack, type) => {
     if (!location) {
         return null;
     }
+    if (location.fileName.startsWith(browserStudioOriginalSourcePrefix)) {
+        return {
+            column: location.columnNumber,
+            line: location.lineNumber,
+            source: decodeURIComponent(location.fileName.slice(browserStudioOriginalSourcePrefix.length)),
+        };
+    }
     const map = await getSourceMapCache(location.fileName);
     const originalPosition = (0, get_source_map_1.getOriginalPosition)(map, location.lineNumber, location.columnNumber);
     return originalPosition;

package/dist/components/Timeline/TimelineTrack.js

@@ -38,6 +38,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
 const client_id_1 = require("../../helpers/client-id");
 const timeline_layout_1 = require("../../helpers/timeline-layout");
+const timeline_sequence_hover_1 = require("../../state/timeline-sequence-hover");
 const ExpandedTracksProvider_1 = require("../ExpandedTracksProvider");
 const TimelineExpandedTrackKeyframes_1 = require("./TimelineExpandedTrackKeyframes");
 const TimelineSelection_1 = require("./TimelineSelection");
@@ -49,7 +50,8 @@ const TimelineTrackUnmemoized = ({ track }) => {
     const { previewServerState } = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx);
     const previewServerConnected = previewServerState.type === 'connected';
     const timelineWidth = (0, react_1.useContext)(TimelineWidthProvider_1.TimelineWidthContext);
-    const rowHighlightBackground = (0, TimelineSelection_1.useTimelineRowHighlightBackground)(track.nodePathInfo);
+    const { hovered, onPointerEnter, onPointerLeave } = (0, timeline_sequence_hover_1.useTimelineSequenceHover)(track.nodePathInfo);
+    const rowHighlightBackground = (0, TimelineSelection_1.useTimelineRowHighlightBackground)(track.nodePathInfo, hovered);
     const layerStyle = (0, react_1.useMemo)(() => ({
         height: (0, timeline_layout_1.getTimelineLayerHeight)(track.sequence.type),
         marginBottom: timeline_layout_1.TIMELINE_ITEM_BORDER_BOTTOM,
@@ -58,7 +60,7 @@ const TimelineTrackUnmemoized = ({ track }) => {
     const showExpandedKeyframes = track.nodePathInfo !== null &&
         previewServerConnected &&
         getIsExpanded(track.nodePathInfo);
-    return (jsx_runtime_1.jsxs("div", { children: [
+    return (jsx_runtime_1.jsxs("div", { onPointerEnter: onPointerEnter, onPointerLeave: onPointerLeave, children: [
             jsx_runtime_1.jsxs("div", { style: layerStyle, children: [rowHighlightBackground && timelineWidth !== null ? (jsx_runtime_1.jsx("div", { style: (0, TimelineSelection_1.getTimelineSelectedTrackHighlightStyle)(timelineWidth, rowHighlightBackground) })) : null, jsx_runtime_1.jsx(TimelineSequence_1.TimelineSequence, { s: track.sequence, connectedCompositions: (_a = track.connectedCompositions) !== null && _a !== void 0 ? _a : [], nodePathInfo: track.nodePathInfo, sequenceFrameOffset: track.sequenceFrameOffset })
                 ] }), showExpandedKeyframes && track.nodePathInfo ? (jsx_runtime_1.jsx(TimelineExpandedTrackKeyframes_1.TimelineExpandedTrackKeyframes, { sequence: track.sequence, nodePathInfo: track.nodePathInfo, keyframeDisplayOffset: track.keyframeDisplayOffset })) : null] }));
 };

package/dist/components/Timeline/border-radius-representation.d.ts

@@ -0,0 +1,16 @@
+import { BORDER_RADIUS_LONGHAND_KEYS, BORDER_RADIUS_SHORTHAND_KEY } from '@remotion/studio-shared';
+import type { CanUpdateSequencePropStatus, DragOverrideValue } from 'remotion';
+export { BORDER_RADIUS_LONGHAND_KEYS, BORDER_RADIUS_SHORTHAND_KEY };
+export type BorderRadiusConversion = {
+    readonly type: 'individual';
+    readonly value: number;
+} | {
+    readonly type: 'shorthand';
+    readonly value: number;
+};
+export type BorderRadiusConversionChange = {
+    readonly fieldKey: string;
+    readonly value: number | undefined;
+};
+export declare const getBorderRadiusConversionChanges: (conversion: BorderRadiusConversion) => BorderRadiusConversionChange[];
+export declare const getBorderRadiusConversion: (props: Record<string, CanUpdateSequencePropStatus> | undefined, dragOverrides?: Record<string, DragOverrideValue>) => BorderRadiusConversion | null;

package/dist/components/Timeline/border-radius-representation.js

@@ -0,0 +1,60 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getBorderRadiusConversion = exports.getBorderRadiusConversionChanges = exports.BORDER_RADIUS_SHORTHAND_KEY = exports.BORDER_RADIUS_LONGHAND_KEYS = void 0;
+const studio_shared_1 = require("@remotion/studio-shared");
+Object.defineProperty(exports, "BORDER_RADIUS_LONGHAND_KEYS", { enumerable: true, get: function () { return studio_shared_1.BORDER_RADIUS_LONGHAND_KEYS; } });
+Object.defineProperty(exports, "BORDER_RADIUS_SHORTHAND_KEY", { enumerable: true, get: function () { return studio_shared_1.BORDER_RADIUS_SHORTHAND_KEY; } });
+const getBorderRadiusConversionChanges = (conversion) => {
+    if (conversion.type === 'individual') {
+        return [
+            { fieldKey: studio_shared_1.BORDER_RADIUS_SHORTHAND_KEY, value: undefined },
+            ...studio_shared_1.BORDER_RADIUS_LONGHAND_KEYS.map((fieldKey) => ({
+                fieldKey,
+                value: conversion.value,
+            })),
+        ];
+    }
+    return [
+        ...studio_shared_1.BORDER_RADIUS_LONGHAND_KEYS.map((fieldKey) => ({
+            fieldKey,
+            value: undefined,
+        })),
+        { fieldKey: studio_shared_1.BORDER_RADIUS_SHORTHAND_KEY, value: conversion.value },
+    ];
+};
+exports.getBorderRadiusConversionChanges = getBorderRadiusConversionChanges;
+const getBorderRadiusConversion = (props, dragOverrides = {}) => {
+    const getStaticValue = (key) => {
+        const status = props === null || props === void 0 ? void 0 : props[key];
+        if (status !== undefined && status.status !== 'static') {
+            return { isStatic: false, value: undefined };
+        }
+        const dragOverride = dragOverrides[key];
+        if ((dragOverride === null || dragOverride === void 0 ? void 0 : dragOverride.type) === 'keyframed') {
+            return { isStatic: false, value: undefined };
+        }
+        return {
+            isStatic: true,
+            value: (dragOverride === null || dragOverride === void 0 ? void 0 : dragOverride.type) === 'static'
+                ? dragOverride.value
+                : status === null || status === void 0 ? void 0 : status.codeValue,
+        };
+    };
+    const shorthand = getStaticValue(studio_shared_1.BORDER_RADIUS_SHORTHAND_KEY);
+    if (shorthand.isStatic && typeof shorthand.value === 'number') {
+        return { type: 'individual', value: shorthand.value };
+    }
+    const longhands = studio_shared_1.BORDER_RADIUS_LONGHAND_KEYS.map(getStaticValue);
+    const hasNoAuthoredRadius = [shorthand, ...longhands].every((status) => status.isStatic && status.value === undefined);
+    if (hasNoAuthoredRadius) {
+        return { type: 'individual', value: 0 };
+    }
+    if (longhands.every((status) => status.isStatic && typeof status.value === 'number')) {
+        const values = longhands.map((status) => status.value);
+        if (values.every((value) => value === values[0])) {
+            return { type: 'shorthand', value: values[0] };
+        }
+    }
+    return null;
+};
+exports.getBorderRadiusConversion = getBorderRadiusConversion;

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

@@ -46,12 +46,7 @@ const deleteSequencesFromSource = async (nodePathInfos, confirm) => {
         }),
     })
         .then((result) => {
-        if (result.success) {
-            (0, NotificationCenter_1.showNotification)(nodePathInfos.length === 1
-                ? 'Removed sequence from source file'
-                : 'Removed sequences from source files', 2000);
-        }
-        else {
+        if (!result.success) {
             (0, NotificationCenter_1.showNotification)(result.reason, 4000);
         }
         return true;

package/dist/components/Timeline/get-sequence-prop-reset-changes.d.ts

@@ -0,0 +1,10 @@
+import type { InteractivitySchema, SequencePropsSubscriptionKey } from 'remotion';
+import type { SaveSequencePropChange } from './save-sequence-prop';
+export declare const getSequencePropResetChanges: ({ fileName, nodePath, fieldKey, value, defaultValue, schema, }: {
+    readonly fileName: string;
+    readonly nodePath: SequencePropsSubscriptionKey;
+    readonly fieldKey: string;
+    readonly value: unknown;
+    readonly defaultValue: string | null;
+    readonly schema: InteractivitySchema;
+}) => SaveSequencePropChange[];