@remotion/studio
Version:
APIs for interacting with the Remotion Studio
105 lines (104 loc) • 4.97 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SidebarRenderButton = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const remotion_1 = require("remotion");
const client_id_1 = require("../helpers/client-id");
const mobile_layout_1 = require("../helpers/mobile-layout");
const render_1 = require("../icons/render");
const modals_1 = require("../state/modals");
const sidebar_1 = require("../state/sidebar");
const InlineAction_1 = require("./InlineAction");
const SidebarRenderButton = ({ composition, visible }) => {
const { setSelectedModal } = (0, react_1.useContext)(modals_1.ModalsContext);
const { setSidebarCollapsedState } = (0, react_1.useContext)(sidebar_1.SidebarContext);
const isMobileLayout = (0, mobile_layout_1.useMobileLayout)();
const iconStyle = (0, react_1.useMemo)(() => {
return {
style: {
height: 12,
},
};
}, []);
const connectionStatus = (0, react_1.useContext)(client_id_1.StudioServerConnectionCtx)
.previewServerState.type;
const { props } = (0, react_1.useContext)(remotion_1.Internals.EditorPropsContext);
const onClick = (0, react_1.useCallback)((e) => {
var _a;
const defaults = window.remotion_renderDefaults;
if (!defaults) {
throw new Error('expected defaults');
}
e.stopPropagation();
setSelectedModal({
type: 'server-render',
compositionId: composition.id,
initialFrame: 0,
initialVideoImageFormat: defaults.videoImageFormat,
initialStillImageFormat: defaults.stillImageFormat,
initialJpegQuality: defaults.jpegQuality,
initialScale: defaults.scale,
initialLogLevel: defaults.logLevel,
initialConcurrency: defaults.concurrency,
maxConcurrency: defaults.maxConcurrency,
minConcurrency: defaults.minConcurrency,
initialMuted: defaults.muted,
initialEnforceAudioTrack: defaults.enforceAudioTrack,
initialProResProfile: defaults.proResProfile,
initialx264Preset: defaults.x264Preset,
initialPixelFormat: null,
initialAudioBitrate: defaults.audioBitrate,
initialVideoBitrate: defaults.videoBitrate,
initialEveryNthFrame: defaults.everyNthFrame,
initialNumberOfGifLoops: defaults.numberOfGifLoops,
initialDelayRenderTimeout: defaults.delayRenderTimeout,
defaultConfigurationAudioCodec: defaults.audioCodec,
initialEnvVariables: window.process.env,
initialDisableWebSecurity: defaults.disableWebSecurity,
initialOpenGlRenderer: defaults.openGlRenderer,
initialHeadless: defaults.headless,
initialOffthreadVideoCacheSizeInBytes: defaults.offthreadVideoCacheSizeInBytes,
initialOffthreadVideoThreads: defaults.offthreadVideoThreads,
initialIgnoreCertificateErrors: defaults.ignoreCertificateErrors,
defaultProps: (_a = props[composition.id]) !== null && _a !== void 0 ? _a : composition.defaultProps,
inFrameMark: null,
outFrameMark: null,
initialColorSpace: defaults.colorSpace,
initialMultiProcessOnLinux: defaults.multiProcessOnLinux,
defaultConfigurationVideoCodec: defaults.codec,
initialEncodingBufferSize: defaults.encodingBufferSize,
initialEncodingMaxRate: defaults.encodingMaxRate,
initialUserAgent: defaults.userAgent,
initialBeep: defaults.beepOnFinish,
initialRepro: defaults.repro,
initialForSeamlessAacConcatenation: defaults.forSeamlessAacConcatenation,
renderTypeOfLastRender: null,
defaulMetadata: defaults.metadata,
initialHardwareAcceleration: defaults.hardwareAcceleration,
initialChromeMode: defaults.chromeMode,
initialMediaCacheSizeInBytes: defaults.mediaCacheSizeInBytes,
renderDefaults: defaults,
initialDarkMode: defaults.darkMode,
readOnlyStudio: false,
});
if (isMobileLayout) {
setSidebarCollapsedState({ left: 'collapsed', right: 'collapsed' });
}
}, [
composition.defaultProps,
composition.id,
isMobileLayout,
props,
setSelectedModal,
setSidebarCollapsedState,
]);
const renderAction = (0, react_1.useCallback)((color) => {
return jsx_runtime_1.jsx(render_1.ThinRenderIcon, { fill: color, svgProps: iconStyle });
}, [iconStyle]);
if (!visible || connectionStatus !== 'connected') {
return null;
}
return jsx_runtime_1.jsx(InlineAction_1.InlineAction, { renderAction: renderAction, onClick: onClick });
};
exports.SidebarRenderButton = SidebarRenderButton;