@remotion/studio-server 4.0.490 → 4.0.491
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/better-opn/index.d.ts +4 -0
- package/dist/better-opn/index.js +152 -31
- package/dist/codemods/paste-effects.d.ts +2 -1
- package/dist/codemods/paste-effects.js +33 -6
- package/dist/codemods/update-keyframes/update-keyframes.d.ts +9 -5
- package/dist/codemods/update-keyframes/update-keyframes.js +88 -42
- package/dist/codemods/update-nested-prop.d.ts +3 -2
- package/dist/codemods/update-nested-prop.js +17 -4
- package/dist/codemods/update-sequence-props/update-sequence-props.d.ts +6 -3
- package/dist/codemods/update-sequence-props/update-sequence-props.js +51 -10
- package/dist/helpers/video-config-numeric-expression.d.ts +12 -0
- package/dist/helpers/video-config-numeric-expression.js +152 -0
- package/dist/helpers/video-config-values.d.ts +7 -0
- package/dist/helpers/video-config-values.js +84 -0
- package/dist/index.d.ts +1 -2
- package/dist/preview-server/element-install-state.d.ts +1 -0
- package/dist/preview-server/routes/add-effect-keyframe.js +6 -0
- package/dist/preview-server/routes/add-keyframes.js +2 -0
- package/dist/preview-server/routes/add-sequence-keyframe.js +2 -0
- package/dist/preview-server/routes/apply-codemod.d.ts +1 -0
- package/dist/preview-server/routes/apply-codemod.js +62 -13
- package/dist/preview-server/routes/can-update-effect-props.d.ts +8 -4
- package/dist/preview-server/routes/can-update-effect-props.js +26 -5
- package/dist/preview-server/routes/can-update-sequence-props.d.ts +9 -5
- package/dist/preview-server/routes/can-update-sequence-props.js +71 -30
- package/dist/preview-server/routes/delete-keyframes.js +8 -0
- package/dist/preview-server/routes/move-keyframes.js +2 -0
- package/dist/preview-server/routes/paste-effects.js +2 -1
- package/dist/preview-server/routes/save-effect-props.js +5 -0
- package/dist/preview-server/routes/save-sequence-props.js +4 -0
- package/dist/preview-server/routes/subscribe-to-sequence-props.js +2 -1
- package/dist/preview-server/routes/unsubscribe-from-sequence-props.js +1 -0
- package/dist/preview-server/routes/update-effect-keyframe-settings.js +6 -0
- package/dist/preview-server/routes/update-element-install-target.js +15 -1
- package/dist/preview-server/routes/update-sequence-keyframe-settings.js +2 -0
- package/dist/preview-server/sequence-props-watchers.d.ts +5 -3
- package/dist/preview-server/sequence-props-watchers.js +14 -5
- package/dist/preview-server/start-server.d.ts +0 -1
- package/dist/preview-server/start-server.js +0 -1
- package/dist/routes.js +2 -0
- package/dist/start-studio.d.ts +1 -2
- package/dist/start-studio.js +1 -2
- package/package.json +6 -6
|
@@ -38,6 +38,8 @@ const studio_shared_1 = require("@remotion/studio-shared");
|
|
|
38
38
|
const recast = __importStar(require("recast"));
|
|
39
39
|
const get_ast_node_path_1 = require("../../helpers/get-ast-node-path");
|
|
40
40
|
const parse_keyframe_easing_expression_1 = require("../../helpers/parse-keyframe-easing-expression");
|
|
41
|
+
const video_config_numeric_expression_1 = require("../../helpers/video-config-numeric-expression");
|
|
42
|
+
const video_config_values_1 = require("../../helpers/video-config-values");
|
|
41
43
|
const can_update_sequence_props_1 = require("../../preview-server/routes/can-update-sequence-props");
|
|
42
44
|
const format_file_content_1 = require("../format-file-content");
|
|
43
45
|
const parse_ast_1 = require("../parse-ast");
|
|
@@ -109,23 +111,9 @@ const getSupportedCallArgument = (arg) => {
|
|
|
109
111
|
}
|
|
110
112
|
return arg;
|
|
111
113
|
};
|
|
112
|
-
const
|
|
113
|
-
if (node.type === 'NumericLiteral') {
|
|
114
|
-
return node.value;
|
|
115
|
-
}
|
|
116
|
-
if (node.type === 'UnaryExpression' &&
|
|
117
|
-
(node.operator === '-' || node.operator === '+') &&
|
|
118
|
-
node.argument.type === 'NumericLiteral') {
|
|
119
|
-
return node.operator === '-' ? -node.argument.value : node.argument.value;
|
|
120
|
-
}
|
|
121
|
-
if (node.type === 'TSAsExpression') {
|
|
122
|
-
return getNumericValue(node.expression);
|
|
123
|
-
}
|
|
124
|
-
return null;
|
|
125
|
-
};
|
|
126
|
-
const getInterpolationExpression = (node) => {
|
|
114
|
+
const getInterpolationExpression = (node, videoConfigValues) => {
|
|
127
115
|
if (node.type === 'TSAsExpression') {
|
|
128
|
-
return getInterpolationExpression(node.expression);
|
|
116
|
+
return getInterpolationExpression(node.expression, videoConfigValues);
|
|
129
117
|
}
|
|
130
118
|
if (node.type !== 'CallExpression' ||
|
|
131
119
|
node.callee.type !== 'Identifier' ||
|
|
@@ -153,12 +141,18 @@ const getInterpolationExpression = (node) => {
|
|
|
153
141
|
outputElement.type === 'SpreadElement') {
|
|
154
142
|
return null;
|
|
155
143
|
}
|
|
156
|
-
const
|
|
157
|
-
|
|
144
|
+
const frameExpression = (0, video_config_numeric_expression_1.parseVideoConfigNumericExpression)({
|
|
145
|
+
node: inputElement,
|
|
146
|
+
videoConfigValues,
|
|
147
|
+
});
|
|
148
|
+
if (frameExpression === null || !(0, can_update_sequence_props_1.isStaticValue)(outputElement)) {
|
|
158
149
|
return null;
|
|
159
150
|
}
|
|
160
151
|
keyframes.push({
|
|
161
|
-
frame,
|
|
152
|
+
frame: frameExpression.value,
|
|
153
|
+
frameExpression: inputElement,
|
|
154
|
+
frameNumericExpression: frameExpression,
|
|
155
|
+
originalFrame: frameExpression.value,
|
|
162
156
|
output: outputElement,
|
|
163
157
|
value: (0, can_update_sequence_props_1.extractStaticValue)(outputElement),
|
|
164
158
|
});
|
|
@@ -463,10 +457,10 @@ const validateOutput = (output) => {
|
|
|
463
457
|
}
|
|
464
458
|
throw new Error('Cannot update keyframe settings: output must be "linear" or "perceptual-scale"');
|
|
465
459
|
};
|
|
466
|
-
const updateKeyframeSettings = ({ expression, clamping, posterize, output, }) => {
|
|
460
|
+
const updateKeyframeSettings = ({ expression, clamping, posterize, output, videoConfigValues, }) => {
|
|
467
461
|
validatePosterize(posterize);
|
|
468
462
|
validateOutput(output);
|
|
469
|
-
const existing = getInterpolationExpression(expression);
|
|
463
|
+
const existing = getInterpolationExpression(expression, videoConfigValues);
|
|
470
464
|
if (!existing) {
|
|
471
465
|
throw new Error('Cannot update keyframe settings on non-keyframed value');
|
|
472
466
|
}
|
|
@@ -523,8 +517,8 @@ const updateKeyframeSettings = ({ expression, clamping, posterize, output, }) =>
|
|
|
523
517
|
keyframes: existing.keyframes,
|
|
524
518
|
});
|
|
525
519
|
};
|
|
526
|
-
const updateKeyframeEasing = ({ expression, segmentIndex, easing, }) => {
|
|
527
|
-
const existing = getInterpolationExpression(expression);
|
|
520
|
+
const updateKeyframeEasing = ({ expression, segmentIndex, easing, videoConfigValues, }) => {
|
|
521
|
+
const existing = getInterpolationExpression(expression, videoConfigValues);
|
|
528
522
|
if (!existing) {
|
|
529
523
|
throw new Error('Cannot update easing on non-keyframed value');
|
|
530
524
|
}
|
|
@@ -567,7 +561,12 @@ const createInterpolateExpression = ({ callee, input, extraArgs, keyframes, }) =
|
|
|
567
561
|
const sortedKeyframes = [...keyframes].sort((first, second) => first.frame - second.frame);
|
|
568
562
|
return b.callExpression(callee, [
|
|
569
563
|
input,
|
|
570
|
-
b.arrayExpression(sortedKeyframes.map((keyframe) =>
|
|
564
|
+
b.arrayExpression(sortedKeyframes.map((keyframe) => keyframe.frame === keyframe.originalFrame
|
|
565
|
+
? keyframe.frameExpression
|
|
566
|
+
: (0, video_config_numeric_expression_1.updateVideoConfigNumericExpression)({
|
|
567
|
+
expression: keyframe.frameNumericExpression,
|
|
568
|
+
value: keyframe.frame,
|
|
569
|
+
}))),
|
|
571
570
|
b.arrayExpression(sortedKeyframes.map((keyframe) => keyframe.output)),
|
|
572
571
|
...extraArgs,
|
|
573
572
|
]);
|
|
@@ -577,11 +576,12 @@ const noIntroducedIdentifiers = {
|
|
|
577
576
|
needsFrameHook: false,
|
|
578
577
|
needsEasingImport: false,
|
|
579
578
|
};
|
|
580
|
-
const addKeyframe = ({ expression, key, frame, value, schema, }) => {
|
|
579
|
+
const addKeyframe = ({ expression, key, frame, value, schema, videoConfigValues, }) => {
|
|
580
|
+
var _a;
|
|
581
581
|
if (!(0, studio_shared_1.isSchemaFieldKeyframable)({ schema, key })) {
|
|
582
582
|
throw new Error(`Cannot add keyframe: "${key}" is not keyframable`);
|
|
583
583
|
}
|
|
584
|
-
const existing = getInterpolationExpression(expression);
|
|
584
|
+
const existing = getInterpolationExpression(expression, videoConfigValues);
|
|
585
585
|
const newOutput = (0, update_nested_prop_1.parseValueExpression)(value);
|
|
586
586
|
if (existing) {
|
|
587
587
|
const existingCalleeName = existing.callee.type === 'Identifier'
|
|
@@ -594,9 +594,19 @@ const addKeyframe = ({ expression, key, frame, value, schema, }) => {
|
|
|
594
594
|
const nextCalleeName = schemaCalleeName !== null && schemaCalleeName !== void 0 ? schemaCalleeName : existingCalleeName;
|
|
595
595
|
const existingIndex = existing.keyframes.findIndex((keyframe) => keyframe.frame === frame);
|
|
596
596
|
const nextKeyframes = existingIndex === -1
|
|
597
|
-
? [
|
|
597
|
+
? [
|
|
598
|
+
...existing.keyframes,
|
|
599
|
+
{
|
|
600
|
+
frame,
|
|
601
|
+
frameExpression: createFrameExpression(frame),
|
|
602
|
+
frameNumericExpression: { type: 'literal', value: frame },
|
|
603
|
+
originalFrame: frame,
|
|
604
|
+
output: newOutput,
|
|
605
|
+
value,
|
|
606
|
+
},
|
|
607
|
+
]
|
|
598
608
|
: existing.keyframes.map((keyframe, index) => index === existingIndex
|
|
599
|
-
? {
|
|
609
|
+
? { ...keyframe, output: newOutput, value }
|
|
600
610
|
: keyframe);
|
|
601
611
|
const normalizedEasing = existingIndex === -1
|
|
602
612
|
? normalizeEasingAfterAddingKeyframe({
|
|
@@ -625,11 +635,24 @@ const addKeyframe = ({ expression, key, frame, value, schema, }) => {
|
|
|
625
635
|
},
|
|
626
636
|
};
|
|
627
637
|
}
|
|
628
|
-
|
|
638
|
+
const staticNumericExpression = (0, video_config_numeric_expression_1.parseVideoConfigNumericExpression)({
|
|
639
|
+
node: expression,
|
|
640
|
+
videoConfigValues,
|
|
641
|
+
});
|
|
642
|
+
if (!(0, can_update_sequence_props_1.isStaticValue)(expression) && staticNumericExpression === null) {
|
|
629
643
|
throw new Error('Cannot add keyframe to computed expression');
|
|
630
644
|
}
|
|
631
|
-
const staticValue = (0, can_update_sequence_props_1.extractStaticValue)(expression);
|
|
632
|
-
const keyframes = [
|
|
645
|
+
const staticValue = (_a = staticNumericExpression === null || staticNumericExpression === void 0 ? void 0 : staticNumericExpression.value) !== null && _a !== void 0 ? _a : (0, can_update_sequence_props_1.extractStaticValue)(expression);
|
|
646
|
+
const keyframes = [
|
|
647
|
+
{
|
|
648
|
+
frame,
|
|
649
|
+
frameExpression: createFrameExpression(frame),
|
|
650
|
+
frameNumericExpression: { type: 'literal', value: frame },
|
|
651
|
+
originalFrame: frame,
|
|
652
|
+
output: newOutput,
|
|
653
|
+
value,
|
|
654
|
+
},
|
|
655
|
+
];
|
|
633
656
|
const callee = getInterpolationCalleeForValues({
|
|
634
657
|
schema,
|
|
635
658
|
key,
|
|
@@ -659,8 +682,8 @@ const addKeyframe = ({ expression, key, frame, value, schema, }) => {
|
|
|
659
682
|
},
|
|
660
683
|
};
|
|
661
684
|
};
|
|
662
|
-
const removeKeyframe = ({ expression, frame, }) => {
|
|
663
|
-
const existing = getInterpolationExpression(expression);
|
|
685
|
+
const removeKeyframe = ({ expression, frame, videoConfigValues, }) => {
|
|
686
|
+
const existing = getInterpolationExpression(expression, videoConfigValues);
|
|
664
687
|
if (!existing) {
|
|
665
688
|
throw new Error('Cannot remove keyframe from non-interpolated expression');
|
|
666
689
|
}
|
|
@@ -694,8 +717,8 @@ const removeKeyframe = ({ expression, frame, }) => {
|
|
|
694
717
|
},
|
|
695
718
|
};
|
|
696
719
|
};
|
|
697
|
-
const moveKeyframes = ({ expression, moves, }) => {
|
|
698
|
-
const existing = getInterpolationExpression(expression);
|
|
720
|
+
const moveKeyframes = ({ expression, moves, videoConfigValues, }) => {
|
|
721
|
+
const existing = getInterpolationExpression(expression, videoConfigValues);
|
|
699
722
|
if (!existing) {
|
|
700
723
|
throw new Error('Cannot move keyframe in non-interpolated expression');
|
|
701
724
|
}
|
|
@@ -753,7 +776,7 @@ const moveKeyframes = ({ expression, moves, }) => {
|
|
|
753
776
|
keyframes: nextKeyframes,
|
|
754
777
|
});
|
|
755
778
|
};
|
|
756
|
-
const applyKeyframeOperation = ({ expression, key, operation, schema, }) => {
|
|
779
|
+
const applyKeyframeOperation = ({ expression, key, operation, schema, videoConfigValues, }) => {
|
|
757
780
|
if (operation.type === 'add') {
|
|
758
781
|
return addKeyframe({
|
|
759
782
|
expression,
|
|
@@ -761,6 +784,7 @@ const applyKeyframeOperation = ({ expression, key, operation, schema, }) => {
|
|
|
761
784
|
frame: operation.frame,
|
|
762
785
|
value: operation.value,
|
|
763
786
|
schema,
|
|
787
|
+
videoConfigValues,
|
|
764
788
|
});
|
|
765
789
|
}
|
|
766
790
|
if (operation.type === 'settings') {
|
|
@@ -770,6 +794,7 @@ const applyKeyframeOperation = ({ expression, key, operation, schema, }) => {
|
|
|
770
794
|
clamping: operation.clamping,
|
|
771
795
|
posterize: operation.posterize,
|
|
772
796
|
output: operation.output,
|
|
797
|
+
videoConfigValues,
|
|
773
798
|
}),
|
|
774
799
|
introduced: noIntroducedIdentifiers,
|
|
775
800
|
};
|
|
@@ -779,6 +804,7 @@ const applyKeyframeOperation = ({ expression, key, operation, schema, }) => {
|
|
|
779
804
|
expression,
|
|
780
805
|
segmentIndex: operation.segmentIndex,
|
|
781
806
|
easing: operation.easing,
|
|
807
|
+
videoConfigValues,
|
|
782
808
|
});
|
|
783
809
|
return {
|
|
784
810
|
expression: updated.expression,
|
|
@@ -790,11 +816,19 @@ const applyKeyframeOperation = ({ expression, key, operation, schema, }) => {
|
|
|
790
816
|
}
|
|
791
817
|
if (operation.type === 'move') {
|
|
792
818
|
return {
|
|
793
|
-
expression: moveKeyframes({
|
|
819
|
+
expression: moveKeyframes({
|
|
820
|
+
expression,
|
|
821
|
+
moves: operation.moves,
|
|
822
|
+
videoConfigValues,
|
|
823
|
+
}),
|
|
794
824
|
introduced: noIntroducedIdentifiers,
|
|
795
825
|
};
|
|
796
826
|
}
|
|
797
|
-
return removeKeyframe({
|
|
827
|
+
return removeKeyframe({
|
|
828
|
+
expression,
|
|
829
|
+
frame: operation.frame,
|
|
830
|
+
videoConfigValues,
|
|
831
|
+
});
|
|
798
832
|
};
|
|
799
833
|
const getExpressionFromJsxAttribute = (attr) => {
|
|
800
834
|
if (!attr.value) {
|
|
@@ -992,10 +1026,14 @@ const getEffectPropsObjectExpression = (call) => {
|
|
|
992
1026
|
}
|
|
993
1027
|
return call.arguments[0];
|
|
994
1028
|
};
|
|
995
|
-
const updateSequenceKeyframesAst = ({ input, nodePath, updates, schema, }) => {
|
|
1029
|
+
const updateSequenceKeyframesAst = ({ input, nodePath, updates, schema, videoConfigValues, }) => {
|
|
996
1030
|
var _a;
|
|
997
1031
|
var _b;
|
|
998
1032
|
const ast = (0, parse_ast_1.parseAst)(input);
|
|
1033
|
+
const videoConfigIdentifierValues = (0, video_config_values_1.getVideoConfigIdentifierValues)({
|
|
1034
|
+
ast,
|
|
1035
|
+
videoConfigValues,
|
|
1036
|
+
});
|
|
999
1037
|
const jsxPath = (0, get_ast_node_path_1.getAstNodePath)(ast, nodePath);
|
|
1000
1038
|
const node = (0, can_update_sequence_props_1.findJsxElementAtNodePath)(ast, nodePath);
|
|
1001
1039
|
if (!node || !jsxPath) {
|
|
@@ -1028,6 +1066,7 @@ const updateSequenceKeyframesAst = ({ input, nodePath, updates, schema, }) => {
|
|
|
1028
1066
|
key: update.key,
|
|
1029
1067
|
operation: update.operation,
|
|
1030
1068
|
schema: schema !== null && schema !== void 0 ? schema : null,
|
|
1069
|
+
videoConfigValues: videoConfigIdentifierValues,
|
|
1031
1070
|
});
|
|
1032
1071
|
newValueStrings.push(recast.print(nextExpression).code);
|
|
1033
1072
|
prop.setExpression(nextExpression);
|
|
@@ -1062,12 +1101,13 @@ const updateSequenceKeyframesAst = ({ input, nodePath, updates, schema, }) => {
|
|
|
1062
1101
|
};
|
|
1063
1102
|
};
|
|
1064
1103
|
exports.updateSequenceKeyframesAst = updateSequenceKeyframesAst;
|
|
1065
|
-
const updateSequenceKeyframes = async ({ input, nodePath, updates, schema, prettierConfigOverride, }) => {
|
|
1104
|
+
const updateSequenceKeyframes = async ({ input, nodePath, updates, schema, prettierConfigOverride, videoConfigValues, }) => {
|
|
1066
1105
|
const { serialized, oldValueStrings, newValueStrings, logLine, updatedNodePath, } = (0, exports.updateSequenceKeyframesAst)({
|
|
1067
1106
|
input,
|
|
1068
1107
|
nodePath,
|
|
1069
1108
|
updates,
|
|
1070
1109
|
schema,
|
|
1110
|
+
videoConfigValues,
|
|
1071
1111
|
});
|
|
1072
1112
|
const { output, formatted } = await (0, format_file_content_1.formatFileContent)({
|
|
1073
1113
|
input: serialized,
|
|
@@ -1087,10 +1127,14 @@ const updateSequenceKeyframes = async ({ input, nodePath, updates, schema, prett
|
|
|
1087
1127
|
};
|
|
1088
1128
|
};
|
|
1089
1129
|
exports.updateSequenceKeyframes = updateSequenceKeyframes;
|
|
1090
|
-
const updateEffectKeyframesAst = ({ input, sequenceNodePath, effectIndex, updates, schema, }) => {
|
|
1130
|
+
const updateEffectKeyframesAst = ({ input, sequenceNodePath, effectIndex, updates, schema, videoConfigValues, }) => {
|
|
1091
1131
|
var _a, _b;
|
|
1092
1132
|
var _c, _d, _e;
|
|
1093
1133
|
const ast = (0, parse_ast_1.parseAst)(input);
|
|
1134
|
+
const videoConfigIdentifierValues = (0, video_config_values_1.getVideoConfigIdentifierValues)({
|
|
1135
|
+
ast,
|
|
1136
|
+
videoConfigValues,
|
|
1137
|
+
});
|
|
1094
1138
|
const jsxPath = (0, get_ast_node_path_1.getAstNodePath)(ast, sequenceNodePath);
|
|
1095
1139
|
const jsx = (0, can_update_sequence_props_1.findJsxElementAtNodePath)(ast, sequenceNodePath);
|
|
1096
1140
|
if (!jsx || !jsxPath) {
|
|
@@ -1130,6 +1174,7 @@ const updateEffectKeyframesAst = ({ input, sequenceNodePath, effectIndex, update
|
|
|
1130
1174
|
key: update.key,
|
|
1131
1175
|
operation: update.operation,
|
|
1132
1176
|
schema: schema !== null && schema !== void 0 ? schema : null,
|
|
1177
|
+
videoConfigValues: videoConfigIdentifierValues,
|
|
1133
1178
|
});
|
|
1134
1179
|
newValueStrings.push(recast.print(nextExpression).code);
|
|
1135
1180
|
prop.setExpression(nextExpression);
|
|
@@ -1165,13 +1210,14 @@ const updateEffectKeyframesAst = ({ input, sequenceNodePath, effectIndex, update
|
|
|
1165
1210
|
};
|
|
1166
1211
|
};
|
|
1167
1212
|
exports.updateEffectKeyframesAst = updateEffectKeyframesAst;
|
|
1168
|
-
const updateEffectKeyframes = async ({ input, sequenceNodePath, effectIndex, updates, schema, prettierConfigOverride, }) => {
|
|
1213
|
+
const updateEffectKeyframes = async ({ input, sequenceNodePath, effectIndex, updates, schema, prettierConfigOverride, videoConfigValues, }) => {
|
|
1169
1214
|
const { serialized, oldValueStrings, newValueStrings, logLine, effectCallee, updatedSequenceNodePath, } = (0, exports.updateEffectKeyframesAst)({
|
|
1170
1215
|
input,
|
|
1171
1216
|
sequenceNodePath,
|
|
1172
1217
|
effectIndex,
|
|
1173
1218
|
updates,
|
|
1174
1219
|
schema,
|
|
1220
|
+
videoConfigValues,
|
|
1175
1221
|
});
|
|
1176
1222
|
const { output, formatted } = await (0, format_file_content_1.formatFileContent)({
|
|
1177
1223
|
input: serialized,
|
|
@@ -1,11 +1,12 @@
|
|
|
1
|
-
import type { JSXOpeningElement } from '@babel/types';
|
|
1
|
+
import type { JSXOpeningElement, Expression } from '@babel/types';
|
|
2
2
|
import type { ExpressionKind } from 'ast-types/lib/gen/kinds';
|
|
3
3
|
export declare const parseValueExpression: (value: unknown) => ExpressionKind;
|
|
4
|
-
export declare const updateNestedProp: ({ node, parentKey, childKey, value, defaultValue, isDefault, }: {
|
|
4
|
+
export declare const updateNestedProp: ({ node, parentKey, childKey, value, defaultValue, isDefault, createValueExpression, }: {
|
|
5
5
|
node: JSXOpeningElement;
|
|
6
6
|
parentKey: string;
|
|
7
7
|
childKey: string;
|
|
8
8
|
value: unknown;
|
|
9
9
|
defaultValue: unknown;
|
|
10
10
|
isDefault: boolean;
|
|
11
|
+
createValueExpression: ((existing: Expression | null) => ExpressionKind) | null;
|
|
11
12
|
}) => string;
|
|
@@ -116,12 +116,15 @@ const removeNestedProp = ({ attr, attrIndex, attributes, childKey, }) => {
|
|
|
116
116
|
attributes.splice(attrIndex, 1);
|
|
117
117
|
}
|
|
118
118
|
};
|
|
119
|
-
const setNestedProp = ({ attr, attributes, parentKey, childKey, value, }) => {
|
|
120
|
-
|
|
119
|
+
const setNestedProp = ({ attr, attributes, parentKey, childKey, value, createValueExpression, }) => {
|
|
120
|
+
var _a;
|
|
121
121
|
if (attr) {
|
|
122
122
|
const objExpr = getObjectExpression(attr);
|
|
123
123
|
if (objExpr) {
|
|
124
124
|
const { prop } = findObjectProperty(objExpr, childKey);
|
|
125
|
+
const parsedValue = createValueExpression
|
|
126
|
+
? createValueExpression((_a = prop === null || prop === void 0 ? void 0 : prop.value) !== null && _a !== void 0 ? _a : null)
|
|
127
|
+
: (0, exports.parseValueExpression)(value);
|
|
125
128
|
if (prop) {
|
|
126
129
|
prop.value = parsedValue;
|
|
127
130
|
}
|
|
@@ -131,6 +134,9 @@ const setNestedProp = ({ attr, attributes, parentKey, childKey, value, }) => {
|
|
|
131
134
|
}
|
|
132
135
|
}
|
|
133
136
|
else {
|
|
137
|
+
const parsedValue = createValueExpression
|
|
138
|
+
? createValueExpression(null)
|
|
139
|
+
: (0, exports.parseValueExpression)(value);
|
|
134
140
|
const objExpr = b.objectExpression([
|
|
135
141
|
b.objectProperty(b.identifier(childKey), parsedValue),
|
|
136
142
|
]);
|
|
@@ -138,7 +144,7 @@ const setNestedProp = ({ attr, attributes, parentKey, childKey, value, }) => {
|
|
|
138
144
|
attributes.push(newAttr);
|
|
139
145
|
}
|
|
140
146
|
};
|
|
141
|
-
const updateNestedProp = ({ node, parentKey, childKey, value, defaultValue, isDefault, }) => {
|
|
147
|
+
const updateNestedProp = ({ node, parentKey, childKey, value, defaultValue, isDefault, createValueExpression, }) => {
|
|
142
148
|
if (!node.attributes) {
|
|
143
149
|
node.attributes = [];
|
|
144
150
|
}
|
|
@@ -149,7 +155,14 @@ const updateNestedProp = ({ node, parentKey, childKey, value, defaultValue, isDe
|
|
|
149
155
|
removeNestedProp({ attr, attrIndex, attributes, childKey });
|
|
150
156
|
}
|
|
151
157
|
else {
|
|
152
|
-
setNestedProp({
|
|
158
|
+
setNestedProp({
|
|
159
|
+
attr,
|
|
160
|
+
attributes,
|
|
161
|
+
parentKey,
|
|
162
|
+
childKey,
|
|
163
|
+
value,
|
|
164
|
+
createValueExpression,
|
|
165
|
+
});
|
|
153
166
|
}
|
|
154
167
|
return oldValueString;
|
|
155
168
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { GoogleFontSourceEdit } from '@remotion/studio-shared';
|
|
2
|
-
import type { InteractivitySchema, SequenceNodePath } from 'remotion';
|
|
2
|
+
import type { InteractivitySchema, SequenceNodePath, VideoConfigValues } from 'remotion';
|
|
3
3
|
export type SequencePropUpdate = {
|
|
4
4
|
key: string;
|
|
5
5
|
value: unknown;
|
|
@@ -14,6 +14,7 @@ export type SequencePropsNodeUpdate = {
|
|
|
14
14
|
nodePath: SequenceNodePath;
|
|
15
15
|
updates: SequencePropUpdate[];
|
|
16
16
|
schema: InteractivitySchema;
|
|
17
|
+
videoConfigValues: VideoConfigValues | null;
|
|
17
18
|
};
|
|
18
19
|
export type SequencePropsNodeUpdateResult = {
|
|
19
20
|
oldValueStrings: string[];
|
|
@@ -33,11 +34,12 @@ type UpdateSequencePropsResult = {
|
|
|
33
34
|
logLine: number;
|
|
34
35
|
removedProps: RemovedProp[];
|
|
35
36
|
};
|
|
36
|
-
export declare const updateSequencePropsAst: ({ input, nodePath, updates, schema, }: {
|
|
37
|
+
export declare const updateSequencePropsAst: ({ input, nodePath, updates, schema, videoConfigValues, }: {
|
|
37
38
|
input: string;
|
|
38
39
|
nodePath: SequenceNodePath;
|
|
39
40
|
updates: SequencePropUpdate[];
|
|
40
41
|
schema: InteractivitySchema;
|
|
42
|
+
videoConfigValues: VideoConfigValues | null;
|
|
41
43
|
}) => {
|
|
42
44
|
serialized: string;
|
|
43
45
|
oldValueStrings: string[];
|
|
@@ -49,11 +51,12 @@ export declare const updateMultipleSequenceProps: ({ input, changes, prettierCon
|
|
|
49
51
|
changes: SequencePropsNodeUpdate[];
|
|
50
52
|
prettierConfigOverride: PrettierConfigOverride;
|
|
51
53
|
}) => Promise<UpdateMultipleSequencePropsResult>;
|
|
52
|
-
export declare const updateSequenceProps: ({ input, nodePath, updates, schema, prettierConfigOverride, }: {
|
|
54
|
+
export declare const updateSequenceProps: ({ input, nodePath, updates, schema, prettierConfigOverride, videoConfigValues, }: {
|
|
53
55
|
input: string;
|
|
54
56
|
nodePath: SequenceNodePath;
|
|
55
57
|
updates: SequencePropUpdate[];
|
|
56
58
|
schema: InteractivitySchema;
|
|
57
59
|
prettierConfigOverride: PrettierConfigOverride;
|
|
60
|
+
videoConfigValues: VideoConfigValues | null;
|
|
58
61
|
}) => Promise<UpdateSequencePropsResult>;
|
|
59
62
|
export {};
|
|
@@ -36,6 +36,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
36
36
|
exports.updateSequenceProps = exports.updateMultipleSequenceProps = exports.updateSequencePropsAst = void 0;
|
|
37
37
|
const recast = __importStar(require("recast"));
|
|
38
38
|
const no_react_1 = require("remotion/no-react");
|
|
39
|
+
const video_config_numeric_expression_1 = require("../../helpers/video-config-numeric-expression");
|
|
40
|
+
const video_config_values_1 = require("../../helpers/video-config-values");
|
|
39
41
|
const can_update_sequence_props_1 = require("../../preview-server/routes/can-update-sequence-props");
|
|
40
42
|
const format_file_content_1 = require("../format-file-content");
|
|
41
43
|
const parse_ast_1 = require("../parse-ast");
|
|
@@ -60,6 +62,7 @@ const removeVariantKey = ({ node, variantKey, }) => {
|
|
|
60
62
|
value: undefined,
|
|
61
63
|
defaultValue: null,
|
|
62
64
|
isDefault: true,
|
|
65
|
+
createValueExpression: null,
|
|
63
66
|
});
|
|
64
67
|
};
|
|
65
68
|
const snapshotTopLevelAttrs = (node) => {
|
|
@@ -471,17 +474,32 @@ const applyGoogleFontSourceEdits = ({ ast, updates, }) => {
|
|
|
471
474
|
removeUnusedGoogleFontSourceEdits(ast);
|
|
472
475
|
}
|
|
473
476
|
};
|
|
474
|
-
const updateSequencePropsNode = ({ jsxElement, updates, schema, }) => {
|
|
475
|
-
var _a, _b, _c;
|
|
476
|
-
var
|
|
477
|
+
const updateSequencePropsNode = ({ jsxElement, updates, schema, videoConfigValues, }) => {
|
|
478
|
+
var _a, _b, _c, _d;
|
|
479
|
+
var _e, _f;
|
|
477
480
|
const node = jsxElement.openingElement;
|
|
478
|
-
const logLine = (
|
|
481
|
+
const logLine = (_e = (_a = node.loc) === null || _a === void 0 ? void 0 : _a.start.line) !== null && _e !== void 0 ? _e : 1;
|
|
479
482
|
const oldValueStrings = [];
|
|
480
483
|
const initialAttrs = snapshotTopLevelAttrs(node);
|
|
481
484
|
const updatedTopLevelKeys = new Set(updates.map(({ key }) => {
|
|
482
485
|
const dot = key.indexOf('.');
|
|
483
486
|
return dot === -1 ? key : key.slice(0, dot);
|
|
484
487
|
}));
|
|
488
|
+
const createValueExpression = ({ existing, value, }) => {
|
|
489
|
+
if (existing === null || typeof value !== 'number') {
|
|
490
|
+
return (0, update_nested_prop_1.parseValueExpression)(value);
|
|
491
|
+
}
|
|
492
|
+
const expression = (0, video_config_numeric_expression_1.parseVideoConfigNumericExpression)({
|
|
493
|
+
node: existing,
|
|
494
|
+
videoConfigValues,
|
|
495
|
+
});
|
|
496
|
+
if (expression === null) {
|
|
497
|
+
return (0, update_nested_prop_1.parseValueExpression)(value);
|
|
498
|
+
}
|
|
499
|
+
return expression.value === value
|
|
500
|
+
? existing
|
|
501
|
+
: (0, video_config_numeric_expression_1.updateVideoConfigNumericExpression)({ expression, value });
|
|
502
|
+
};
|
|
485
503
|
for (const { key, value, defaultValue } of updates) {
|
|
486
504
|
let oldValueString = '';
|
|
487
505
|
if (key === 'children') {
|
|
@@ -504,6 +522,7 @@ const updateSequencePropsNode = ({ jsxElement, updates, schema, }) => {
|
|
|
504
522
|
value,
|
|
505
523
|
defaultValue,
|
|
506
524
|
isDefault,
|
|
525
|
+
createValueExpression: (existing) => createValueExpression({ existing, value }),
|
|
507
526
|
});
|
|
508
527
|
}
|
|
509
528
|
else {
|
|
@@ -540,7 +559,15 @@ const updateSequencePropsNode = ({ jsxElement, updates, schema, }) => {
|
|
|
540
559
|
}
|
|
541
560
|
}
|
|
542
561
|
else {
|
|
543
|
-
const
|
|
562
|
+
const existingExpression = (attr === null || attr === void 0 ? void 0 : attr.type) === 'JSXAttribute' &&
|
|
563
|
+
((_d = attr.value) === null || _d === void 0 ? void 0 : _d.type) === 'JSXExpressionContainer' &&
|
|
564
|
+
attr.value.expression.type !== 'JSXEmptyExpression'
|
|
565
|
+
? attr.value.expression
|
|
566
|
+
: null;
|
|
567
|
+
const parsed = createValueExpression({
|
|
568
|
+
existing: existingExpression,
|
|
569
|
+
value,
|
|
570
|
+
});
|
|
544
571
|
const newValue = value === true ? null : b.jsxExpressionContainer(parsed);
|
|
545
572
|
if (!attr || attr.type === 'JSXSpreadAttribute') {
|
|
546
573
|
const newAttr = b.jsxAttribute(b.jsxIdentifier(key), newValue);
|
|
@@ -570,7 +597,7 @@ const updateSequencePropsNode = ({ jsxElement, updates, schema, }) => {
|
|
|
570
597
|
}
|
|
571
598
|
}
|
|
572
599
|
const finalAttrNames = new Set();
|
|
573
|
-
for (const a of (
|
|
600
|
+
for (const a of (_f = node.attributes) !== null && _f !== void 0 ? _f : []) {
|
|
574
601
|
if (a.type === 'JSXAttribute' && a.name.type === 'JSXIdentifier') {
|
|
575
602
|
finalAttrNames.add(a.name.name);
|
|
576
603
|
}
|
|
@@ -588,8 +615,12 @@ const updateSequencePropsNode = ({ jsxElement, updates, schema, }) => {
|
|
|
588
615
|
removedProps,
|
|
589
616
|
};
|
|
590
617
|
};
|
|
591
|
-
const updateSequencePropsAst = ({ input, nodePath, updates, schema, }) => {
|
|
618
|
+
const updateSequencePropsAst = ({ input, nodePath, updates, schema, videoConfigValues, }) => {
|
|
592
619
|
const ast = (0, parse_ast_1.parseAst)(input);
|
|
620
|
+
const videoConfigIdentifierValues = (0, video_config_values_1.getVideoConfigIdentifierValues)({
|
|
621
|
+
ast,
|
|
622
|
+
videoConfigValues,
|
|
623
|
+
});
|
|
593
624
|
const jsxElement = (0, can_update_sequence_props_1.findJsxElementNodeAtNodePath)(ast, nodePath);
|
|
594
625
|
if (!jsxElement) {
|
|
595
626
|
throw new Error('Could not find a JSX element at the specified line to update');
|
|
@@ -598,6 +629,7 @@ const updateSequencePropsAst = ({ input, nodePath, updates, schema, }) => {
|
|
|
598
629
|
jsxElement,
|
|
599
630
|
updates,
|
|
600
631
|
schema,
|
|
632
|
+
videoConfigValues: videoConfigIdentifierValues,
|
|
601
633
|
});
|
|
602
634
|
applyGoogleFontSourceEdits({ ast, updates });
|
|
603
635
|
return {
|
|
@@ -611,13 +643,21 @@ exports.updateSequencePropsAst = updateSequencePropsAst;
|
|
|
611
643
|
const updateMultipleSequenceProps = async ({ input, changes, prettierConfigOverride, }) => {
|
|
612
644
|
const ast = (0, parse_ast_1.parseAst)(input);
|
|
613
645
|
const allUpdates = [];
|
|
614
|
-
const results = changes.map(({ nodePath, updates, schema }) => {
|
|
646
|
+
const results = changes.map(({ nodePath, updates, schema, videoConfigValues }) => {
|
|
615
647
|
const jsxElement = (0, can_update_sequence_props_1.findJsxElementNodeAtNodePath)(ast, nodePath);
|
|
616
648
|
if (!jsxElement) {
|
|
617
649
|
throw new Error('Could not find a JSX element at the specified line to update');
|
|
618
650
|
}
|
|
619
651
|
allUpdates.push(...updates);
|
|
620
|
-
return updateSequencePropsNode({
|
|
652
|
+
return updateSequencePropsNode({
|
|
653
|
+
jsxElement,
|
|
654
|
+
updates,
|
|
655
|
+
schema,
|
|
656
|
+
videoConfigValues: (0, video_config_values_1.getVideoConfigIdentifierValues)({
|
|
657
|
+
ast,
|
|
658
|
+
videoConfigValues,
|
|
659
|
+
}),
|
|
660
|
+
});
|
|
621
661
|
});
|
|
622
662
|
applyGoogleFontSourceEdits({ ast, updates: allUpdates });
|
|
623
663
|
const { output, formatted } = await (0, format_file_content_1.formatFileContent)({
|
|
@@ -631,12 +671,13 @@ const updateMultipleSequenceProps = async ({ input, changes, prettierConfigOverr
|
|
|
631
671
|
};
|
|
632
672
|
};
|
|
633
673
|
exports.updateMultipleSequenceProps = updateMultipleSequenceProps;
|
|
634
|
-
const updateSequenceProps = async ({ input, nodePath, updates, schema, prettierConfigOverride, }) => {
|
|
674
|
+
const updateSequenceProps = async ({ input, nodePath, updates, schema, prettierConfigOverride, videoConfigValues, }) => {
|
|
635
675
|
const { serialized, oldValueStrings, logLine, removedProps } = (0, exports.updateSequencePropsAst)({
|
|
636
676
|
input,
|
|
637
677
|
nodePath,
|
|
638
678
|
updates,
|
|
639
679
|
schema,
|
|
680
|
+
videoConfigValues,
|
|
640
681
|
});
|
|
641
682
|
const { output, formatted } = await (0, format_file_content_1.formatFileContent)({
|
|
642
683
|
input: serialized,
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { Expression } from '@babel/types';
|
|
2
|
+
import type { ExpressionKind } from 'ast-types/lib/gen/kinds';
|
|
3
|
+
import type { VideoConfigNumericExpression } from 'remotion';
|
|
4
|
+
import type { VideoConfigIdentifierValues } from './video-config-values';
|
|
5
|
+
export declare const parseVideoConfigNumericExpression: ({ node, videoConfigValues, }: {
|
|
6
|
+
node: Expression;
|
|
7
|
+
videoConfigValues: VideoConfigIdentifierValues;
|
|
8
|
+
}) => VideoConfigNumericExpression | null;
|
|
9
|
+
export declare const updateVideoConfigNumericExpression: ({ expression, value, }: {
|
|
10
|
+
expression: VideoConfigNumericExpression;
|
|
11
|
+
value: number;
|
|
12
|
+
}) => ExpressionKind;
|