@remotion/studio 4.0.431 → 4.0.432

package/dist/esm/renderEntry.mjs

@@ -166,6 +166,7 @@ var renderContent = (Root) => {
         numberOfAudioTags: 0,
         nonceContextSeed: 0,
         audioLatencyHint: window.remotion_audioLatencyHint ?? "interactive",
+        visualModeEnabled: false,
         children: /* @__PURE__ */ jsxs(Internals.RenderAssetManagerProvider, {
           collectAssets: null,
           children: [
@@ -193,6 +194,7 @@ var renderContent = (Root) => {
         numberOfAudioTags: 0,
         audioLatencyHint: window.remotion_audioLatencyHint ?? "interactive",
         nonceContextSeed: 0,
+        visualModeEnabled: false,
         children: /* @__PURE__ */ jsx(Internals.RenderAssetManagerProvider, {
           collectAssets: null,
           children: /* @__PURE__ */ jsx(Root, {})
@@ -208,13 +210,14 @@ var renderContent = (Root) => {
     renderToDOM(/* @__PURE__ */ jsx("div", {
       children: /* @__PURE__ */ jsx(DelayedSpinner, {})
     }));
-    import("./chunk-3msfwcwh.js").then(({ StudioInternals }) => {
+    import("./chunk-t28xqw5n.js").then(({ StudioInternals }) => {
       window.remotion_isStudio = true;
       window.remotion_isReadOnlyStudio = true;
       window.remotion_inputProps = "{}";
       renderToDOM(/* @__PURE__ */ jsx(StudioInternals.Studio, {
         readOnly: true,
-        rootComponent: Root
+        rootComponent: Root,
+        visualModeEnabled: false
       }));
     }).catch((err) => {
       renderToDOM(/* @__PURE__ */ jsxs("div", {

package/dist/helpers/get-timeline-sequence-layout.js

@@ -13,10 +13,10 @@ const getWidthOfTrack = ({ durationInFrames, lastFrame, windowWidth, spatialDura
 const getTimelineSequenceLayout = ({ durationInFrames, startFrom, maxMediaDuration, startFromMedia, video, windowWidth, premountDisplay, postmountDisplay, }) => {
     var _a;
     const maxMediaSequenceDuration = (maxMediaDuration !== null && maxMediaDuration !== void 0 ? maxMediaDuration : Infinity) - startFromMedia;
-    const lastFrame = (_a = video.durationInFrames) !== null && _a !== void 0 ? _a : 1;
-    const spatialDuration = Math.min(maxMediaSequenceDuration, durationInFrames, lastFrame - startFrom);
+    const lastFrame = ((_a = video.durationInFrames) !== null && _a !== void 0 ? _a : 1) - 1;
+    const spatialDuration = Math.min(maxMediaSequenceDuration, durationInFrames - 1, lastFrame - startFrom);
     // Unclipped spatial duration: without the lastFrame - startFrom constraint
-    const naturalSpatialDuration = Math.min(maxMediaSequenceDuration, durationInFrames);
+    const naturalSpatialDuration = Math.min(maxMediaSequenceDuration, durationInFrames - 1);
     const marginLeft = lastFrame === 0
         ? 0
         : (startFrom / lastFrame) * (windowWidth - timeline_layout_1.TIMELINE_PADDING * 2);

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

@@ -3,8 +3,8 @@ export declare const TIMELINE_PADDING = 16;
 export declare const TIMELINE_BORDER = 1;
 export declare const TIMELINE_ITEM_BORDER_BOTTOM = 1;
 export declare const TIMELINE_TRACK_EXPANDED_HEIGHT = 100;
-export declare const SCHEMA_FIELD_ROW_HEIGHT = 26;
-export declare const UNSUPPORTED_FIELD_ROW_HEIGHT = 26;
+export declare const SCHEMA_FIELD_ROW_HEIGHT = 22;
+export declare const UNSUPPORTED_FIELD_ROW_HEIGHT = 22;
 export type SchemaFieldInfo = {
     key: string;
     description: string | undefined;

package/dist/helpers/timeline-layout.js

@@ -5,8 +5,8 @@ exports.TIMELINE_PADDING = 16;
 exports.TIMELINE_BORDER = 1;
 exports.TIMELINE_ITEM_BORDER_BOTTOM = 1;
 exports.TIMELINE_TRACK_EXPANDED_HEIGHT = 100;
-exports.SCHEMA_FIELD_ROW_HEIGHT = 26;
-exports.UNSUPPORTED_FIELD_ROW_HEIGHT = 26;
+exports.SCHEMA_FIELD_ROW_HEIGHT = 22;
+exports.UNSUPPORTED_FIELD_ROW_HEIGHT = 22;
 const SUPPORTED_SCHEMA_TYPES = new Set(['number', 'boolean']);
 const getSchemaFields = (controls) => {
     if (!controls) {

package/dist/internals.d.ts

@@ -2,5 +2,6 @@ export declare const StudioInternals: {
     Studio: import("react").FC<{
         readonly rootComponent: import("react").FC<{}>;
         readonly readOnly: boolean;
+        readonly visualModeEnabled: boolean;
     }>;
 };

package/dist/previewEntry.js

@@ -44,5 +44,5 @@ const renderToDOM = (content) => {
 };
 renderToDOM(jsx_runtime_1.jsx(NoRegisterRoot_1.NoRegisterRoot, {}));
 remotion_1.Internals.waitForRoot((NewRoot) => {
-    renderToDOM(jsx_runtime_1.jsx(Studio_1.Studio, { readOnly: false, rootComponent: NewRoot }));
+    renderToDOM(jsx_runtime_1.jsx(Studio_1.Studio, { readOnly: false, rootComponent: NewRoot, visualModeEnabled: Boolean(process.env.EXPERIMENTAL_VISUAL_MODE_ENABLED) }));
 });

package/dist/renderEntry.js

@@ -185,13 +185,13 @@ const renderContent = (Root) => {
                 defaultVideoImageFormat: bundleMode.compositionDefaultVideoImageFormat,
                 defaultPixelFormat: bundleMode.compositionDefaultPixelFormat,
                 defaultProResProfile: bundleMode.compositionDefaultProResProfile,
-            }, initialCompositions: [], children: jsx_runtime_1.jsx(remotion_1.Internals.RemotionRootContexts, { frameState: null, audioEnabled: window.remotion_audioEnabled, videoEnabled: window.remotion_videoEnabled, logLevel: window.remotion_logLevel, numberOfAudioTags: 0, nonceContextSeed: 0, audioLatencyHint: (_a = window.remotion_audioLatencyHint) !== null && _a !== void 0 ? _a : 'interactive', children: jsx_runtime_1.jsxs(remotion_1.Internals.RenderAssetManagerProvider, { collectAssets: null, children: [
+            }, initialCompositions: [], children: jsx_runtime_1.jsx(remotion_1.Internals.RemotionRootContexts, { frameState: null, audioEnabled: window.remotion_audioEnabled, videoEnabled: window.remotion_videoEnabled, logLevel: window.remotion_logLevel, numberOfAudioTags: 0, nonceContextSeed: 0, audioLatencyHint: (_a = window.remotion_audioLatencyHint) !== null && _a !== void 0 ? _a : 'interactive', visualModeEnabled: false, children: jsx_runtime_1.jsxs(remotion_1.Internals.RenderAssetManagerProvider, { collectAssets: null, children: [
                         jsx_runtime_1.jsx(Root, {}), jsx_runtime_1.jsx(GetVideoComposition, { state: bundleMode })
                     ] }) }) }));
         renderToDOM(markup);
     }
     if (bundleMode.type === 'evaluation') {
-        const markup = (jsx_runtime_1.jsx(remotion_1.Internals.CompositionManagerProvider, { initialCanvasContent: null, onlyRenderComposition: null, currentCompositionMetadata: null, initialCompositions: [], children: jsx_runtime_1.jsx(remotion_1.Internals.RemotionRootContexts, { frameState: null, audioEnabled: window.remotion_audioEnabled, videoEnabled: window.remotion_videoEnabled, logLevel: window.remotion_logLevel, numberOfAudioTags: 0, audioLatencyHint: (_b = window.remotion_audioLatencyHint) !== null && _b !== void 0 ? _b : 'interactive', nonceContextSeed: 0, children: jsx_runtime_1.jsx(remotion_1.Internals.RenderAssetManagerProvider, { collectAssets: null, children: jsx_runtime_1.jsx(Root, {}) }) }) }));
+        const markup = (jsx_runtime_1.jsx(remotion_1.Internals.CompositionManagerProvider, { initialCanvasContent: null, onlyRenderComposition: null, currentCompositionMetadata: null, initialCompositions: [], children: jsx_runtime_1.jsx(remotion_1.Internals.RemotionRootContexts, { frameState: null, audioEnabled: window.remotion_audioEnabled, videoEnabled: window.remotion_videoEnabled, logLevel: window.remotion_logLevel, numberOfAudioTags: 0, audioLatencyHint: (_b = window.remotion_audioLatencyHint) !== null && _b !== void 0 ? _b : 'interactive', nonceContextSeed: 0, visualModeEnabled: false, children: jsx_runtime_1.jsx(remotion_1.Internals.RenderAssetManagerProvider, { collectAssets: null, children: jsx_runtime_1.jsx(Root, {}) }) }) }));
         renderToDOM(markup);
     }
     if (bundleMode.type === 'index') {
@@ -203,7 +203,7 @@ const renderContent = (Root) => {
             window.remotion_isStudio = true;
             window.remotion_isReadOnlyStudio = true;
             window.remotion_inputProps = '{}';
-            renderToDOM(jsx_runtime_1.jsx(StudioInternals.Studio, { readOnly: true, rootComponent: Root }));
+            renderToDOM(jsx_runtime_1.jsx(StudioInternals.Studio, { readOnly: true, rootComponent: Root, visualModeEnabled: false }));
         })
             .catch((err) => {
             renderToDOM(jsx_runtime_1.jsxs("div", { children: ["Failed to load Remotion Studio: ", err.message] }));

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/studio"
 	},
 	"name": "@remotion/studio",
-	"version": "4.0.431",
+	"version": "4.0.432",
 	"description": "APIs for interacting with the Remotion Studio",
 	"main": "dist",
 	"sideEffects": false,
@@ -26,13 +26,13 @@
 	},
 	"dependencies": {
 		"semver": "7.5.3",
-		"remotion": "4.0.431",
-		"@remotion/player": "4.0.431",
-		"@remotion/media-utils": "4.0.431",
-		"@remotion/renderer": "4.0.431",
-		"@remotion/web-renderer": "4.0.431",
-		"@remotion/studio-shared": "4.0.431",
-		"@remotion/zod-types": "4.0.431",
+		"remotion": "4.0.432",
+		"@remotion/player": "4.0.432",
+		"@remotion/media-utils": "4.0.432",
+		"@remotion/renderer": "4.0.432",
+		"@remotion/web-renderer": "4.0.432",
+		"@remotion/studio-shared": "4.0.432",
+		"@remotion/zod-types": "4.0.432",
 		"mediabunny": "1.35.1",
 		"memfs": "3.4.3",
 		"source-map": "0.7.3",
@@ -43,9 +43,9 @@
 		"react": "19.2.3",
 		"react-dom": "19.2.3",
 		"@types/semver": "^7.3.4",
-		"@remotion/eslint-config-internal": "4.0.431",
+		"@remotion/eslint-config-internal": "4.0.432",
 		"eslint": "9.19.0",
-		"@typescript/native-preview": "7.0.0-dev.20260217.1"
+		"@typescript/native-preview": "7.0.0-dev.20260301.1"
 	},
 	"publishConfig": {
 		"access": "public"