@remotion/studio 4.0.525 → 4.0.527
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/api/focus-default-props-path.js +7 -1
- package/dist/api/restart-studio.d.ts +1 -1
- package/dist/api/restart-studio.js +1 -1
- package/dist/components/AgentPrompt.d.ts +6 -0
- package/dist/components/AgentPrompt.js +107 -0
- package/dist/components/AssetFileIcon.js +2 -0
- package/dist/components/AssetSelectorItem.d.ts +1 -23
- package/dist/components/AssetSelectorItem.js +10 -200
- package/dist/components/Canvas.js +109 -44
- package/dist/components/CanvasCaptureDropHandler.js +63 -0
- package/dist/components/CanvasOrLoading.js +10 -2
- package/dist/components/CaptionInspector.js +9 -3
- package/dist/{error-overlay/remotion-overlay → components}/CodeFrame.d.ts +2 -0
- package/dist/components/CodeFrame.js +77 -0
- package/dist/components/CompositionSelectorItem.js +7 -17
- package/dist/components/CurrentAsset.js +6 -4
- package/dist/components/ElementInstallConfirmation.js +69 -38
- package/dist/components/FilePreview.js +4 -0
- package/dist/components/FixComputedValueModal.js +64 -96
- package/dist/components/GenerateWithAgentModal.d.ts +9 -0
- package/dist/components/GenerateWithAgentModal.js +39 -0
- package/dist/components/InitialCompositionLoader.js +1 -1
- package/dist/components/InlineDropdown.js +26 -2
- package/dist/components/InlineEditableTitle.js +3 -0
- package/dist/components/InspectorOpenInEditor.js +8 -4
- package/dist/components/InspectorPanel/CollapsibleInspectorSection.d.ts +7 -0
- package/dist/components/InspectorPanel/CollapsibleInspectorSection.js +14 -0
- package/dist/components/InspectorPanel/CollapsibleInspectorSectionHeader.d.ts +1 -1
- package/dist/components/InspectorPanel/CollapsibleInspectorSectionHeader.js +20 -8
- package/dist/components/InspectorPanel/CompositionInspector.js +32 -15
- package/dist/components/InspectorPanel/CompositionMetadata.js +7 -0
- package/dist/components/InspectorPanel/ConnectedCompositionsSection.js +6 -12
- package/dist/components/InspectorPanel/ElementLibraryButton.js +2 -0
- package/dist/components/InspectorPanel/GuideInspector.js +2 -3
- package/dist/components/InspectorPanel/KeyframeSettings.js +5 -6
- package/dist/components/InspectorPanel/MultiSequenceInspector.js +34 -2
- package/dist/components/InspectorPanel/SequenceSelectionInspector.js +45 -4
- package/dist/components/InspectorPanel/common.d.ts +4 -0
- package/dist/components/InspectorPanel/common.js +15 -2
- package/dist/components/InspectorPanel/styles.d.ts +0 -3
- package/dist/components/InspectorPanel/styles.js +3 -27
- package/dist/components/InspectorPanel/use-composition-actions.d.ts +2 -0
- package/dist/components/InspectorPanel/use-composition-actions.js +16 -0
- package/dist/components/InspectorPanel/use-inspector-section-expanded.d.ts +1 -0
- package/dist/components/InspectorPanel/use-inspector-section-expanded.js +21 -0
- package/dist/components/InspectorSequenceSection.js +44 -35
- package/dist/components/InspectorSourceLocation.js +4 -0
- package/dist/components/KeyboardShortcutsSettings.js +12 -4
- package/dist/components/LutPreview.d.ts +4 -0
- package/dist/components/LutPreview.js +192 -0
- package/dist/components/MenuBuildIndicator.js +1 -0
- package/dist/components/MenuCompositionName.js +4 -9
- package/dist/components/Modals.js +3 -6
- package/dist/components/ModelsSettings.js +15 -4
- package/dist/components/NewComposition/CancelButton.js +1 -1
- package/dist/components/Notifications/NotificationCenter.d.ts +0 -1
- package/dist/components/Notifications/NotificationCenter.js +1 -22
- package/dist/components/Preview.js +3 -0
- package/dist/components/QuickSwitcher/ExplorerQuickSwitcherTrigger.js +1 -0
- package/dist/components/QuickSwitcher/QuickSwitcherContent.js +1 -0
- package/dist/components/QuickSwitcher/QuickSwitcherResult.js +4 -9
- package/dist/components/RadioButton.js +1 -0
- package/dist/components/RenderModal/DataEditor.js +4 -1
- package/dist/components/RenderModal/SchemaEditor/scroll-to-default-props-path.d.ts +1 -0
- package/dist/components/RenderModal/SchemaEditor/scroll-to-default-props-path.js +2 -1
- package/dist/components/RenderModal/WebRenderModal.js +10 -2
- package/dist/components/RenderQueue/CaptionQueueItem.js +5 -2
- package/dist/components/RenderQueue/CaptionQueueProcessor.js +35 -8
- package/dist/components/RenderQueue/VideoMattingQueueItem.js +1 -0
- package/dist/components/RenderQueue/caption-job-types.d.ts +6 -0
- package/dist/components/RenderQueue/index.js +1 -0
- package/dist/components/RendersTab.js +4 -0
- package/dist/components/SelectedOutlineElement.js +6 -0
- package/dist/components/SelectedOutlineSnapIndicators.d.ts +6 -0
- package/dist/components/SelectedOutlineSnapIndicators.js +16 -12
- package/dist/components/SequencePropsSubscriptionProvider.d.ts +3 -0
- package/dist/components/SequencePropsSubscriptionProvider.js +8 -6
- package/dist/components/SettingsButton.js +11 -2
- package/dist/components/SettingsModal.d.ts +1 -2
- package/dist/components/SettingsModal.js +24 -6
- package/dist/components/SettingsModalFooter.js +17 -3
- package/dist/components/SkillsSettings.d.ts +5 -0
- package/dist/components/SkillsSettings.js +29 -26
- package/dist/components/Timeline/Timeline.js +10 -11
- package/dist/components/Timeline/TimelineAssetField.js +81 -51
- package/dist/components/Timeline/TimelineDeleteKeybindings.js +6 -9
- package/dist/components/Timeline/TimelineEffectItem.js +1 -0
- package/dist/components/Timeline/TimelineExpandArrowButton.js +1 -0
- package/dist/components/Timeline/TimelineExpandedRow.js +1 -0
- package/dist/components/Timeline/TimelineFieldLabel.js +1 -0
- package/dist/components/Timeline/TimelineHeightContainer.js +11 -1
- package/dist/components/Timeline/TimelineKeyframeControls.js +16 -1
- package/dist/components/Timeline/TimelineLayerChildren.d.ts +3 -3
- package/dist/components/Timeline/TimelineLayerChildren.js +11 -9
- package/dist/components/Timeline/TimelineLayerEye.d.ts +1 -1
- package/dist/components/Timeline/TimelineLayerEye.js +6 -3
- package/dist/components/Timeline/TimelineList.js +9 -3
- package/dist/components/Timeline/TimelineSchemaField.js +2 -6
- package/dist/components/Timeline/TimelineSelection.d.ts +14 -3
- package/dist/components/Timeline/TimelineSelection.js +91 -49
- package/dist/components/Timeline/TimelineSequence.js +28 -2
- package/dist/components/Timeline/TimelineSequenceFrame.js +1 -0
- package/dist/components/Timeline/TimelineSequenceItem.d.ts +2 -0
- package/dist/components/Timeline/TimelineSequenceItem.js +45 -13
- package/dist/components/Timeline/TimelineViewport.d.ts +1 -0
- package/dist/components/Timeline/TimelineViewport.js +10 -1
- package/dist/components/Timeline/TimelineVirtualization.d.ts +3 -3
- package/dist/components/Timeline/delete-selected-timeline-item.js +2 -2
- package/dist/components/Timeline/get-sequence-context-menu-items.d.ts +6 -2
- package/dist/components/Timeline/get-sequence-context-menu-items.js +143 -46
- package/dist/components/Timeline/normalize-font-weight-for-keyframe.d.ts +1 -0
- package/dist/components/Timeline/normalize-font-weight-for-keyframe.js +19 -0
- package/dist/components/Timeline/split-selected-timeline-item.d.ts +13 -10
- package/dist/components/Timeline/split-selected-timeline-item.js +58 -35
- package/dist/components/Timeline/timeline-display-groups.d.ts +9 -0
- package/dist/components/Timeline/timeline-display-groups.js +66 -0
- package/dist/components/Timeline/use-timeline-asset-drop.js +21 -21
- package/dist/components/Timeline/use-timeline-expanded-tree.d.ts +2 -1
- package/dist/components/Timeline/use-timeline-expanded-tree.js +1 -2
- package/dist/components/TimelineCombobox.js +1 -0
- package/dist/components/Transcription/TranscriptionModal.js +16 -11
- package/dist/components/Transcription/TranscriptionModalWithOptionalWhisper.js +1 -1
- package/dist/components/UpdateStatusContext.d.ts +2 -2
- package/dist/components/UpdateStatusContext.js +6 -7
- package/dist/components/UpdatesSettings.js +6 -6
- package/dist/components/WebMcp.js +41 -41
- package/dist/components/asset-context-menu.d.ts +32 -0
- package/dist/components/asset-context-menu.js +242 -0
- package/dist/components/composition-drop-preview.d.ts +9 -2
- package/dist/components/composition-drop-preview.js +7 -4
- package/dist/components/composition-menu-items.d.ts +4 -6
- package/dist/components/composition-menu-items.js +191 -75
- package/dist/components/delete-jsx-nodes-api.d.ts +2 -0
- package/dist/components/{delete-jsx-node-api.js → delete-jsx-nodes-api.js} +5 -5
- package/dist/components/get-open-in-menu-items.d.ts +6 -5
- package/dist/components/get-open-in-menu-items.js +22 -16
- package/dist/components/keyboard-shortcuts.d.ts +4 -4
- package/dist/components/keyboard-shortcuts.js +3 -1
- package/dist/components/public-output-name.d.ts +1 -0
- package/dist/components/public-output-name.js +7 -3
- package/dist/components/selected-outline-order.js +18 -12
- package/dist/components/use-open-in-menu-apps.d.ts +14 -0
- package/dist/components/use-open-in-menu-apps.js +33 -0
- package/dist/error-overlay/remotion-overlay/ErrorDisplay.js +2 -2
- package/dist/error-overlay/remotion-overlay/OpenInEditor.d.ts +1 -0
- package/dist/error-overlay/remotion-overlay/OpenInEditor.js +3 -3
- package/dist/error-overlay/remotion-overlay/StackFrame.d.ts +5 -1
- package/dist/error-overlay/remotion-overlay/StackFrame.js +26 -19
- package/dist/esm/{CaptionQueueProcessor-k0yrm3dj.mjs → CaptionQueueProcessor-npa6szn1.mjs} +39 -8
- package/dist/esm/{LazyModels-gfmpcy4h.mjs → LazyModels-nh3c8h9p.mjs} +4 -3
- package/dist/esm/{LazyModels-m1rf06wh.mjs → LazyModels-rr5v8h5y.mjs} +4 -3
- package/dist/esm/{TranscriptionModal-8pvrehg4.mjs → TranscriptionModal-79m5wgcj.mjs} +25 -17
- package/dist/esm/{VideoMattingModal-fefbzgka.mjs → VideoMattingModal-31pew0xj.mjs} +9 -6
- package/dist/esm/index-21hxsfaa.mjs +239 -0
- package/dist/esm/{index-s848rffx.mjs → index-4zen9prq.mjs} +5438 -4686
- package/dist/esm/index-5t2dwxsk.mjs +530 -0
- package/dist/esm/{index-vsxrxfpj.mjs → index-614tdz2q.mjs} +1 -1
- package/dist/esm/{index-0x13f28h.mjs → index-9xxg6218.mjs} +20 -541
- package/dist/esm/{index-hbezgbbq.mjs → index-ac5550e7.mjs} +1 -1
- package/dist/esm/{index-41kqns5c.mjs → index-e855w59j.mjs} +15 -92
- package/dist/esm/{index-tzxb8808.mjs → index-n5gmcvhz.mjs} +8 -8
- package/dist/esm/{index-ggqpre9v.mjs → index-ppspzgn9.mjs} +4963 -4178
- package/dist/esm/{index-jrw61pkj.mjs → index-r0ejh5sy.mjs} +1 -1
- package/dist/esm/index-r1gr3j3a.mjs +80 -0
- package/dist/esm/{index-mww32xc8.mjs → index-s7qa3xbw.mjs} +6 -4
- package/dist/esm/{index-1089795y.mjs → index-vxwg66ar.mjs} +7 -22
- package/dist/esm/index.mjs +13 -6
- package/dist/esm/internals.mjs +10 -7
- package/dist/esm/previewEntry.mjs +10 -7
- package/dist/esm/{resolve-composition-component-location-bt2d6qxq.mjs → resolve-composition-component-location-qrp05g62.mjs} +1 -1
- package/dist/helpers/client-id.d.ts +1 -0
- package/dist/helpers/client-id.js +8 -4
- package/dist/helpers/copy-text.js +1 -16
- package/dist/helpers/cube-lut.d.ts +12 -0
- package/dist/helpers/cube-lut.js +160 -0
- package/dist/helpers/get-preview-file-type.d.ts +1 -1
- package/dist/helpers/get-preview-file-type.js +3 -0
- package/dist/helpers/hoverable.js +2 -1
- package/dist/helpers/open-in-editor.d.ts +5 -2
- package/dist/helpers/open-in-editor.js +13 -5
- package/dist/helpers/settings-tab-availability.d.ts +14 -0
- package/dist/helpers/settings-tab-availability.js +35 -0
- package/dist/helpers/studio-runtime-config.d.ts +1 -1
- package/dist/helpers/use-keybinding.d.ts +1 -1
- package/dist/helpers/use-keyboard-shortcut-label.d.ts +2 -2
- package/dist/helpers/use-menu-structure.js +31 -21
- package/dist/icons/lut.d.ts +4 -0
- package/dist/icons/lut.js +6 -0
- package/dist/icons/sparkles.d.ts +4 -0
- package/dist/icons/sparkles.js +6 -0
- package/dist/state/modals.d.ts +17 -2
- package/dist/state/timeline-zoom.js +4 -0
- package/package.json +19 -19
- package/dist/components/delete-jsx-node-api.d.ts +0 -2
- package/dist/error-overlay/remotion-overlay/CodeFrame.js +0 -62
|
@@ -13,7 +13,13 @@ const focusDefaultPropsPath = ({ path, scrollBehavior, }) => {
|
|
|
13
13
|
success: false,
|
|
14
14
|
};
|
|
15
15
|
}
|
|
16
|
-
query.scrollIntoView({ behavior: scrollBehavior });
|
|
16
|
+
const scrollToField = () => query.scrollIntoView({ behavior: scrollBehavior });
|
|
17
|
+
if (scroll_to_default_props_path_1.expandDefaultPropsEditorRef.current === null) {
|
|
18
|
+
scrollToField();
|
|
19
|
+
}
|
|
20
|
+
else {
|
|
21
|
+
scroll_to_default_props_path_1.expandDefaultPropsEditorRef.current(scrollToField);
|
|
22
|
+
}
|
|
17
23
|
query.classList.add(scroll_to_default_props_path_1.DEFAULT_PROPS_PATH_ACTIVE_CLASSNAME);
|
|
18
24
|
return {
|
|
19
25
|
success: true,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
/**
|
|
3
|
-
* @description Restarts the Remotion Studio.
|
|
3
|
+
* @description Restarts the Remotion Studio process.
|
|
4
4
|
* @see [Documentation](https://www.remotion.dev/docs/studio/restart-studio)
|
|
5
5
|
*/
|
|
6
6
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.AgentPrompt = void 0;
|
|
4
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
const react_1 = require("react");
|
|
6
|
+
const client_id_1 = require("../helpers/client-id");
|
|
7
|
+
const colors_1 = require("../helpers/colors");
|
|
8
|
+
const copy_text_1 = require("../helpers/copy-text");
|
|
9
|
+
const use_copy_feedback_1 = require("../helpers/use-copy-feedback");
|
|
10
|
+
const copy_1 = require("../icons/copy");
|
|
11
|
+
const skills_1 = require("../icons/skills");
|
|
12
|
+
const CodingAgentButton_1 = require("./CodingAgentButton");
|
|
13
|
+
const InlineAction_1 = require("./InlineAction");
|
|
14
|
+
const ValidationMessage_1 = require("./NewComposition/ValidationMessage");
|
|
15
|
+
const NotificationCenter_1 = require("./Notifications/NotificationCenter");
|
|
16
|
+
const SettingsContext_1 = require("./SettingsContext");
|
|
17
|
+
const SkillsSettings_1 = require("./SkillsSettings");
|
|
18
|
+
const text = {
|
|
19
|
+
color: colors_1.LIGHT_TEXT,
|
|
20
|
+
fontFamily: 'sans-serif',
|
|
21
|
+
fontSize: 14,
|
|
22
|
+
lineHeight: 1.5,
|
|
23
|
+
};
|
|
24
|
+
const commandField = {
|
|
25
|
+
alignItems: 'flex-start',
|
|
26
|
+
background: colors_1.BLACK_ALPHA_30,
|
|
27
|
+
borderRadius: 6,
|
|
28
|
+
boxSizing: 'border-box',
|
|
29
|
+
display: 'flex',
|
|
30
|
+
gap: 8,
|
|
31
|
+
marginTop: 10,
|
|
32
|
+
padding: '8px 8px 8px 10px',
|
|
33
|
+
width: '100%',
|
|
34
|
+
};
|
|
35
|
+
const code = {
|
|
36
|
+
color: colors_1.WHITE,
|
|
37
|
+
flex: 1,
|
|
38
|
+
fontFamily: 'monospace',
|
|
39
|
+
fontSize: 13,
|
|
40
|
+
fontWeight: 'normal',
|
|
41
|
+
lineHeight: 1.5,
|
|
42
|
+
margin: 0,
|
|
43
|
+
minWidth: 0,
|
|
44
|
+
overflowWrap: 'anywhere',
|
|
45
|
+
whiteSpace: 'pre-wrap',
|
|
46
|
+
};
|
|
47
|
+
const copyAction = { flexShrink: 0 };
|
|
48
|
+
const copyIcon = { flexShrink: 0, height: 12, width: 12 };
|
|
49
|
+
const skillsIcon = {
|
|
50
|
+
display: 'inline-block',
|
|
51
|
+
height: 18,
|
|
52
|
+
marginRight: 6,
|
|
53
|
+
verticalAlign: 'middle',
|
|
54
|
+
width: 18,
|
|
55
|
+
};
|
|
56
|
+
const promptHeader = {
|
|
57
|
+
alignItems: 'center',
|
|
58
|
+
display: 'flex',
|
|
59
|
+
gap: 12,
|
|
60
|
+
justifyContent: 'space-between',
|
|
61
|
+
};
|
|
62
|
+
const skillRowContainer = {
|
|
63
|
+
borderTop: colors_1.BORDER_WHITE_ALPHA_12,
|
|
64
|
+
marginTop: 10,
|
|
65
|
+
};
|
|
66
|
+
const skillError = { marginTop: 10 };
|
|
67
|
+
const AgentPrompt = ({ availableText, promptDetails, skillId }) => {
|
|
68
|
+
var _a;
|
|
69
|
+
const { codingAgentInfo, remotionSkillsInfo, skillActionError } = (0, SettingsContext_1.useSettings)();
|
|
70
|
+
const { previewServerState } = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx);
|
|
71
|
+
const skill = remotionSkillsInfo === null || remotionSkillsInfo === void 0 ? void 0 : remotionSkillsInfo.skills.find(({ name }) => name === skillId);
|
|
72
|
+
const skillAvailable = Boolean((skill === null || skill === void 0 ? void 0 : skill.installedInProject) || (skill === null || skill === void 0 ? void 0 : skill.installedGlobally));
|
|
73
|
+
const canInstallSkill = !window.remotion_isReadOnlyStudio &&
|
|
74
|
+
previewServerState.type === 'connected' &&
|
|
75
|
+
remotionSkillsInfo !== null;
|
|
76
|
+
const skillName = `/${skillId}`;
|
|
77
|
+
const prompt = `${skillName}${promptDetails}`;
|
|
78
|
+
const installCommand = 'npx remotion skills add';
|
|
79
|
+
const hasCodingAgent = ((_a = codingAgentInfo === null || codingAgentInfo === void 0 ? void 0 : codingAgentInfo.installedCodingAgents.length) !== null && _a !== void 0 ? _a : 0) > 0;
|
|
80
|
+
const { copied: promptCopied, markCopied: markPromptCopied } = (0, use_copy_feedback_1.useCopyFeedback)();
|
|
81
|
+
const { copied: installCopied, markCopied: markInstallCopied } = (0, use_copy_feedback_1.useCopyFeedback)();
|
|
82
|
+
const copy = (0, react_1.useCallback)((value, markCopied) => {
|
|
83
|
+
(0, copy_text_1.copyText)(value)
|
|
84
|
+
.then(markCopied)
|
|
85
|
+
.catch((err) => (0, NotificationCenter_1.showNotification)(`Could not copy: ${err.message}`, 2000));
|
|
86
|
+
}, []);
|
|
87
|
+
const renderPromptCopy = (0, react_1.useCallback)((color) => (jsx_runtime_1.jsx(copy_1.CopyIcon, { copied: promptCopied, color: color, style: copyIcon })), [promptCopied]);
|
|
88
|
+
const renderInstallCopy = (0, react_1.useCallback)((color) => (jsx_runtime_1.jsx(copy_1.CopyIcon, { copied: installCopied, color: color, style: copyIcon })), [installCopied]);
|
|
89
|
+
return (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [skillAvailable ? null : (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
|
|
90
|
+
jsx_runtime_1.jsx("div", { style: text, children: "Install the Agent Skill first:" }), canInstallSkill && skill ? (jsx_runtime_1.jsx("div", { "aria-label": "Remotion Agent Skills", role: "list", style: skillRowContainer, children: jsx_runtime_1.jsx(SkillsSettings_1.SkillSettingsRow, { isLast: false, skill: skill }) })) : (jsx_runtime_1.jsxs("div", { style: commandField, children: [
|
|
91
|
+
jsx_runtime_1.jsx("pre", { style: code, children: installCommand }), jsx_runtime_1.jsx(InlineAction_1.InlineAction, { onClick: () => copy(installCommand, markInstallCopied), renderAction: renderInstallCopy, style: copyAction, title: "Copy command", variant: null })
|
|
92
|
+
] })), skillActionError ? (jsx_runtime_1.jsx("div", { style: skillError, children: jsx_runtime_1.jsx(ValidationMessage_1.ValidationMessage, { align: "flex-start", message: skillActionError, type: "error" }) })) : null] })), jsx_runtime_1.jsxs("div", { style: { ...promptHeader, marginTop: skillAvailable ? 0 : 16 }, children: [
|
|
93
|
+
jsx_runtime_1.jsx("div", { style: text, children: skillAvailable
|
|
94
|
+
? availableText
|
|
95
|
+
: `Then ${availableText.toLowerCase()}` }), hasCodingAgent ? (jsx_runtime_1.jsx(CodingAgentButton_1.CodingAgentButton, { label: "Open in", prompt: prompt, size: "compact", style: null })) : null] }), jsx_runtime_1.jsxs("div", { style: commandField, children: [
|
|
96
|
+
jsx_runtime_1.jsxs("pre", { style: code, children: [
|
|
97
|
+
jsx_runtime_1.jsx(skills_1.SkillsIcon, { color: colors_1.BLUE, style: skillsIcon, "aria-hidden": true }), jsx_runtime_1.jsx("span", { style: {
|
|
98
|
+
color: colors_1.BLUE,
|
|
99
|
+
fontFamily: 'inherit',
|
|
100
|
+
fontSize: 'inherit',
|
|
101
|
+
fontWeight: 'inherit',
|
|
102
|
+
lineHeight: 'inherit',
|
|
103
|
+
}, children: skillName }), promptDetails] }), jsx_runtime_1.jsx(InlineAction_1.InlineAction, { onClick: () => copy(prompt, markPromptCopied), renderAction: renderPromptCopy, style: copyAction, title: "Copy prompt", variant: null })
|
|
104
|
+
] })
|
|
105
|
+
] }));
|
|
106
|
+
};
|
|
107
|
+
exports.AgentPrompt = AgentPrompt;
|
|
@@ -7,12 +7,14 @@ const file_1 = require("../icons/file");
|
|
|
7
7
|
const font_1 = require("../icons/font");
|
|
8
8
|
const frame_1 = require("../icons/frame");
|
|
9
9
|
const json_1 = require("../icons/json");
|
|
10
|
+
const lut_1 = require("../icons/lut");
|
|
10
11
|
const video_1 = require("../icons/video");
|
|
11
12
|
const iconByFileType = {
|
|
12
13
|
audio: audio_1.AudioFileIcon,
|
|
13
14
|
font: font_1.FontFileIcon,
|
|
14
15
|
image: frame_1.PicIcon,
|
|
15
16
|
json: json_1.JsonFileIcon,
|
|
17
|
+
lut: lut_1.LutFileIcon,
|
|
16
18
|
other: file_1.FileIcon,
|
|
17
19
|
txt: file_1.FileIcon,
|
|
18
20
|
video: video_1.VideoFileIcon,
|
|
@@ -1,33 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { AssetStructure } from '../helpers/create-folder-tree';
|
|
3
3
|
import type { ComboboxValue } from './NewComposition/ComboBox';
|
|
4
|
-
export
|
|
5
|
-
browserStudioCanMutateAssets: boolean | null;
|
|
6
|
-
readOnlyStudio: boolean;
|
|
7
|
-
connectionStatus: "connected" | "disconnected" | "init";
|
|
8
|
-
publicFolderExists: string | null;
|
|
9
|
-
}) => {
|
|
10
|
-
mutationsDisabled: boolean;
|
|
11
|
-
fileExplorerDisabled: boolean;
|
|
12
|
-
};
|
|
4
|
+
export { getAssetActionAvailability, getAssetContextMenuItems, } from './asset-context-menu';
|
|
13
5
|
export declare const getCanDragAsset: ({ readOnlyStudio, relativePath, }: {
|
|
14
6
|
readOnlyStudio: boolean;
|
|
15
7
|
relativePath: string;
|
|
16
8
|
}) => boolean;
|
|
17
|
-
export declare const getAssetContextMenuItems: ({ relativePath, fileManagerName, copyFileName, copyStaticFilePath, copyAbsolutePath, openAssetInConvert, openAssetInExplorer, renameAsset, deleteAsset, fileExplorerAvailable, fileExplorerDisabled, mutationsDisabled, }: {
|
|
18
|
-
relativePath: string;
|
|
19
|
-
fileManagerName: string;
|
|
20
|
-
copyFileName: () => void;
|
|
21
|
-
copyStaticFilePath: () => void;
|
|
22
|
-
copyAbsolutePath: (() => void) | null;
|
|
23
|
-
openAssetInConvert: () => void;
|
|
24
|
-
openAssetInExplorer: () => void;
|
|
25
|
-
renameAsset: () => void;
|
|
26
|
-
deleteAsset: () => void;
|
|
27
|
-
fileExplorerAvailable: boolean;
|
|
28
|
-
fileExplorerDisabled: boolean;
|
|
29
|
-
mutationsDisabled: boolean;
|
|
30
|
-
}) => ComboboxValue[];
|
|
31
9
|
export declare const getAssetFolderContextMenuItems: ({ folderPath, fileManagerName, copyFolderPath, copyAbsolutePath, openFolderInExplorer, uploadAssets, fileExplorerAvailable, fileExplorerDisabled, mutationsDisabled, }: {
|
|
32
10
|
folderPath: string;
|
|
33
11
|
fileManagerName: string;
|
|
@@ -33,7 +33,7 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
33
33
|
};
|
|
34
34
|
})();
|
|
35
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
|
-
exports.AssetFolderTree = exports.getAssetFolderContextMenuItems = exports.
|
|
36
|
+
exports.AssetFolderTree = exports.getAssetFolderContextMenuItems = exports.getCanDragAsset = exports.getAssetContextMenuItems = exports.getAssetActionAvailability = void 0;
|
|
37
37
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
38
38
|
const studio_protocol_1 = require("@remotion/studio-protocol");
|
|
39
39
|
const react_1 = require("react");
|
|
@@ -46,7 +46,6 @@ const copy_text_1 = require("../helpers/copy-text");
|
|
|
46
46
|
const get_file_manager_name_1 = require("../helpers/get-file-manager-name");
|
|
47
47
|
const get_preview_file_type_1 = require("../helpers/get-preview-file-type");
|
|
48
48
|
const hoverable_1 = require("../helpers/hoverable");
|
|
49
|
-
const open_in_remotion_convert_1 = require("../helpers/open-in-remotion-convert");
|
|
50
49
|
const sidebar_scroll_into_view_1 = require("../helpers/sidebar-scroll-into-view");
|
|
51
50
|
const url_state_1 = require("../helpers/url-state");
|
|
52
51
|
const use_asset_drag_events_1 = __importStar(require("../helpers/use-asset-drag-events"));
|
|
@@ -54,7 +53,7 @@ const use_image_metadata_1 = require("../helpers/use-image-metadata");
|
|
|
54
53
|
const use_media_metadata_1 = require("../helpers/use-media-metadata");
|
|
55
54
|
const ellipsis_1 = require("../icons/ellipsis");
|
|
56
55
|
const folder_1 = require("../icons/folder");
|
|
57
|
-
const
|
|
56
|
+
const asset_context_menu_1 = require("./asset-context-menu");
|
|
58
57
|
const AssetFileIcon_1 = require("./AssetFileIcon");
|
|
59
58
|
const ContextMenu_1 = require("./ContextMenu");
|
|
60
59
|
const import_assets_1 = require("./import-assets");
|
|
@@ -62,9 +61,10 @@ const InlineAction_1 = require("./InlineAction");
|
|
|
62
61
|
const InlineDropdown_1 = require("./InlineDropdown");
|
|
63
62
|
const layout_1 = require("./layout");
|
|
64
63
|
const NotificationCenter_1 = require("./Notifications/NotificationCenter");
|
|
65
|
-
const open_in_new_window_1 = require("./open-in-new-window");
|
|
66
64
|
const actions_1 = require("./RenderQueue/actions");
|
|
67
|
-
const
|
|
65
|
+
const asset_context_menu_2 = require("./asset-context-menu");
|
|
66
|
+
Object.defineProperty(exports, "getAssetActionAvailability", { enumerable: true, get: function () { return asset_context_menu_2.getAssetActionAvailability; } });
|
|
67
|
+
Object.defineProperty(exports, "getAssetContextMenuItems", { enumerable: true, get: function () { return asset_context_menu_2.getAssetContextMenuItems; } });
|
|
68
68
|
const iconStyle = {
|
|
69
69
|
width: 18,
|
|
70
70
|
height: 18,
|
|
@@ -114,124 +114,10 @@ const inlineActionsStyle = {
|
|
|
114
114
|
const renderContextMenuAction = (color) => {
|
|
115
115
|
return jsx_runtime_1.jsx(ellipsis_1.EllipsisIcon, { svgProps: ellipsisIconStyle, fill: color });
|
|
116
116
|
};
|
|
117
|
-
const getAssetActionAvailability = ({ browserStudioCanMutateAssets, readOnlyStudio, connectionStatus, publicFolderExists, }) => {
|
|
118
|
-
return {
|
|
119
|
-
mutationsDisabled: browserStudioCanMutateAssets !== true &&
|
|
120
|
-
(readOnlyStudio || connectionStatus !== 'connected'),
|
|
121
|
-
fileExplorerDisabled: browserStudioCanMutateAssets !== null ||
|
|
122
|
-
publicFolderExists === null ||
|
|
123
|
-
readOnlyStudio ||
|
|
124
|
-
connectionStatus !== 'connected',
|
|
125
|
-
};
|
|
126
|
-
};
|
|
127
|
-
exports.getAssetActionAvailability = getAssetActionAvailability;
|
|
128
117
|
const getCanDragAsset = ({ readOnlyStudio, relativePath, }) => {
|
|
129
118
|
return !readOnlyStudio && (0, import_assets_1.getAssetElementFromPath)(relativePath) !== null;
|
|
130
119
|
};
|
|
131
120
|
exports.getCanDragAsset = getCanDragAsset;
|
|
132
|
-
const getAssetContextMenuItems = ({ relativePath, fileManagerName, copyFileName, copyStaticFilePath, copyAbsolutePath, openAssetInConvert, openAssetInExplorer, renameAsset, deleteAsset, fileExplorerAvailable, fileExplorerDisabled, mutationsDisabled, }) => {
|
|
133
|
-
const previewFileType = (0, get_preview_file_type_1.getPreviewFileType)(relativePath);
|
|
134
|
-
const canOpenInConvert = previewFileType === 'audio' || previewFileType === 'video';
|
|
135
|
-
const items = [
|
|
136
|
-
(0, open_in_new_window_1.getOpenInNewWindowMenuItem)(`/assets/${relativePath}`),
|
|
137
|
-
canOpenInConvert
|
|
138
|
-
? {
|
|
139
|
-
id: 'open-asset-in-convert',
|
|
140
|
-
keyHint: null,
|
|
141
|
-
label: 'Open in Remotion Convert',
|
|
142
|
-
leftItem: null,
|
|
143
|
-
onClick: openAssetInConvert,
|
|
144
|
-
quickSwitcherLabel: 'Open asset in Remotion Convert',
|
|
145
|
-
subMenu: null,
|
|
146
|
-
type: 'item',
|
|
147
|
-
value: 'open-asset-in-convert',
|
|
148
|
-
}
|
|
149
|
-
: null,
|
|
150
|
-
{
|
|
151
|
-
type: 'divider',
|
|
152
|
-
id: 'open-in-new-window-divider',
|
|
153
|
-
},
|
|
154
|
-
{
|
|
155
|
-
id: 'copy-asset-file-name',
|
|
156
|
-
keyHint: null,
|
|
157
|
-
label: 'Copy file name',
|
|
158
|
-
leftItem: null,
|
|
159
|
-
onClick: copyFileName,
|
|
160
|
-
quickSwitcherLabel: 'Copy asset file name',
|
|
161
|
-
subMenu: null,
|
|
162
|
-
type: 'item',
|
|
163
|
-
value: 'copy-asset-file-name',
|
|
164
|
-
},
|
|
165
|
-
{
|
|
166
|
-
id: 'copy-asset-static-file-path',
|
|
167
|
-
keyHint: null,
|
|
168
|
-
label: 'Copy staticFile() path',
|
|
169
|
-
leftItem: null,
|
|
170
|
-
onClick: copyStaticFilePath,
|
|
171
|
-
quickSwitcherLabel: 'Copy staticFile() path',
|
|
172
|
-
subMenu: null,
|
|
173
|
-
type: 'item',
|
|
174
|
-
value: 'copy-asset-static-file-path',
|
|
175
|
-
},
|
|
176
|
-
copyAbsolutePath
|
|
177
|
-
? {
|
|
178
|
-
id: 'copy-asset-absolute-path',
|
|
179
|
-
keyHint: null,
|
|
180
|
-
label: 'Copy absolute path',
|
|
181
|
-
leftItem: null,
|
|
182
|
-
onClick: copyAbsolutePath,
|
|
183
|
-
quickSwitcherLabel: 'Copy asset absolute path',
|
|
184
|
-
subMenu: null,
|
|
185
|
-
type: 'item',
|
|
186
|
-
value: 'copy-asset-absolute-path',
|
|
187
|
-
}
|
|
188
|
-
: null,
|
|
189
|
-
{
|
|
190
|
-
type: 'divider',
|
|
191
|
-
id: 'asset-file-actions-divider',
|
|
192
|
-
},
|
|
193
|
-
fileExplorerAvailable
|
|
194
|
-
? {
|
|
195
|
-
id: 'open-asset-in-explorer',
|
|
196
|
-
keyHint: null,
|
|
197
|
-
label: `Show in ${fileManagerName}`,
|
|
198
|
-
leftItem: null,
|
|
199
|
-
onClick: openAssetInExplorer,
|
|
200
|
-
quickSwitcherLabel: `Show asset in ${fileManagerName}`,
|
|
201
|
-
subMenu: null,
|
|
202
|
-
type: 'item',
|
|
203
|
-
value: 'open-asset-in-explorer',
|
|
204
|
-
disabled: fileExplorerDisabled,
|
|
205
|
-
}
|
|
206
|
-
: null,
|
|
207
|
-
{
|
|
208
|
-
id: 'rename-asset',
|
|
209
|
-
keyHint: null,
|
|
210
|
-
label: 'Rename...',
|
|
211
|
-
leftItem: null,
|
|
212
|
-
onClick: renameAsset,
|
|
213
|
-
quickSwitcherLabel: 'Rename asset...',
|
|
214
|
-
subMenu: null,
|
|
215
|
-
type: 'item',
|
|
216
|
-
value: 'rename-asset',
|
|
217
|
-
disabled: mutationsDisabled,
|
|
218
|
-
},
|
|
219
|
-
{
|
|
220
|
-
id: 'delete-asset',
|
|
221
|
-
keyHint: null,
|
|
222
|
-
label: 'Delete...',
|
|
223
|
-
leftItem: null,
|
|
224
|
-
onClick: deleteAsset,
|
|
225
|
-
quickSwitcherLabel: 'Delete asset...',
|
|
226
|
-
subMenu: null,
|
|
227
|
-
type: 'item',
|
|
228
|
-
value: 'delete-asset',
|
|
229
|
-
disabled: mutationsDisabled,
|
|
230
|
-
},
|
|
231
|
-
];
|
|
232
|
-
return items.filter(no_react_1.NoReactInternals.truthy);
|
|
233
|
-
};
|
|
234
|
-
exports.getAssetContextMenuItems = getAssetContextMenuItems;
|
|
235
121
|
const getAssetFolderContextMenuItems = ({ folderPath, fileManagerName, copyFolderPath, copyAbsolutePath, openFolderInExplorer, uploadAssets, fileExplorerAvailable, fileExplorerDisabled, mutationsDisabled, }) => {
|
|
236
122
|
const items = [
|
|
237
123
|
fileExplorerAvailable
|
|
@@ -357,7 +243,7 @@ const AssetFolderItem = ({ tabIndex, item, level, parentFolder, toggleFolder, dr
|
|
|
357
243
|
const uploadAssetsToFolder = (0, react_1.useCallback)(() => {
|
|
358
244
|
uploadAssets(folderPath);
|
|
359
245
|
}, [folderPath, uploadAssets]);
|
|
360
|
-
const { mutationsDisabled, fileExplorerDisabled } = (0,
|
|
246
|
+
const { mutationsDisabled, fileExplorerDisabled } = (0, asset_context_menu_1.getAssetActionAvailability)({
|
|
361
247
|
browserStudioCanMutateAssets: (0, browser_studio_operations_1.getBrowserStudioOperations)() === null ? null : true,
|
|
362
248
|
readOnlyStudio,
|
|
363
249
|
connectionStatus,
|
|
@@ -423,16 +309,16 @@ const AssetFolderTree = ({ item, level, name, parentFolder, toggleFolder, tabInd
|
|
|
423
309
|
};
|
|
424
310
|
exports.AssetFolderTree = AssetFolderTree;
|
|
425
311
|
const AssetSelectorItem = ({ item, tabIndex, level, parentFolder, readOnlyStudio }) => {
|
|
426
|
-
const fileManagerName = (0, get_file_manager_name_1.getFileManagerName)(window.remotion_fileSystemPlatform);
|
|
427
312
|
const [isDragging, setIsDragging] = (0, react_1.useState)(false);
|
|
428
|
-
const { setSelectedModal } = (0, react_1.useContext)(modals_1.SetSelectedModalContext);
|
|
429
|
-
const connectionStatus = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx)
|
|
430
|
-
.previewServerState.type;
|
|
431
313
|
const { setCanvasContent } = (0, react_1.useContext)(remotion_1.Internals.CompositionSetters);
|
|
432
314
|
const { canvasContent } = (0, react_1.useContext)(remotion_1.Internals.CompositionManager);
|
|
433
315
|
const relativePath = (0, react_1.useMemo)(() => {
|
|
434
316
|
return parentFolder ? parentFolder + '/' + item.name : item.name;
|
|
435
317
|
}, [parentFolder, item.name]);
|
|
318
|
+
const { fileExplorerDisabled, fileManagerName, getContextMenuItems } = (0, asset_context_menu_1.useAssetContextMenuItems)({
|
|
319
|
+
relativePath,
|
|
320
|
+
readOnlyStudio,
|
|
321
|
+
});
|
|
436
322
|
const previewFileType = (0, react_1.useMemo)(() => {
|
|
437
323
|
return (0, get_preview_file_type_1.getPreviewFileType)(relativePath);
|
|
438
324
|
}, [relativePath]);
|
|
@@ -511,41 +397,6 @@ const AssetSelectorItem = ({ item, tabIndex, level, parentFolder, readOnlyStudio
|
|
|
511
397
|
const renderFileExplorerAction = (0, react_1.useCallback)((color) => {
|
|
512
398
|
return jsx_runtime_1.jsx(folder_1.ExpandedFolderIcon, { style: revealIconStyle, color: color });
|
|
513
399
|
}, []);
|
|
514
|
-
const copyFileName = (0, react_1.useCallback)(() => {
|
|
515
|
-
(0, copy_text_1.copyText)(item.name)
|
|
516
|
-
.then(() => {
|
|
517
|
-
(0, NotificationCenter_1.showNotification)(`Copied '${item.name}' to clipboard`, 1000);
|
|
518
|
-
})
|
|
519
|
-
.catch((err) => {
|
|
520
|
-
(0, NotificationCenter_1.showNotification)(`Could not copy: ${err.message}`, 2000);
|
|
521
|
-
});
|
|
522
|
-
}, [item.name]);
|
|
523
|
-
const copyStaticFilePath = (0, react_1.useCallback)(() => {
|
|
524
|
-
const content = `staticFile("${relativePath}")`;
|
|
525
|
-
(0, copy_text_1.copyText)(content)
|
|
526
|
-
.then(() => {
|
|
527
|
-
(0, NotificationCenter_1.showNotification)(`Copied '${content}' to clipboard`, 1000);
|
|
528
|
-
})
|
|
529
|
-
.catch((err) => {
|
|
530
|
-
(0, NotificationCenter_1.showNotification)(`Could not copy: ${err.message}`, 2000);
|
|
531
|
-
});
|
|
532
|
-
}, [relativePath]);
|
|
533
|
-
const copyAbsolutePath = (0, react_1.useCallback)(() => {
|
|
534
|
-
if (window.remotion_publicFolderExists === null) {
|
|
535
|
-
return;
|
|
536
|
-
}
|
|
537
|
-
const content = `${window.remotion_publicFolderExists}/${relativePath}`;
|
|
538
|
-
(0, copy_text_1.copyText)(content)
|
|
539
|
-
.then(() => {
|
|
540
|
-
(0, NotificationCenter_1.showNotification)(`Copied '${content}' to clipboard`, 1000);
|
|
541
|
-
})
|
|
542
|
-
.catch((err) => {
|
|
543
|
-
(0, NotificationCenter_1.showNotification)(`Could not copy: ${err.message}`, 2000);
|
|
544
|
-
});
|
|
545
|
-
}, [relativePath]);
|
|
546
|
-
const openAssetInConvert = (0, react_1.useCallback)(() => {
|
|
547
|
-
(0, open_in_remotion_convert_1.openInRemotionConvert)({ relativePath });
|
|
548
|
-
}, [relativePath]);
|
|
549
400
|
const openAssetInExplorer = (0, react_1.useCallback)(() => {
|
|
550
401
|
if (!window.remotion_publicFolderExists) {
|
|
551
402
|
(0, NotificationCenter_1.showNotification)('Could not find the public folder', 2000);
|
|
@@ -557,47 +408,6 @@ const AssetSelectorItem = ({ item, tabIndex, level, parentFolder, readOnlyStudio
|
|
|
557
408
|
(0, NotificationCenter_1.showNotification)(`Could not open file: ${err.message}`, 2000);
|
|
558
409
|
});
|
|
559
410
|
}, [relativePath]);
|
|
560
|
-
const { mutationsDisabled, fileExplorerDisabled } = (0, exports.getAssetActionAvailability)({
|
|
561
|
-
browserStudioCanMutateAssets: (0, browser_studio_operations_1.getBrowserStudioOperations)() === null ? null : true,
|
|
562
|
-
readOnlyStudio,
|
|
563
|
-
connectionStatus,
|
|
564
|
-
publicFolderExists: window.remotion_publicFolderExists,
|
|
565
|
-
});
|
|
566
|
-
const deleteAsset = (0, use_delete_asset_1.useDeleteAsset)(relativePath);
|
|
567
|
-
const renameAsset = (0, react_1.useCallback)(() => {
|
|
568
|
-
setSelectedModal({
|
|
569
|
-
type: 'rename-static-file',
|
|
570
|
-
relativePath,
|
|
571
|
-
});
|
|
572
|
-
}, [relativePath, setSelectedModal]);
|
|
573
|
-
const getContextMenuItems = (0, react_1.useCallback)(() => {
|
|
574
|
-
return (0, exports.getAssetContextMenuItems)({
|
|
575
|
-
relativePath,
|
|
576
|
-
fileManagerName,
|
|
577
|
-
copyFileName,
|
|
578
|
-
copyStaticFilePath,
|
|
579
|
-
copyAbsolutePath: window.remotion_publicFolderExists === null ? null : copyAbsolutePath,
|
|
580
|
-
openAssetInConvert,
|
|
581
|
-
openAssetInExplorer,
|
|
582
|
-
renameAsset,
|
|
583
|
-
deleteAsset,
|
|
584
|
-
fileExplorerAvailable: (0, browser_studio_operations_1.getBrowserStudioOperations)() === null,
|
|
585
|
-
fileExplorerDisabled,
|
|
586
|
-
mutationsDisabled,
|
|
587
|
-
});
|
|
588
|
-
}, [
|
|
589
|
-
copyFileName,
|
|
590
|
-
copyStaticFilePath,
|
|
591
|
-
copyAbsolutePath,
|
|
592
|
-
deleteAsset,
|
|
593
|
-
fileExplorerDisabled,
|
|
594
|
-
fileManagerName,
|
|
595
|
-
mutationsDisabled,
|
|
596
|
-
openAssetInConvert,
|
|
597
|
-
openAssetInExplorer,
|
|
598
|
-
renameAsset,
|
|
599
|
-
relativePath,
|
|
600
|
-
]);
|
|
601
411
|
const revealInExplorer = (0, react_1.useCallback)((e) => {
|
|
602
412
|
e.stopPropagation();
|
|
603
413
|
openAssetInExplorer();
|