Adolfo Reyna
71 lines
3.0 KiB
JavaScript
71 lines
3.0 KiB
JavaScript
"use strict";
|
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
exports.Freeze = void 0;
|
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
const react_1 = require("react");
|
|
const SequenceContext_js_1 = require("./SequenceContext.js");
|
|
const TimelineContext_js_1 = require("./TimelineContext.js");
|
|
const use_current_frame_js_1 = require("./use-current-frame.js");
|
|
const use_video_config_js_1 = require("./use-video-config.js");
|
|
/*
|
|
* @description Freezes its children at the specified frame when rendering videos.
|
|
* @see [Documentation](https://remotion.dev/docs/freeze)
|
|
*/
|
|
const Freeze = ({ frame: frameToFreeze, children, active = true, }) => {
|
|
var _a;
|
|
const frame = (0, use_current_frame_js_1.useCurrentFrame)();
|
|
const videoConfig = (0, use_video_config_js_1.useVideoConfig)();
|
|
if (typeof frameToFreeze === 'undefined') {
|
|
throw new Error(`The <Freeze /> component requires a 'frame' prop, but none was passed.`);
|
|
}
|
|
if (typeof frameToFreeze !== 'number') {
|
|
throw new Error(`The 'frame' prop of <Freeze /> must be a number, but is of type ${typeof frameToFreeze}`);
|
|
}
|
|
if (Number.isNaN(frameToFreeze)) {
|
|
throw new Error(`The 'frame' prop of <Freeze /> must be a real number, but it is NaN.`);
|
|
}
|
|
if (!Number.isFinite(frameToFreeze)) {
|
|
throw new Error(`The 'frame' prop of <Freeze /> must be a finite number, but it is ${frameToFreeze}.`);
|
|
}
|
|
const isActive = (0, react_1.useMemo)(() => {
|
|
if (typeof active === 'boolean') {
|
|
return active;
|
|
}
|
|
if (typeof active === 'function') {
|
|
return active(frame);
|
|
}
|
|
}, [active, frame]);
|
|
const timelineContext = (0, react_1.useContext)(TimelineContext_js_1.TimelineContext);
|
|
const sequenceContext = (0, react_1.useContext)(SequenceContext_js_1.SequenceContext);
|
|
const relativeFrom = (_a = sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom) !== null && _a !== void 0 ? _a : 0;
|
|
const timelineValue = (0, react_1.useMemo)(() => {
|
|
if (!isActive) {
|
|
return timelineContext;
|
|
}
|
|
return {
|
|
...timelineContext,
|
|
playing: false,
|
|
imperativePlaying: {
|
|
current: false,
|
|
},
|
|
frame: {
|
|
[videoConfig.id]: frameToFreeze + relativeFrom,
|
|
},
|
|
};
|
|
}, [isActive, timelineContext, videoConfig.id, frameToFreeze, relativeFrom]);
|
|
const newSequenceContext = (0, react_1.useMemo)(() => {
|
|
if (!sequenceContext) {
|
|
return null;
|
|
}
|
|
if (!isActive) {
|
|
return sequenceContext;
|
|
}
|
|
return {
|
|
...sequenceContext,
|
|
cumulatedFrom: 0,
|
|
};
|
|
}, [sequenceContext, isActive]);
|
|
return ((0, jsx_runtime_1.jsx)(TimelineContext_js_1.TimelineContext.Provider, { value: timelineValue, children: (0, jsx_runtime_1.jsx)(SequenceContext_js_1.SequenceContext.Provider, { value: newSequenceContext, children: children }) }));
|
|
};
|
|
exports.Freeze = Freeze;
|