@remotion/studio 4.0.496 → 4.0.497
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AudioWaveform.js +1 -11
- package/dist/components/Canvas.js +22 -203
- package/dist/components/CompositionSelectorItem.js +2 -10
- package/dist/components/InspectorPanel/AlignmentControls.js +2 -0
- package/dist/components/InspectorPanel/ConnectedCompositionsSection.js +27 -2
- package/dist/components/InspectorPanel/SequenceSelectionInspector.js +65 -8
- package/dist/components/InspectorPanel/use-composition-actions.js +6 -2
- package/dist/components/NewComposition/CodemodFooter.d.ts +1 -1
- package/dist/components/NewComposition/CodemodFooter.js +23 -4
- package/dist/components/NewComposition/InputDragger.d.ts +6 -0
- package/dist/components/NewComposition/InputDragger.js +12 -3
- package/dist/components/NewComposition/NewComposition.js +1 -1
- package/dist/components/NewComposition/use-rename-static-file.js +1 -1
- package/dist/components/SelectedOutlineElement.js +56 -88
- package/dist/components/SelectedOutlineOverlay.d.ts +1 -1
- package/dist/components/SelectedOutlineOverlay.js +9 -10
- package/dist/components/Timeline/Timeline.js +10 -3
- package/dist/components/Timeline/TimelineAssetDropIndicator.d.ts +2 -0
- package/dist/components/Timeline/TimelineAssetDropIndicator.js +37 -0
- package/dist/components/Timeline/TimelineClipboardKeybindings.js +1 -7
- package/dist/components/Timeline/TimelineScrollable.js +3 -2
- package/dist/components/Timeline/TimelineSelection.d.ts +4 -0
- package/dist/components/Timeline/TimelineSelection.js +40 -5
- package/dist/components/Timeline/TimelineSequence.js +20 -8
- package/dist/components/Timeline/TimelineSequenceFrame.js +2 -4
- package/dist/components/Timeline/TimelineSequenceItem.js +2 -0
- package/dist/components/Timeline/TimelineSequencePropItem.js +4 -0
- package/dist/components/Timeline/TimelineSequenceRightEdgeDragHandle.d.ts +15 -3
- package/dist/components/Timeline/TimelineSequenceRightEdgeDragHandle.js +96 -18
- package/dist/components/Timeline/TimelineTimeIndicators.d.ts +16 -0
- package/dist/components/Timeline/TimelineTimeIndicators.js +154 -35
- package/dist/components/Timeline/TimelineTranslateField.js +2 -1
- package/dist/components/Timeline/TimelineVideoInfo.d.ts +1 -0
- package/dist/components/Timeline/TimelineVideoInfo.js +4 -1
- package/dist/components/Timeline/delete-selected-timeline-item.d.ts +2 -0
- package/dist/components/Timeline/delete-selected-timeline-item.js +5 -4
- package/dist/components/Timeline/disable-sequence-interactivity.js +2 -0
- package/dist/components/Timeline/get-timeline-media-visualization-layout.d.ts +8 -0
- package/dist/components/Timeline/get-timeline-media-visualization-layout.js +10 -0
- package/dist/components/Timeline/get-timeline-video-info-widths.js +11 -3
- package/dist/components/Timeline/keyframe-clipboard.js +21 -5
- package/dist/components/Timeline/reset-selected-timeline-props.js +2 -0
- package/dist/components/Timeline/save-sequence-prop.d.ts +5 -3
- package/dist/components/Timeline/save-sequence-prop.js +43 -18
- package/dist/components/Timeline/should-clear-selection-on-pointer-down.d.ts +2 -0
- package/dist/components/Timeline/should-clear-selection-on-pointer-down.js +1 -1
- package/dist/components/Timeline/timeline-asset-drop-context.d.ts +1 -0
- package/dist/components/Timeline/timeline-asset-drop-context.js +5 -0
- package/dist/components/Timeline/timeline-scroll-logic.d.ts +7 -0
- package/dist/components/Timeline/timeline-scroll-logic.js +10 -1
- package/dist/components/Timeline/use-rename-sequence.js +2 -0
- package/dist/components/Timeline/use-sequence-freeze-frame-menu-item.js +2 -0
- package/dist/components/Timeline/use-timeline-asset-drop.d.ts +1 -0
- package/dist/components/Timeline/use-timeline-asset-drop.js +168 -0
- package/dist/components/composition-menu-items.d.ts +15 -1
- package/dist/components/composition-menu-items.js +137 -107
- package/dist/components/drop-handler-data.d.ts +13 -0
- package/dist/components/drop-handler-data.js +117 -0
- package/dist/components/handle-drop.d.ts +13 -0
- package/dist/components/handle-drop.js +115 -0
- package/dist/components/import-assets.d.ts +26 -8
- package/dist/components/import-assets.js +161 -49
- package/dist/components/selected-outline-drag.d.ts +11 -1
- package/dist/components/selected-outline-drag.js +74 -1
- package/dist/esm/{chunk-0v4n7nkh.js → chunk-5wj95bdd.js} +4262 -3392
- package/dist/esm/internals.mjs +4262 -3392
- package/dist/esm/previewEntry.mjs +4464 -3594
- package/dist/esm/renderEntry.mjs +1 -1
- package/dist/helpers/is-video-with-last-frame-hold.d.ts +2 -0
- package/dist/helpers/is-video-with-last-frame-hold.js +9 -0
- package/dist/helpers/url-state.d.ts +1 -0
- package/dist/helpers/url-state.js +5 -1
- package/dist/helpers/use-max-media-duration.js +5 -3
- package/dist/helpers/use-menu-structure.js +2 -0
- package/dist/icons/duplicate.d.ts +5 -0
- package/dist/icons/duplicate.js +10 -0
- package/dist/icons/snowflake.d.ts +5 -0
- package/dist/icons/snowflake.js +10 -0
- package/dist/icons/trash.d.ts +5 -0
- package/dist/icons/trash.js +8 -0
- package/package.json +11 -11
package/dist/esm/renderEntry.mjs
CHANGED
|
@@ -212,7 +212,7 @@ var renderContent = (Root) => {
|
|
|
212
212
|
renderToDOM(/* @__PURE__ */ jsx("div", {
|
|
213
213
|
children: /* @__PURE__ */ jsx(DelayedSpinner, {})
|
|
214
214
|
}));
|
|
215
|
-
import("./chunk-
|
|
215
|
+
import("./chunk-5wj95bdd.js").then(({ StudioInternals }) => {
|
|
216
216
|
window.remotion_isStudio = true;
|
|
217
217
|
window.remotion_isReadOnlyStudio = true;
|
|
218
218
|
window.remotion_inputProps = "{}";
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.isVideoWithLastFrameHold = void 0;
|
|
4
|
+
const isVideoWithLastFrameHold = (sequence) => {
|
|
5
|
+
var _a;
|
|
6
|
+
return (sequence.type === 'video' &&
|
|
7
|
+
((_a = sequence.controls) === null || _a === void 0 ? void 0 : _a.componentIdentity) === 'dev.remotion.media.Video');
|
|
8
|
+
};
|
|
9
|
+
exports.isVideoWithLastFrameHold = isVideoWithLastFrameHold;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export declare const getUrlForRoute: (route: string) => string;
|
|
2
2
|
export declare const pushUrl: (url: string) => void;
|
|
3
|
+
export declare const replaceUrl: (url: string) => void;
|
|
3
4
|
export declare const clearUrl: () => void;
|
|
4
5
|
export declare const reloadUrl: () => void;
|
|
5
6
|
export declare const getRoute: () => string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.getRoute = exports.reloadUrl = exports.clearUrl = exports.pushUrl = exports.getUrlForRoute = void 0;
|
|
3
|
+
exports.getRoute = exports.reloadUrl = exports.clearUrl = exports.replaceUrl = exports.pushUrl = exports.getUrlForRoute = void 0;
|
|
4
4
|
const getUrlHandlingType = () => {
|
|
5
5
|
if (window.remotion_isReadOnlyStudio) {
|
|
6
6
|
return 'query-string';
|
|
@@ -18,6 +18,10 @@ const pushUrl = (url) => {
|
|
|
18
18
|
window.history.pushState({}, 'Studio', (0, exports.getUrlForRoute)(url));
|
|
19
19
|
};
|
|
20
20
|
exports.pushUrl = pushUrl;
|
|
21
|
+
const replaceUrl = (url) => {
|
|
22
|
+
window.history.replaceState({}, 'Studio', (0, exports.getUrlForRoute)(url));
|
|
23
|
+
};
|
|
24
|
+
exports.replaceUrl = replaceUrl;
|
|
21
25
|
const clearUrl = () => {
|
|
22
26
|
window.location.href = window.location.pathname;
|
|
23
27
|
};
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useMaxMediaDuration = void 0;
|
|
4
4
|
const react_1 = require("react");
|
|
5
|
+
const is_video_with_last_frame_hold_1 = require("./is-video-with-last-frame-hold");
|
|
5
6
|
const use_media_metadata_1 = require("./use-media-metadata");
|
|
6
7
|
const cache = new Map();
|
|
7
8
|
const getCacheKey = (src, fps) => JSON.stringify([src, fps]);
|
|
@@ -16,7 +17,8 @@ const getSrc = (s) => {
|
|
|
16
17
|
};
|
|
17
18
|
const useMaxMediaDuration = (s, fps) => {
|
|
18
19
|
var _a;
|
|
19
|
-
const
|
|
20
|
+
const holdsLastFrame = (0, is_video_with_last_frame_hold_1.isVideoWithLastFrameHold)(s);
|
|
21
|
+
const src = holdsLastFrame ? null : getSrc(s);
|
|
20
22
|
const cacheKey = src ? getCacheKey(src, fps) : null;
|
|
21
23
|
const [maxMediaDuration, setMaxMediaDuration] = (0, react_1.useState)(cacheKey ? ((_a = cache.get(cacheKey)) !== null && _a !== void 0 ? _a : null) : Infinity);
|
|
22
24
|
(0, react_1.useEffect)(() => {
|
|
@@ -49,8 +51,8 @@ const useMaxMediaDuration = (s, fps) => {
|
|
|
49
51
|
cancelled = true;
|
|
50
52
|
};
|
|
51
53
|
}, [cacheKey, fps, src]);
|
|
52
|
-
if (
|
|
53
|
-
return
|
|
54
|
+
if (holdsLastFrame) {
|
|
55
|
+
return Infinity;
|
|
54
56
|
}
|
|
55
57
|
return maxMediaDuration;
|
|
56
58
|
};
|
|
@@ -671,6 +671,8 @@ const useMenuStructure = (closeMenu, readOnlyStudio) => {
|
|
|
671
671
|
closeMenu,
|
|
672
672
|
composition: currentComposition,
|
|
673
673
|
connectionStatus: type,
|
|
674
|
+
includeCompositionManagementItems: true,
|
|
675
|
+
includeNewCompositionItem: true,
|
|
674
676
|
resolvedLocation: resolvedCompositionLocation,
|
|
675
677
|
setSelectedModal,
|
|
676
678
|
readOnlyStudio,
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.DuplicateIcon = void 0;
|
|
4
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
// Font Awesome Pro v7.3.1, Copyright 2026 Fonticons, Inc.
|
|
6
|
+
// https://fontawesome.com/license (Commercial License)
|
|
7
|
+
const DuplicateIcon = ({ color, ...props }) => {
|
|
8
|
+
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" }) }));
|
|
9
|
+
};
|
|
10
|
+
exports.DuplicateIcon = DuplicateIcon;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.SnowflakeIcon = void 0;
|
|
4
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
// Font Awesome Free v7.3.1, Copyright 2026 Fonticons, Inc.
|
|
6
|
+
// https://fontawesome.com/license/free
|
|
7
|
+
const SnowflakeIcon = ({ color, ...props }) => {
|
|
8
|
+
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" }) }));
|
|
9
|
+
};
|
|
10
|
+
exports.SnowflakeIcon = SnowflakeIcon;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.TrashIcon = void 0;
|
|
4
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
const TrashIcon = ({ color, ...props }) => {
|
|
6
|
+
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" }) }));
|
|
7
|
+
};
|
|
8
|
+
exports.TrashIcon = TrashIcon;
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"url": "https://github.com/remotion-dev/remotion/tree/main/packages/studio"
|
|
4
4
|
},
|
|
5
5
|
"name": "@remotion/studio",
|
|
6
|
-
"version": "4.0.
|
|
6
|
+
"version": "4.0.497",
|
|
7
7
|
"description": "APIs for interacting with the Remotion Studio",
|
|
8
8
|
"main": "dist",
|
|
9
9
|
"scripts": {
|
|
@@ -25,15 +25,15 @@
|
|
|
25
25
|
},
|
|
26
26
|
"dependencies": {
|
|
27
27
|
"semver": "7.5.3",
|
|
28
|
-
"remotion": "4.0.
|
|
29
|
-
"@remotion/canvas-capture": "4.0.
|
|
30
|
-
"@remotion/player": "4.0.
|
|
31
|
-
"@remotion/media-utils": "4.0.
|
|
32
|
-
"@remotion/renderer": "4.0.
|
|
33
|
-
"@remotion/web-renderer": "4.0.
|
|
34
|
-
"@remotion/studio-shared": "4.0.
|
|
35
|
-
"@remotion/timeline-utils": "4.0.
|
|
36
|
-
"@remotion/zod-types": "4.0.
|
|
28
|
+
"remotion": "4.0.497",
|
|
29
|
+
"@remotion/canvas-capture": "4.0.497",
|
|
30
|
+
"@remotion/player": "4.0.497",
|
|
31
|
+
"@remotion/media-utils": "4.0.497",
|
|
32
|
+
"@remotion/renderer": "4.0.497",
|
|
33
|
+
"@remotion/web-renderer": "4.0.497",
|
|
34
|
+
"@remotion/studio-shared": "4.0.497",
|
|
35
|
+
"@remotion/timeline-utils": "4.0.497",
|
|
36
|
+
"@remotion/zod-types": "4.0.497",
|
|
37
37
|
"@jridgewell/trace-mapping": "0.3.31",
|
|
38
38
|
"mediabunny": "1.50.8",
|
|
39
39
|
"memfs": "3.4.3",
|
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
"react": "19.2.3",
|
|
45
45
|
"react-dom": "19.2.3",
|
|
46
46
|
"@types/semver": "7.5.3",
|
|
47
|
-
"@remotion/eslint-config-internal": "4.0.
|
|
47
|
+
"@remotion/eslint-config-internal": "4.0.497",
|
|
48
48
|
"eslint": "9.19.0",
|
|
49
49
|
"@typescript/native-preview": "7.0.0-dev.20260217.1"
|
|
50
50
|
},
|