@remotion/studio 4.0.516 → 4.0.518

package/dist/esm/renderEntry.mjs

@@ -213,7 +213,7 @@ var renderContent = (Root) => {
     renderToDOM(/* @__PURE__ */ jsx("div", {
       children: /* @__PURE__ */ jsx(DelayedSpinner, {})
     }));
-    import("./chunk-w4244j4n.js").then(({ StudioInternals }) => {
+    import("./chunk-7prjt5n5.js").then(({ StudioInternals }) => {
       window.remotion_isStudio = true;
       window.remotion_isReadOnlyStudio = true;
       window.remotion_inputProps = "{}";

package/dist/helpers/calculate-timeline.d.ts

@@ -1,7 +1 @@
-import type { OverrideIdToNodePaths, TSequence } from 'remotion';
-import type { TimelineTrackData } from './get-timeline-sequence-sort-key';
-export declare const calculateTimeline: ({ sequences, overrideIdsToNodePaths, compositions, }: {
-    sequences: TSequence[];
-    overrideIdsToNodePaths: OverrideIdToNodePaths;
-    compositions?: readonly import("remotion").AnyComposition[] | undefined;
-}) => TimelineTrackData[];
+export { calculateTimeline } from '@remotion/canvas';

package/dist/helpers/calculate-timeline.js

@@ -1,149 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.calculateTimeline = void 0;
-const get_connected_compositions_1 = require("./get-connected-compositions");
-const get_sequence_visible_range_1 = require("./get-sequence-visible-range");
-const get_timeline_nestedness_1 = require("./get-timeline-nestedness");
-const get_timeline_sequence_sort_key_1 = require("./get-timeline-sequence-sort-key");
-const sort_by_nonce_history_1 = require("./sort-by-nonce-history");
-const timeline_node_path_key_1 = require("./timeline-node-path-key");
-const getInheritedLoopDisplay = (sequence, sequences) => {
-    if (sequence.loopDisplay) {
-        return sequence.loopDisplay;
-    }
-    if (!sequence.parent) {
-        return undefined;
-    }
-    const parent = sequences.find((s) => s.id === sequence.parent);
-    if (!parent) {
-        return undefined;
-    }
-    return getInheritedLoopDisplay(parent, sequences);
-};
-const calculateTimeline = ({ sequences, overrideIdsToNodePaths, compositions = [], }) => {
-    var _a, _b;
-    var _c, _d;
-    const sortedSequences = (0, sort_by_nonce_history_1.sortItemsByNonceHistory)(sequences);
-    const tracks = [];
-    if (sortedSequences.length === 0) {
-        return [];
-    }
-    const connectedCompositionsBySequenceId = new Map();
-    for (const sequence of sortedSequences) {
-        const connectedCompositions = (0, get_connected_compositions_1.getConnectedCompositions)({
-            compositions,
-            singleChildComponent: sequence.singleChildComponent,
-        });
-        if (connectedCompositions.length > 0) {
-            connectedCompositionsBySequenceId.set(sequence.id, connectedCompositions);
-        }
-    }
-    const sequencesById = new Map(sortedSequences.map((sequence) => [sequence.id, sequence]));
-    const timelineSequences = sortedSequences.filter((sequence) => {
-        var _a;
-        var _b;
-        let parentId = sequence.parent;
-        while (parentId !== null) {
-            if (connectedCompositionsBySequenceId.has(parentId)) {
-                return false;
-            }
-            parentId = (_b = (_a = sequencesById.get(parentId)) === null || _a === void 0 ? void 0 : _a.parent) !== null && _b !== void 0 ? _b : null;
-        }
-        return true;
-    });
-    for (let i = 0; i < timelineSequences.length; i++) {
-        const sequence = timelineSequences[i];
-        const cascadedStart = (0, get_sequence_visible_range_1.getCascadedStart)(sequence, sortedSequences);
-        const cascadedStartWithTrim = (0, get_sequence_visible_range_1.getCascadedStartWithTrim)(sequence, sortedSequences);
-        const effectiveFrom = sequence.trimBefore === null
-            ? sequence.from
-            : sequence.from - sequence.trimBefore;
-        const visibleStart = (0, get_sequence_visible_range_1.getTimelineVisibleStart)(sequence, sortedSequences);
-        const visibleDuration = (0, get_sequence_visible_range_1.getTimelineVisibleDuration)(sequence, sortedSequences);
-        const overrideId = (_c = (_a = sequence.controls) === null || _a === void 0 ? void 0 : _a.overrideId) !== null && _c !== void 0 ? _c : null;
-        const nodePath = overrideId ? overrideIdsToNodePaths[overrideId] : null;
-        const hasKeyframeRows = sequence.controls !== null || sequence.effects.length > 0;
-        const connectedCompositions = (_d = connectedCompositionsBySequenceId.get(sequence.id)) !== null && _d !== void 0 ? _d : [];
-        tracks.push({
-            ...(connectedCompositions.length > 0 ? { connectedCompositions } : {}),
-            sequence: {
-                ...sequence,
-                from: visibleStart,
-                duration: visibleDuration,
-                loopDisplay: sequence.type === 'audio' || sequence.type === 'video'
-                    ? getInheritedLoopDisplay(sequence, sortedSequences)
-                    : sequence.loopDisplay,
-            },
-            depth: (0, get_timeline_nestedness_1.getTimelineNestedLevel)(sequence, sortedSequences, 0),
-            cascadedStart,
-            localStart: sequence.from,
-            cascadedDuration: sequence.duration,
-            keyframeDisplayOffset: hasKeyframeRows
-                ? cascadedStartWithTrim - effectiveFrom
-                : 0,
-            sequenceFrameOffset: visibleStart - cascadedStartWithTrim,
-            nodePathInfo: nodePath
-                ? {
-                    sequenceSubscriptionKey: nodePath,
-                    auxiliaryKeys: [],
-                    index: 0,
-                    numberOfSequencesWithThisNodePath: 0,
-                    supportsEffects: ((_b = sequence.controls) === null || _b === void 0 ? void 0 : _b.supportsEffects) === true,
-                }
-                : null,
-        });
-    }
-    const nonceRanks = new Map();
-    for (let i = 0; i < tracks.length; i++) {
-        nonceRanks.set(tracks[i].sequence.id, i);
-    }
-    const sortedTracks = tracks
-        .sort((a, b) => {
-        const sortKeyA = (0, get_timeline_sequence_sort_key_1.getTimelineSequenceSortKey)(a, tracks, nonceRanks);
-        const sortKeyB = (0, get_timeline_sequence_sort_key_1.getTimelineSequenceSortKey)(b, tracks, nonceRanks);
-        return sortKeyA.localeCompare(sortKeyB);
-    })
-        .map((track) => {
-        const { cascadedDuration, ...cleanTrack } = track;
-        return cleanTrack;
-    });
-    const nodePathIndexCounters = new Map();
-    return sortedTracks
-        .map((track) => {
-        var _a;
-        if (track.nodePathInfo === null) {
-            return track;
-        }
-        const key = (0, timeline_node_path_key_1.timelineSequenceNodePathToKey)(track.nodePathInfo.sequenceSubscriptionKey);
-        const index = (_a = nodePathIndexCounters.get(key)) !== null && _a !== void 0 ? _a : 0;
-        nodePathIndexCounters.set(key, index + 1);
-        return {
-            ...track,
-            nodePathInfo: {
-                sequenceSubscriptionKey: track.nodePathInfo.sequenceSubscriptionKey,
-                auxiliaryKeys: track.nodePathInfo.auxiliaryKeys,
-                index,
-                numberOfSequencesWithThisNodePath: 0,
-                supportsEffects: track.nodePathInfo.supportsEffects,
-            },
-        };
-    })
-        .map((track) => {
-        var _a;
-        if (track.nodePathInfo === null) {
-            return track;
-        }
-        const key = (0, timeline_node_path_key_1.timelineSequenceNodePathToKey)(track.nodePathInfo.sequenceSubscriptionKey);
-        return {
-            ...track,
-            nodePathInfo: {
-                sequenceSubscriptionKey: track.nodePathInfo.sequenceSubscriptionKey,
-                auxiliaryKeys: track.nodePathInfo.auxiliaryKeys,
-                index: track.nodePathInfo.index,
-                numberOfSequencesWithThisNodePath: (_a = nodePathIndexCounters.get(key)) !== null && _a !== void 0 ? _a : 0,
-                supportsEffects: track.nodePathInfo.supportsEffects,
-            },
-        };
-    });
-};
-exports.calculateTimeline = calculateTimeline;
+const canvas_1 = require("@remotion/canvas");
+Object.defineProperty(exports, "calculateTimeline", { enumerable: true, get: function () { return canvas_1.calculateTimeline; } });

package/dist/helpers/create-folder-tree.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createFolderTree = exports.getKeysToExpand = exports.splitParentIntoNameAndParent = exports.buildAssetFolderStructure = void 0;
 const persist_open_folders_1 = require("./persist-open-folders");
+const sort_by_nonce_history_1 = require("./sort-by-nonce-history");
 const buildAssetFolderStructure = (files, parentFolderName, foldersExpanded) => {
     const notInFolder = files.filter((f) => !f.name.includes('/'));
     const inFolder = files.filter((f) => f.name.includes('/'));
@@ -152,6 +153,20 @@ const createFolderTree = (comps, folders, foldersExpanded) => {
         const list = findItemListToPush(items, item.folderName, item.parentFolderName);
         list.push(toPush);
     }
-    return items;
+    const sortTreeItems = (treeItems) => {
+        return (0, sort_by_nonce_history_1.sortItemsByNonceHistory)(treeItems.map((item) => ({
+            item,
+            nonce: item.type === 'folder' ? item.folder.nonce : item.composition.nonce,
+        }))).map(({ item }) => {
+            if (item.type === 'composition') {
+                return item;
+            }
+            return {
+                ...item,
+                items: sortTreeItems(item.items),
+            };
+        });
+    };
+    return sortTreeItems(items);
 };
 exports.createFolderTree = createFolderTree;

package/dist/helpers/editor-ruler.js

@@ -36,7 +36,8 @@ const drawGuide = ({ guideHighlight, scale, startMarking, context, canvasHeight,
         scale,
     }) +
         originOffset -
-        startMarking * scale;
+        startMarking * scale +
+        0.5;
     drawGradient({
         canvasHeight,
         context,
@@ -88,11 +89,11 @@ const drawMarkingOnRulerCanvas = ({ scale, points, startMarking, originOffset, m
     canvas.height = canvasHeight;
     context.scale(window.devicePixelRatio, window.devicePixelRatio);
     context.clearRect(0, 0, canvasWidth, canvasHeight);
-    context.strokeStyle = colors_1.RULER_COLOR;
+    context.strokeStyle = colors_1.WHITE_ALPHA_15;
     context.lineWidth = 1;
     context.beginPath();
     points.forEach((point) => {
-        context.strokeStyle = colors_1.RULER_COLOR;
+        context.strokeStyle = colors_1.WHITE_ALPHA_15;
         context.lineWidth = 1;
         const originDistance = point.position + originOffset - startMarking * scale;
         context.beginPath();
@@ -118,13 +119,13 @@ const drawMarkingOnRulerCanvas = ({ scale, points, startMarking, originOffset, m
         context.stroke();
         context.font = '10px Arial, Helvetica, sans-serif';
         context.textAlign = 'left';
-        context.fillStyle = colors_1.RULER_COLOR;
+        context.fillStyle = colors_1.LIGHT_TEXT;
         drawLabel({
             orientation,
             context,
             label: point.value.toString(),
             originDistance,
-            color: colors_1.RULER_COLOR,
+            color: colors_1.LIGHT_TEXT,
         });
     });
     if (guideHighlight && orientation !== guideHighlight.guide.orientation) {

package/dist/helpers/format-file-location.d.ts

@@ -2,6 +2,14 @@ type FileLocation = {
     readonly source: string | null;
     readonly line: number | null;
 };
+export type RelativeFileLocation = {
+    readonly filename: string;
+    readonly line: number;
+};
+export declare const getRelativeFileLocation: ({ location, root, }: {
+    readonly location: FileLocation | null;
+    readonly root: string;
+}) => RelativeFileLocation | null;
 export declare const formatFileLocation: ({ location, root, }: {
     readonly location: FileLocation | null;
     readonly root: string;

package/dist/helpers/format-file-location.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.formatContextForAgents = exports.formatFileLocation = void 0;
+exports.formatContextForAgents = exports.formatFileLocation = exports.getRelativeFileLocation = void 0;
 const normalizeSlashes = (path) => path.replace(/\\/g, '/');
 const stripTrailingSlashes = (path) => path.replace(/\/+$/, '');
 const stripLeadingDotSlash = (path) => path.replace(/^\.\/+/, '');
-const formatFileLocation = ({ location, root, }) => {
+const getRelativeFileLocation = ({ location, root, }) => {
     if (!(location === null || location === void 0 ? void 0 : location.source) || location.line === null) {
         return null;
     }
@@ -22,7 +22,18 @@ const formatFileLocation = ({ location, root, }) => {
     const relativeSource = sourceIsInsideRoot
         ? source.slice(normalizedRoot.length + 1)
         : source;
-    return `${stripLeadingDotSlash(relativeSource)}:${location.line}`;
+    return {
+        filename: stripLeadingDotSlash(relativeSource),
+        line: location.line,
+    };
+};
+exports.getRelativeFileLocation = getRelativeFileLocation;
+const formatFileLocation = ({ location, root, }) => {
+    const relativeLocation = (0, exports.getRelativeFileLocation)({ location, root });
+    if (relativeLocation === null) {
+        return null;
+    }
+    return `${relativeLocation.filename}:${relativeLocation.line}`;
 };
 exports.formatFileLocation = formatFileLocation;
 const formatContextForAgents = ({ name, location, root, }) => {

package/dist/helpers/get-asset-metadata.d.ts

@@ -1,5 +1,6 @@
 import type { CanvasContent } from 'remotion';
 import type { Dimensions } from './is-current-selected-still';
+import { type MediaMetadata } from './use-media-metadata';
 export declare const remotion_outputsBase: string;
 export type AssetMetadata = {
     type: 'not-found';
@@ -11,5 +12,23 @@ export type AssetMetadata = {
     size: number;
     dimensions: Dimensions | 'none' | null;
     fetchedAt: number;
+    mediaMetadata: MediaMetadata | null;
 };
+export declare const getAssetPreviewMetadata: ({ canvasContent, metadata, }: {
+    canvasContent: CanvasContent;
+    metadata: AssetMetadata;
+}) => {
+    asset: string;
+    width: number;
+    height: number;
+    fps: number;
+    durationInFrames: number;
+    props: {};
+    defaultCodec: null;
+    defaultOutName: null;
+    defaultVideoImageFormat: null;
+    defaultPixelFormat: null;
+    defaultProResProfile: null;
+    defaultSampleRate: number | null;
+} | null;
 export declare const getAssetMetadata: (canvasContent: CanvasContent, addTime: boolean) => Promise<AssetMetadata>;

package/dist/helpers/get-asset-metadata.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getAssetMetadata = exports.remotion_outputsBase = void 0;
-const media_utils_1 = require("@remotion/media-utils");
+exports.getAssetMetadata = exports.getAssetPreviewMetadata = exports.remotion_outputsBase = void 0;
 const remotion_1 = require("remotion");
 const add_asset_cache_bust_1 = require("./add-asset-cache-bust");
 const get_preview_file_type_1 = require("./get-preview-file-type");
+const use_media_metadata_1 = require("./use-media-metadata");
 exports.remotion_outputsBase = window.remotion_staticBase.replace('static', 'outputs');
 const getSrcFromCanvasContent = (canvasContent) => {
     if (canvasContent.type === 'asset') {
@@ -12,14 +12,51 @@ const getSrcFromCanvasContent = (canvasContent) => {
     }
     return exports.remotion_outputsBase + canvasContent.path;
 };
+const getAssetPreviewMetadata = ({ canvasContent, metadata, }) => {
+    if (canvasContent.type !== 'asset' ||
+        metadata.type !== 'found' ||
+        metadata.mediaMetadata === null ||
+        !Number.isFinite(metadata.mediaMetadata.duration) ||
+        metadata.mediaMetadata.duration <= 0) {
+        return null;
+    }
+    const fileType = (0, get_preview_file_type_1.getPreviewFileType)(canvasContent.asset);
+    if (fileType !== 'audio' && fileType !== 'video') {
+        return null;
+    }
+    const { dimensions } = metadata;
+    if (dimensions === null || dimensions === 'none') {
+        return null;
+    }
+    const detectedFps = metadata.mediaMetadata.fps;
+    const fps = detectedFps !== null && Number.isFinite(detectedFps) && detectedFps > 0
+        ? detectedFps
+        : 30;
+    return {
+        asset: canvasContent.asset,
+        width: dimensions.width,
+        height: dimensions.height,
+        fps,
+        durationInFrames: Math.max(1, Math.ceil(metadata.mediaMetadata.duration * fps)),
+        props: {},
+        defaultCodec: null,
+        defaultOutName: null,
+        defaultVideoImageFormat: null,
+        defaultPixelFormat: null,
+        defaultProResProfile: null,
+        defaultSampleRate: metadata.mediaMetadata.sampleRate,
+    };
+};
+exports.getAssetPreviewMetadata = getAssetPreviewMetadata;
 const getAssetMetadata = async (canvasContent, addTime) => {
-    var _a;
+    var _a, _b, _c;
     if (canvasContent.type === 'output-blob') {
         return {
             type: 'found',
             size: canvasContent.sizeInBytes,
             dimensions: { width: canvasContent.width, height: canvasContent.height },
             fetchedAt: Date.now(),
+            mediaMetadata: null,
         };
     }
     if (canvasContent.type === 'composition') {
@@ -50,13 +87,19 @@ const getAssetMetadata = async (canvasContent, addTime) => {
         const fetchedAt = Date.now();
         const srcWithTime = addTime ? (0, add_asset_cache_bust_1.addAssetCacheBust)({ fetchedAt, src }) : src;
         const fileType = (0, get_preview_file_type_1.getPreviewFileType)(src);
-        if (fileType === 'video') {
-            const resolution = await (0, media_utils_1.getVideoMetadata)(srcWithTime);
+        if (fileType === 'video' || fileType === 'audio') {
+            const mediaMetadata = await (0, use_media_metadata_1.getMediaMetadata)(srcWithTime);
+            if (mediaMetadata === null) {
+                throw new Error(`Could not read media metadata for ${src}`);
+            }
+            const width = (_b = mediaMetadata.width) !== null && _b !== void 0 ? _b : 1920;
+            const height = (_c = mediaMetadata.height) !== null && _c !== void 0 ? _c : 1080;
             return {
                 type: 'found',
                 size,
-                dimensions: { width: resolution.width, height: resolution.height },
+                dimensions: { width, height },
                 fetchedAt,
+                mediaMetadata,
             };
         }
         if (fileType === 'image') {
@@ -68,6 +111,7 @@ const getAssetMetadata = async (canvasContent, addTime) => {
                         size,
                         dimensions: { width: img.width, height: img.height },
                         fetchedAt,
+                        mediaMetadata: null,
                     });
                 };
                 img.onerror = () => {
@@ -82,6 +126,7 @@ const getAssetMetadata = async (canvasContent, addTime) => {
             dimensions: 'none',
             size,
             fetchedAt,
+            mediaMetadata: null,
         };
     }
     catch (err) {

package/dist/helpers/get-connected-compositions.d.ts

@@ -1,6 +1 @@
-export declare const getConnectedCompositions: <Composition extends {
-    readonly componentFromProps?: unknown;
-}>({ compositions, singleChildComponent, }: {
-    readonly compositions: readonly Composition[];
-    readonly singleChildComponent: unknown;
-}) => Composition[];
+export { getConnectedCompositions } from '@remotion/canvas';

package/dist/helpers/get-connected-compositions.js

@@ -1,11 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getConnectedCompositions = void 0;
-const getConnectedCompositions = ({ compositions, singleChildComponent, }) => {
-    if (singleChildComponent === null ||
-        typeof singleChildComponent === 'undefined') {
-        return [];
-    }
-    return compositions.filter((composition) => composition.componentFromProps === singleChildComponent);
-};
-exports.getConnectedCompositions = getConnectedCompositions;
+const canvas_1 = require("@remotion/canvas");
+Object.defineProperty(exports, "getConnectedCompositions", { enumerable: true, get: function () { return canvas_1.getConnectedCompositions; } });

package/dist/helpers/get-sequence-visible-range.d.ts

@@ -1,5 +1 @@
-import type { TSequence } from 'remotion';
-export declare const getCascadedStart: (sequence: TSequence, sequences: TSequence[]) => number;
-export declare const getCascadedStartWithTrim: (sequence: TSequence, sequences: TSequence[]) => number;
-export declare const getTimelineVisibleStart: (sequence: TSequence, sequences: TSequence[]) => number;
-export declare const getTimelineVisibleDuration: (sequence: TSequence, sequences: TSequence[]) => number;
+export { getCascadedStart, getCascadedStartWithTrim, getTimelineVisibleDuration, getTimelineVisibleStart, } from '@remotion/canvas';

package/dist/helpers/get-sequence-visible-range.js

@@ -1,53 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getTimelineVisibleDuration = exports.getTimelineVisibleStart = exports.getCascadedStartWithTrim = exports.getCascadedStart = void 0;
-const getCascadedStart = (sequence, sequences) => {
-    if (!sequence.parent) {
-        return sequence.from;
-    }
-    const parent = sequences.find((s) => s.id === sequence.parent);
-    if (!parent) {
-        throw new TypeError('Parent not found for sequence ' + sequence.id);
-    }
-    return (0, exports.getCascadedStart)(parent, sequences) + sequence.from;
-};
-exports.getCascadedStart = getCascadedStart;
-const getCascadedStartWithTrim = (sequence, sequences) => {
-    const effectiveFrom = sequence.trimBefore === null
-        ? sequence.from
-        : sequence.from - sequence.trimBefore;
-    if (!sequence.parent) {
-        return effectiveFrom;
-    }
-    const parent = sequences.find((s) => s.id === sequence.parent);
-    if (!parent) {
-        throw new TypeError('Parent not found for sequence ' + sequence.id);
-    }
-    return (0, exports.getCascadedStartWithTrim)(parent, sequences) + effectiveFrom;
-};
-exports.getCascadedStartWithTrim = getCascadedStartWithTrim;
-const getTimelineVisibleStart = (sequence, sequences) => {
-    const cascadedStart = Math.max(0, (0, exports.getCascadedStart)(sequence, sequences));
-    if (!sequence.parent) {
-        return cascadedStart;
-    }
-    const parent = sequences.find((s) => s.id === sequence.parent);
-    if (!parent) {
-        throw new TypeError('Parent not found for sequence ' + sequence.id);
-    }
-    const timelineVisibleStart = (0, exports.getTimelineVisibleStart)(parent, sequences);
-    return Math.max(timelineVisibleStart, cascadedStart);
-};
-exports.getTimelineVisibleStart = getTimelineVisibleStart;
-const getTimelineVisibleDuration = (sequence, sequences) => {
-    const visibleDuration = sequence.duration + Math.min(sequence.from, 0);
-    if (!sequence.parent) {
-        return visibleDuration;
-    }
-    const parent = sequences.find((s) => s.id === sequence.parent);
-    if (!parent) {
-        throw new TypeError('Parent not found for sequence ' + sequence.id);
-    }
-    return Math.min(visibleDuration, (0, exports.getTimelineVisibleDuration)(parent, sequences));
-};
-exports.getTimelineVisibleDuration = getTimelineVisibleDuration;
+exports.getTimelineVisibleStart = exports.getTimelineVisibleDuration = exports.getCascadedStartWithTrim = exports.getCascadedStart = void 0;
+const canvas_1 = require("@remotion/canvas");
+Object.defineProperty(exports, "getCascadedStart", { enumerable: true, get: function () { return canvas_1.getCascadedStart; } });
+Object.defineProperty(exports, "getCascadedStartWithTrim", { enumerable: true, get: function () { return canvas_1.getCascadedStartWithTrim; } });
+Object.defineProperty(exports, "getTimelineVisibleDuration", { enumerable: true, get: function () { return canvas_1.getTimelineVisibleDuration; } });
+Object.defineProperty(exports, "getTimelineVisibleStart", { enumerable: true, get: function () { return canvas_1.getTimelineVisibleStart; } });

package/dist/helpers/get-timeline-max-zoom.d.ts

@@ -11,10 +11,18 @@ export declare const clampTimelineZoom: ({ zoom, durationInFrames, }: {
     zoom: number;
     durationInFrames: number;
 }) => number;
+export declare const timelineZoomToNormalized: ({ zoom, maxZoom, }: {
+    zoom: number;
+    maxZoom: number;
+}) => number;
 export declare const timelineZoomToSliderValue: ({ zoom, maxZoom, }: {
     zoom: number;
     maxZoom: number;
 }) => number;
+export declare const normalizedToTimelineZoom: ({ normalized, maxZoom, }: {
+    normalized: number;
+    maxZoom: number;
+}) => number;
 export declare const sliderValueToTimelineZoom: ({ sliderValue, maxZoom, }: {
     sliderValue: number;
     maxZoom: number;

package/dist/helpers/get-timeline-max-zoom.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TIMELINE_ZOOM_SLIDER_PROPS = exports.sliderValueToTimelineZoom = exports.timelineZoomToSliderValue = exports.clampTimelineZoom = exports.getTimelineMaxZoom = exports.TIMELINE_FRAMES_VISIBLE_AT_MAX_ZOOM = exports.TIMELINE_MAX_ZOOM_FLOOR = exports.TIMELINE_MIN_ZOOM = void 0;
+exports.TIMELINE_ZOOM_SLIDER_PROPS = exports.sliderValueToTimelineZoom = exports.normalizedToTimelineZoom = exports.timelineZoomToSliderValue = exports.timelineZoomToNormalized = exports.clampTimelineZoom = exports.getTimelineMaxZoom = exports.TIMELINE_FRAMES_VISIBLE_AT_MAX_ZOOM = exports.TIMELINE_MAX_ZOOM_FLOOR = exports.TIMELINE_MIN_ZOOM = void 0;
 exports.TIMELINE_MIN_ZOOM = 1;
 exports.TIMELINE_MAX_ZOOM_FLOOR = 5;
 /**
@@ -20,23 +20,34 @@ const clampTimelineZoom = ({ zoom, durationInFrames, }) => {
     return Math.round(clamped * 10) / 10;
 };
 exports.clampTimelineZoom = clampTimelineZoom;
-const timelineZoomToSliderValue = ({ zoom, maxZoom, }) => {
+const timelineZoomToNormalized = ({ zoom, maxZoom, }) => {
     if (maxZoom <= exports.TIMELINE_MIN_ZOOM) {
         return 0;
     }
     const clampedZoom = Math.min(maxZoom, Math.max(exports.TIMELINE_MIN_ZOOM, zoom));
-    const t = Math.log(clampedZoom / exports.TIMELINE_MIN_ZOOM) /
+    const normalized = Math.log(clampedZoom / exports.TIMELINE_MIN_ZOOM) /
         Math.log(maxZoom / exports.TIMELINE_MIN_ZOOM);
-    return Math.round(t * TIMELINE_ZOOM_SLIDER_MAX);
+    return (Math.round(normalized * TIMELINE_ZOOM_SLIDER_MAX) / TIMELINE_ZOOM_SLIDER_MAX);
+};
+exports.timelineZoomToNormalized = timelineZoomToNormalized;
+const timelineZoomToSliderValue = ({ zoom, maxZoom, }) => {
+    return Math.round((0, exports.timelineZoomToNormalized)({ zoom, maxZoom }) * TIMELINE_ZOOM_SLIDER_MAX);
 };
 exports.timelineZoomToSliderValue = timelineZoomToSliderValue;
-const sliderValueToTimelineZoom = ({ sliderValue, maxZoom, }) => {
+const normalizedToTimelineZoom = ({ normalized, maxZoom, }) => {
     if (maxZoom <= exports.TIMELINE_MIN_ZOOM) {
         return exports.TIMELINE_MIN_ZOOM;
     }
-    const t = sliderValue / TIMELINE_ZOOM_SLIDER_MAX;
+    const t = Math.min(1, Math.max(0, normalized));
     return exports.TIMELINE_MIN_ZOOM * (maxZoom / exports.TIMELINE_MIN_ZOOM) ** t;
 };
+exports.normalizedToTimelineZoom = normalizedToTimelineZoom;
+const sliderValueToTimelineZoom = ({ sliderValue, maxZoom, }) => {
+    return (0, exports.normalizedToTimelineZoom)({
+        normalized: sliderValue / TIMELINE_ZOOM_SLIDER_MAX,
+        maxZoom,
+    });
+};
 exports.sliderValueToTimelineZoom = sliderValueToTimelineZoom;
 exports.TIMELINE_ZOOM_SLIDER_PROPS = {
     min: 0,

package/dist/helpers/get-timeline-nestedness.d.ts

@@ -1,2 +1 @@
-import type { TSequence } from 'remotion';
-export declare const getTimelineNestedLevel: (sequence: TSequence, allSequences: TSequence[], depth: number) => number;
+export { getTimelineNestedLevel } from '@remotion/canvas';

package/dist/helpers/get-timeline-nestedness.js

@@ -1,15 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getTimelineNestedLevel = void 0;
-const getTimelineNestedLevel = (sequence, allSequences, depth) => {
-    if (!sequence.parent) {
-        return depth;
-    }
-    const parentSequence = allSequences.find((s) => s.id === sequence.parent);
-    if (!parentSequence) {
-        throw new Error('has parentId but no parent');
-    }
-    const parentContributes = parentSequence.showInTimeline;
-    return (0, exports.getTimelineNestedLevel)(parentSequence, allSequences, parentContributes ? depth + 1 : depth);
-};
-exports.getTimelineNestedLevel = getTimelineNestedLevel;
+const canvas_1 = require("@remotion/canvas");
+Object.defineProperty(exports, "getTimelineNestedLevel", { enumerable: true, get: function () { return canvas_1.getTimelineNestedLevel; } });

package/dist/helpers/get-timeline-sequence-sort-key.d.ts

@@ -1,22 +1,2 @@
-import type { _InternalTypes, SequencePropsSubscriptionKey, TSequence } from 'remotion';
-export type SequenceNodePathInfo = {
-    sequenceSubscriptionKey: SequencePropsSubscriptionKey;
-    auxiliaryKeys: string[];
-    index: number;
-    numberOfSequencesWithThisNodePath: number;
-    supportsEffects: boolean;
-};
-export type TimelineTrackData = {
-    sequence: TSequence;
-    connectedCompositions?: readonly _InternalTypes['AnyComposition'][];
-    depth: number;
-    nodePathInfo: SequenceNodePathInfo | null;
-    keyframeDisplayOffset: number;
-    sequenceFrameOffset: number;
-    cascadedStart: number;
-    localStart: number;
-};
-export type TimelineTrackWithOriginalTimings = TimelineTrackData & {
-    cascadedDuration: number;
-};
-export declare const getTimelineSequenceSortKey: (track: TimelineTrackData, tracks: TimelineTrackData[], nonceRanks: Map<string, number>) => string;
+export { getTimelineSequenceSortKey } from '@remotion/canvas';
+export type { SequenceNodePathInfo, TimelineTrackData, TimelineTrackWithOriginalTimings, } from '@remotion/canvas';