@remotion/studio
Version:
APIs for interacting with the Remotion Studio
50 lines (49 loc) • 3.11 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TimelineFieldValue = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const TimelineBooleanField_1 = require("./TimelineBooleanField");
const TimelineNumberField_1 = require("./TimelineNumberField");
const TimelineRotationField_1 = require("./TimelineRotationField");
const TimelineTranslateField_1 = require("./TimelineTranslateField");
const unsupportedLabel = {
color: 'rgba(255, 255, 255, 0.4)',
fontSize: 12,
fontStyle: 'italic',
};
const notEditableBackground = {
backgroundColor: 'rgba(255, 0, 0, 0.2)',
borderRadius: 3,
padding: '0 4px',
};
const TimelineFieldValue = ({ field, onSave, onDragValueChange, onDragEnd, propStatus, canUpdate, effectiveValue, codeValue, }) => {
const wrapperStyle = canUpdate === null || canUpdate === false
? notEditableBackground
: undefined;
if (!field.supported) {
return jsx_runtime_1.jsx("span", { style: unsupportedLabel, children: "unsupported" });
}
if (propStatus !== null && !propStatus.canUpdate) {
if (propStatus.reason === 'computed') {
return jsx_runtime_1.jsx("span", { style: unsupportedLabel, children: "computed" });
}
throw new Error(`Unsupported prop status: ${propStatus.reason}`);
}
if (propStatus === null) {
return (jsx_runtime_1.jsx("span", { style: notEditableBackground, children: jsx_runtime_1.jsx("span", { style: unsupportedLabel, children: "error" }) }));
}
if (field.typeName === 'number') {
return (jsx_runtime_1.jsx("span", { style: wrapperStyle, children: jsx_runtime_1.jsx(TimelineNumberField_1.TimelineNumberField, { field: field, effectiveValue: effectiveValue, canUpdate: canUpdate, onSave: onSave, codeValue: codeValue, onDragValueChange: onDragValueChange, onDragEnd: onDragEnd }) }));
}
if (field.typeName === 'rotation') {
return (jsx_runtime_1.jsx("span", { style: wrapperStyle, children: jsx_runtime_1.jsx(TimelineRotationField_1.TimelineRotationField, { field: field, effectiveValue: effectiveValue, codeValue: codeValue, canUpdate: canUpdate, onSave: onSave, onDragValueChange: onDragValueChange, onDragEnd: onDragEnd }) }));
}
if (field.typeName === 'translate') {
return (jsx_runtime_1.jsx("span", { style: wrapperStyle, children: jsx_runtime_1.jsx(TimelineTranslateField_1.TimelineTranslateField, { field: field, effectiveValue: effectiveValue, codeValue: codeValue, canUpdate: canUpdate, onSave: onSave, onDragValueChange: onDragValueChange, onDragEnd: onDragEnd }) }));
}
if (field.typeName === 'boolean') {
return (jsx_runtime_1.jsx("span", { style: wrapperStyle, children: jsx_runtime_1.jsx(TimelineBooleanField_1.TimelineBooleanField, { field: field, codeValue: codeValue, canUpdate: canUpdate, onSave: onSave, effectiveValue: effectiveValue }) }));
}
return (jsx_runtime_1.jsx("span", { style: { ...unsupportedLabel, fontStyle: 'normal' }, children: String(effectiveValue) }));
};
exports.TimelineFieldValue = TimelineFieldValue;