@remotion/studio 4.0.495 → 4.0.497

package/dist/esm/renderEntry.mjs

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

package/dist/helpers/inject-css.js

@@ -89,12 +89,14 @@ const makeDefaultGlobalCSS = () => {
 	    box-shadow: ${colors_1.FOCUS_BOX_SHADOW};
 	  }
 
-  .__remotion-composition-selector-item:focus {
+  .__remotion-composition-selector-item:focus,
+  .__remotion-inspector-inline-action:focus {
     outline: none;
     box-shadow: none;
   }
 
-  .__remotion-composition-selector-item:focus-visible {
+  .__remotion-composition-selector-item:focus-visible,
+  .__remotion-inspector-inline-action:focus-visible {
     box-shadow: ${colors_1.FOCUS_BOX_SHADOW};
   }
 

package/dist/helpers/is-video-with-last-frame-hold.d.ts

@@ -0,0 +1,2 @@
+import type { TSequence } from 'remotion';
+export declare const isVideoWithLastFrameHold: (sequence: TSequence) => boolean;

package/dist/helpers/is-video-with-last-frame-hold.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isVideoWithLastFrameHold = void 0;
+const isVideoWithLastFrameHold = (sequence) => {
+    var _a;
+    return (sequence.type === 'video' &&
+        ((_a = sequence.controls) === null || _a === void 0 ? void 0 : _a.componentIdentity) === 'dev.remotion.media.Video');
+};
+exports.isVideoWithLastFrameHold = isVideoWithLastFrameHold;

package/dist/helpers/url-state.d.ts

@@ -1,5 +1,6 @@
 export declare const getUrlForRoute: (route: string) => string;
 export declare const pushUrl: (url: string) => void;
+export declare const replaceUrl: (url: string) => void;
 export declare const clearUrl: () => void;
 export declare const reloadUrl: () => void;
 export declare const getRoute: () => string;

package/dist/helpers/url-state.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getRoute = exports.reloadUrl = exports.clearUrl = exports.pushUrl = exports.getUrlForRoute = void 0;
+exports.getRoute = exports.reloadUrl = exports.clearUrl = exports.replaceUrl = exports.pushUrl = exports.getUrlForRoute = void 0;
 const getUrlHandlingType = () => {
     if (window.remotion_isReadOnlyStudio) {
         return 'query-string';
@@ -18,6 +18,10 @@ const pushUrl = (url) => {
     window.history.pushState({}, 'Studio', (0, exports.getUrlForRoute)(url));
 };
 exports.pushUrl = pushUrl;
+const replaceUrl = (url) => {
+    window.history.replaceState({}, 'Studio', (0, exports.getUrlForRoute)(url));
+};
+exports.replaceUrl = replaceUrl;
 const clearUrl = () => {
     window.location.href = window.location.pathname;
 };

package/dist/helpers/use-max-media-duration.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useMaxMediaDuration = void 0;
 const react_1 = require("react");
+const is_video_with_last_frame_hold_1 = require("./is-video-with-last-frame-hold");
 const use_media_metadata_1 = require("./use-media-metadata");
 const cache = new Map();
 const getCacheKey = (src, fps) => JSON.stringify([src, fps]);
@@ -16,7 +17,8 @@ const getSrc = (s) => {
 };
 const useMaxMediaDuration = (s, fps) => {
     var _a;
-    const src = getSrc(s);
+    const holdsLastFrame = (0, is_video_with_last_frame_hold_1.isVideoWithLastFrameHold)(s);
+    const src = holdsLastFrame ? null : getSrc(s);
     const cacheKey = src ? getCacheKey(src, fps) : null;
     const [maxMediaDuration, setMaxMediaDuration] = (0, react_1.useState)(cacheKey ? ((_a = cache.get(cacheKey)) !== null && _a !== void 0 ? _a : null) : Infinity);
     (0, react_1.useEffect)(() => {
@@ -49,8 +51,8 @@ const useMaxMediaDuration = (s, fps) => {
             cancelled = true;
         };
     }, [cacheKey, fps, src]);
-    if (maxMediaDuration !== null && (s.type === 'audio' || s.type === 'video')) {
-        return maxMediaDuration;
+    if (holdsLastFrame) {
+        return Infinity;
     }
     return maxMediaDuration;
 };

package/dist/helpers/use-menu-structure.js

@@ -671,6 +671,8 @@ const useMenuStructure = (closeMenu, readOnlyStudio) => {
                     closeMenu,
                     composition: currentComposition,
                     connectionStatus: type,
+                    includeCompositionManagementItems: true,
+                    includeNewCompositionItem: true,
                     resolvedLocation: resolvedCompositionLocation,
                     setSelectedModal,
                     readOnlyStudio,

package/dist/icons/duplicate.d.ts

@@ -0,0 +1,5 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const DuplicateIcon: React.FC<SVGProps<SVGSVGElement> & {
+    readonly color: string;
+}>;

package/dist/icons/duplicate.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DuplicateIcon = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+// Font Awesome Pro v7.3.1, Copyright 2026 Fonticons, Inc.
+// https://fontawesome.com/license (Commercial License)
+const DuplicateIcon = ({ color, ...props }) => {
+    return (jsx_runtime_1.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 640 640", ...props, children: jsx_runtime_1.jsx("path", { fill: color, d: "M352 544L128 544C110.3 544 96 529.7 96 512L96 288C96 270.3 110.3 256 128 256L176 256L176 224L128 224C92.7 224 64 252.7 64 288L64 512C64 547.3 92.7 576 128 576L352 576C387.3 576 416 547.3 416 512L416 464L384 464L384 512C384 529.7 369.7 544 352 544zM288 384C270.3 384 256 369.7 256 352L256 128C256 110.3 270.3 96 288 96L512 96C529.7 96 544 110.3 544 128L544 352C544 369.7 529.7 384 512 384L288 384zM224 352C224 387.3 252.7 416 288 416L512 416C547.3 416 576 387.3 576 352L576 128C576 92.7 547.3 64 512 64L288 64C252.7 64 224 92.7 224 128L224 352z" }) }));
+};
+exports.DuplicateIcon = DuplicateIcon;

package/dist/icons/scissors.js

@@ -3,6 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ScissorsIcon = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const ScissorsIcon = ({ color, ...props }) => {
-    return (jsx_runtime_1.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", ...props, children: jsx_runtime_1.jsx("path", { fill: color, d: "M112 32a80 80 0 1 0 0 160 80 80 0 1 0 0-160zm0-32c61.9 0 112 50.1 112 112 0 12.4-2 24.4-5.8 35.6L256 185.4 383.9 57.5c31-31 81.2-31 112.2 0 12.4 12.4 12.4 32.6 0 45L221.6 377c1.6 7.4 2.4 15.1 2.4 23 0 61.9-50.1 112-112 112S0 461.9 0 400s50.1-112 112-112c12.4 0 24.4 2 35.6 5.8L177.4 264 135 221.6c-7.4 1.6-15.1 2.4-23 2.4-61.9 0-112-50.1-112-112S50.1 0 112 0zm55.8 209.1l32.2 32.2 33.4-33.4-30.5-30.5c-9.3 12.9-21.3 23.7-35.1 31.7zm238.7-129-229 229c12.9 9.3 23.7 21.3 31.7 35.1L473.4 80c-18.5-18.4-48.4-18.3-66.9.1zM192 400a80 80 0 1 0-160 0 80 80 0 1 0 160 0zm206.5 39.9c18.5 18.5 48.4 18.5 66.9.1L346 320.6l22.6-22.6 119.5 119.5c12.4 12.4 12.4 32.6 0 45-31 31-81.2 31-112.2 0L290 376.6l22.6-22.6 85.9 85.9z" }) }));
+    return (jsx_runtime_1.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", ...props, children: jsx_runtime_1.jsx("path", { fill: color, d: "M48 112a64 64 0 1 1 128 0 64 64 0 1 1 -128 0zm176 0C224 50.1 173.9 0 112 0S0 50.1 0 112 50.1 224 112 224c24 0 46.3-7.6 64.5-20.4l57.3 52.4-57.3 52.4C158.3 295.6 136 288 112 288 50.1 288 0 338.1 0 400s50.1 112 112 112 112-50.1 112-112c0-20.5-5.5-39.6-15.1-56.2L504.2 73.7c9.8-8.9 10.5-24.1 1.5-33.9s-24.1-10.5-33.9-1.5l-202.4 185.2-60.5-55.3c9.6-16.5 15.1-35.7 15.1-56.2zM471.8 473.7c9.8 8.9 25 8.3 33.9-1.5s8.3-25-1.5-33.9L338.6 286.8 302.7 319 471.8 473.7zM48 400a64 64 0 1 1 128 0 64 64 0 1 1 -128 0z" }) }));
 };
 exports.ScissorsIcon = ScissorsIcon;

package/dist/icons/snowflake.d.ts

@@ -0,0 +1,5 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const SnowflakeIcon: React.FC<SVGProps<SVGSVGElement> & {
+    readonly color: string;
+}>;

package/dist/icons/snowflake.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SnowflakeIcon = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+// Font Awesome Free v7.3.1, Copyright 2026 Fonticons, Inc.
+// https://fontawesome.com/license/free
+const SnowflakeIcon = ({ color, ...props }) => {
+    return (jsx_runtime_1.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 640 640", ...props, children: jsx_runtime_1.jsx("path", { fill: color, d: "M344.1 56C344.1 42.7 333.4 32 320.1 32C306.8 32 296.1 42.7 296.1 56L296.1 134.1L273.1 111.1C263.7 101.7 248.5 101.7 239.2 111.1C229.9 120.5 229.8 135.7 239.2 145L296.2 202L296.2 278.5L230 240.3L209.1 162.5C205.7 149.7 192.5 142.1 179.7 145.5C166.9 148.9 159.2 162 162.7 174.8L171.1 206.3L103.5 167.3C92 160.6 77.3 164.5 70.7 176C64.1 187.5 68 202.2 79.5 208.8L147.1 247.8L115.6 256.2C102.8 259.6 95.2 272.8 98.6 285.6C102 298.4 115.2 306 128 302.6L205.8 281.7L272 319.9L205.8 358.1L128 337.2C115.2 333.8 102 341.4 98.6 354.2C95.2 367 102.8 380.2 115.6 383.6L147.1 392L79.5 431C68 437.8 64.1 452.5 70.7 464C77.3 475.5 92 479.4 103.5 472.8L171.1 433.8L162.7 465.3C159.3 478.1 166.9 491.3 179.7 494.7C192.5 498.1 205.7 490.5 209.1 477.7L230 399.9L296.2 361.7L296.2 438.2L239.2 495.2C229.8 504.6 229.8 519.8 239.2 529.1C248.6 538.4 263.8 538.5 273.1 529.1L296.1 506.1L296.1 584.2C296.1 597.5 306.8 608.2 320.1 608.2C333.4 608.2 344.1 597.5 344.1 584.2L344.1 506.1L367.1 529.1C376.5 538.5 391.7 538.5 401 529.1C410.3 519.7 410.4 504.5 401 495.2L344 438.2L344 361.7L410.2 399.9L431.1 477.7C434.5 490.5 447.7 498.1 460.5 494.7C473.3 491.3 480.9 478.1 477.5 465.3L469.1 433.8L536.7 472.8C548.2 479.4 562.9 475.5 569.5 464C576.1 452.5 572.2 437.8 560.7 431.2L493.1 392.2L524.6 383.8C537.4 380.4 545 367.2 541.6 354.4C538.2 341.6 525 334 512.2 337.4L434.4 358.3L368.2 320.1L434.4 281.9L512.2 302.8C525 306.2 538.2 298.6 541.6 285.8C545 273 537.4 259.8 524.6 256.4L493.1 248L560.7 209C572.2 202.4 576.1 187.7 569.5 176.2C562.9 164.7 548.2 160.8 536.7 167.4L469.1 206.4L477.5 174.9C480.9 162.1 473.3 148.9 460.5 145.5C447.7 142.1 434.5 149.7 431.1 162.5L410.2 240.3L344 278.5L344 202L401 145C410.4 135.6 410.4 120.4 401 111.1C391.6 101.8 376.4 101.7 367.1 111.1L344.1 134.1L344.1 56z" }) }));
+};
+exports.SnowflakeIcon = SnowflakeIcon;

package/dist/icons/trash.d.ts

@@ -0,0 +1,5 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const TrashIcon: React.FC<SVGProps<SVGSVGElement> & {
+    readonly color: string;
+}>;

package/dist/icons/trash.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TrashIcon = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const TrashIcon = ({ color, ...props }) => {
+    return (jsx_runtime_1.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512", ...props, children: jsx_runtime_1.jsx("path", { fill: color, d: "M160.5 27.4C162.5 20.6 168.8 16 175.8 16h96.4c7.1 0 13.3 4.6 15.3 11.4l11 36.6h-149l11-36.6zM116.1 64H16C7.2 64 0 71.2 0 80s7.2 16 16 16h416c8.8 0 16-7.2 16-16s-7.2-16-16-16H331.9l-13.7-45.8C312.1-2.1 293.4-16 272.2-16h-96.4c-21.2 0-39.9 13.9-46 34.2L116.1 64zM28.7 144l22.9 308.7c2.5 33.4 30.3 59.3 63.8 59.3h217.1c33.5 0 61.3-25.9 63.8-59.3L419.2 144h-32.1l-22.7 306.4c-1.2 16.7-15.2 29.6-31.9 29.6H115.4c-16.8 0-30.7-12.9-31.9-29.6L60.8 144H28.7z" }) }));
+};
+exports.TrashIcon = TrashIcon;

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/studio"
 	},
 	"name": "@remotion/studio",
-	"version": "4.0.495",
+	"version": "4.0.497",
 	"description": "APIs for interacting with the Remotion Studio",
 	"main": "dist",
 	"scripts": {
@@ -25,15 +25,15 @@
 	},
 	"dependencies": {
 		"semver": "7.5.3",
-		"remotion": "4.0.495",
-		"@remotion/canvas-capture": "4.0.495",
-		"@remotion/player": "4.0.495",
-		"@remotion/media-utils": "4.0.495",
-		"@remotion/renderer": "4.0.495",
-		"@remotion/web-renderer": "4.0.495",
-		"@remotion/studio-shared": "4.0.495",
-		"@remotion/timeline-utils": "4.0.495",
-		"@remotion/zod-types": "4.0.495",
+		"remotion": "4.0.497",
+		"@remotion/canvas-capture": "4.0.497",
+		"@remotion/player": "4.0.497",
+		"@remotion/media-utils": "4.0.497",
+		"@remotion/renderer": "4.0.497",
+		"@remotion/web-renderer": "4.0.497",
+		"@remotion/studio-shared": "4.0.497",
+		"@remotion/timeline-utils": "4.0.497",
+		"@remotion/zod-types": "4.0.497",
 		"@jridgewell/trace-mapping": "0.3.31",
 		"mediabunny": "1.50.8",
 		"memfs": "3.4.3",
@@ -44,7 +44,7 @@
 		"react": "19.2.3",
 		"react-dom": "19.2.3",
 		"@types/semver": "7.5.3",
-		"@remotion/eslint-config-internal": "4.0.495",
+		"@remotion/eslint-config-internal": "4.0.497",
 		"eslint": "9.19.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},