@remotion/studio-server 4.0.535 → 4.0.537

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.
Files changed (84) hide show
  1. package/dist/helpers/resolve-composition-component.d.ts +1 -2
  2. package/dist/helpers/resolve-composition-component.js +1 -3
  3. package/dist/preview-server/api-routes.js +2 -0
  4. package/dist/preview-server/default-props-watchers.d.ts +3 -2
  5. package/dist/preview-server/default-props-watchers.js +48 -77
  6. package/dist/preview-server/routes/can-update-default-props.d.ts +9 -3
  7. package/dist/preview-server/routes/can-update-default-props.js +43 -10
  8. package/dist/preview-server/routes/insert-basic-captions.js +1 -2
  9. package/dist/preview-server/routes/insert-composition-element.js +14 -6
  10. package/dist/preview-server/routes/insert-element.js +1 -2
  11. package/dist/preview-server/routes/subscribe-to-default-props.js +2 -1
  12. package/dist/preview-server/routes/unsubscribe-from-sequence-props.d.ts +2 -2
  13. package/dist/preview-server/routes/unsubscribe-from-sequence-props.js +12 -10
  14. package/dist/preview-server/routes/unwrap-node.d.ts +3 -0
  15. package/dist/preview-server/routes/{wrap-jsx-node.js → unwrap-node.js} +24 -23
  16. package/dist/preview-server/routes/update-default-props.js +15 -15
  17. package/dist/preview-server/sequence-props-watchers.js +7 -2
  18. package/dist/preview-server/undo-stack.d.ts +1 -1
  19. package/package.json +8 -8
  20. package/dist/canvas-capture/generate-canvas-capture-composition.d.ts +0 -14
  21. package/dist/canvas-capture/generate-canvas-capture-composition.js +0 -239
  22. package/dist/codemods/add-effect.d.ts +0 -1
  23. package/dist/codemods/add-effect.js +0 -8
  24. package/dist/codemods/apply-codemod-to-file.d.ts +0 -7
  25. package/dist/codemods/apply-codemod-to-file.js +0 -171
  26. package/dist/codemods/apply-visual-control.d.ts +0 -8
  27. package/dist/codemods/apply-visual-control.js +0 -89
  28. package/dist/codemods/delete-effect.d.ts +0 -1
  29. package/dist/codemods/delete-effect.js +0 -6
  30. package/dist/codemods/delete-jsx-node.d.ts +0 -22
  31. package/dist/codemods/delete-jsx-node.js +0 -17
  32. package/dist/codemods/delete-jsx-nodes.d.ts +0 -13
  33. package/dist/codemods/delete-jsx-nodes.js +0 -10
  34. package/dist/codemods/duplicate-composition.d.ts +0 -2
  35. package/dist/codemods/duplicate-composition.js +0 -64
  36. package/dist/codemods/duplicate-effect.d.ts +0 -1
  37. package/dist/codemods/duplicate-effect.js +0 -6
  38. package/dist/codemods/duplicate-jsx-node.d.ts +0 -25
  39. package/dist/codemods/duplicate-jsx-node.js +0 -26
  40. package/dist/codemods/format-file-content.d.ts +0 -7
  41. package/dist/codemods/format-file-content.js +0 -80
  42. package/dist/codemods/format-inline-content.d.ts +0 -18
  43. package/dist/codemods/format-inline-content.js +0 -78
  44. package/dist/codemods/insert-video-layers.d.ts +0 -11
  45. package/dist/codemods/insert-video-layers.js +0 -5
  46. package/dist/codemods/recast-mods.d.ts +0 -13
  47. package/dist/codemods/recast-mods.js +0 -902
  48. package/dist/codemods/reorder-effect.d.ts +0 -1
  49. package/dist/codemods/reorder-effect.js +0 -5
  50. package/dist/codemods/reorder-sequence.d.ts +0 -1
  51. package/dist/codemods/reorder-sequence.js +0 -5
  52. package/dist/codemods/simple-diff.d.ts +0 -5
  53. package/dist/codemods/simple-diff.js +0 -39
  54. package/dist/codemods/split-jsx-sequence.d.ts +0 -27
  55. package/dist/codemods/split-jsx-sequence.js +0 -19
  56. package/dist/codemods/split-video-from-audio.d.ts +0 -1
  57. package/dist/codemods/split-video-from-audio.js +0 -5
  58. package/dist/codemods/update-default-props.d.ts +0 -1
  59. package/dist/codemods/update-default-props.js +0 -6
  60. package/dist/codemods/update-inline-caption-patches.d.ts +0 -1
  61. package/dist/codemods/update-inline-caption-patches.js +0 -5
  62. package/dist/codemods/update-keyframes/ensure-imports-and-frame-hook.d.ts +0 -1
  63. package/dist/codemods/update-keyframes/ensure-imports-and-frame-hook.js +0 -7
  64. package/dist/open-browser-shortcut.d.ts +0 -9
  65. package/dist/open-browser-shortcut.js +0 -121
  66. package/dist/preview-server/hot-middleware/types.d.ts +0 -2
  67. package/dist/preview-server/hot-middleware/types.js +0 -2
  68. package/dist/preview-server/routes/apply-codemod.d.ts +0 -4
  69. package/dist/preview-server/routes/apply-codemod.js +0 -272
  70. package/dist/preview-server/routes/delete-jsx-node.d.ts +0 -3
  71. package/dist/preview-server/routes/delete-jsx-node.js +0 -126
  72. package/dist/preview-server/routes/delete-jsx-nodes.d.ts +0 -3
  73. package/dist/preview-server/routes/delete-jsx-nodes.js +0 -137
  74. package/dist/preview-server/routes/duplicate-jsx-node.d.ts +0 -3
  75. package/dist/preview-server/routes/duplicate-jsx-node.js +0 -118
  76. package/dist/preview-server/routes/insert-jsx-element.d.ts +0 -3
  77. package/dist/preview-server/routes/insert-jsx-element.js +0 -231
  78. package/dist/preview-server/routes/insert-video-layers.d.ts +0 -3
  79. package/dist/preview-server/routes/insert-video-layers.js +0 -68
  80. package/dist/preview-server/routes/split-jsx-sequence.d.ts +0 -3
  81. package/dist/preview-server/routes/split-jsx-sequence.js +0 -117
  82. package/dist/preview-server/routes/update-public-license.d.ts +0 -11
  83. package/dist/preview-server/routes/update-public-license.js +0 -97
  84. package/dist/preview-server/routes/wrap-jsx-node.d.ts +0 -3
@@ -1,902 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || (function () {
19
- var ownKeys = function(o) {
20
- ownKeys = Object.getOwnPropertyNames || function (o) {
21
- var ar = [];
22
- for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
23
- return ar;
24
- };
25
- return ownKeys(o);
26
- };
27
- return function (mod) {
28
- if (mod && mod.__esModule) return mod;
29
- var result = {};
30
- if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
31
- __setModuleDefault(result, mod);
32
- return result;
33
- };
34
- })();
35
- Object.defineProperty(exports, "__esModule", { value: true });
36
- exports.applyCodemod = void 0;
37
- const recast = __importStar(require("recast"));
38
- const apply_visual_control_1 = require("./apply-visual-control");
39
- const delete_jsx_node_1 = require("./delete-jsx-node");
40
- const strip_parenthesized_extra_1 = require("./strip-parenthesized-extra");
41
- const b = recast.types.builders;
42
- const applyCodemod = ({ file, codeMod, }) => {
43
- const changesMade = [];
44
- if (codeMod.type === 'apply-visual-control') {
45
- return (0, apply_visual_control_1.applyVisualControl)({ file, transformation: codeMod, changesMade });
46
- }
47
- if (codeMod.type === 'move-composition-to-folder') {
48
- return moveCompositionToFolder({
49
- file,
50
- transformation: codeMod,
51
- changesMade,
52
- });
53
- }
54
- const body = file.program.body.map((node) => {
55
- return mapAll(node, codeMod, changesMade, null);
56
- });
57
- return {
58
- newAst: {
59
- ...file,
60
- program: {
61
- ...file.program,
62
- body,
63
- },
64
- },
65
- changesMade,
66
- };
67
- };
68
- exports.applyCodemod = applyCodemod;
69
- const mapAll = (node, transformation, changesMade, parentFolderName) => {
70
- if (isRecognizedType(node)) {
71
- return mapRecognizedType(node, transformation, changesMade, parentFolderName);
72
- }
73
- return node;
74
- };
75
- const isRecognizedType = (t) => {
76
- return (t.type === 'ArrowFunctionExpression' ||
77
- t.type === 'FunctionExpression' ||
78
- t.type === 'JSXFragment' ||
79
- t.type === 'JSXElement' ||
80
- t.type === 'BlockStatement' ||
81
- t.type === 'ReturnStatement' ||
82
- t.type === 'VariableDeclaration' ||
83
- t.type === 'FunctionDeclaration' ||
84
- t.type === 'ExportNamedDeclaration' ||
85
- t.type === 'ExportDefaultDeclaration');
86
- };
87
- const mapVariableDeclarator = (variableDeclarator, transformation, changesMade, parentFolderName) => {
88
- return {
89
- ...variableDeclarator,
90
- init: variableDeclarator.init
91
- ? mapAll(variableDeclarator.init, transformation, changesMade, parentFolderName)
92
- : variableDeclarator.init,
93
- };
94
- };
95
- const mapBlockStatement = (blockStatement, transformation, changesMade, parentFolderName) => {
96
- return {
97
- ...blockStatement,
98
- body: blockStatement.body.map((a) => {
99
- return mapAll(a, transformation, changesMade, parentFolderName);
100
- }),
101
- };
102
- };
103
- const mapReturnStatement = (statement, transformation, changesMade, parentFolderName) => {
104
- if (!statement.argument) {
105
- return statement;
106
- }
107
- if (transformation.type === 'new-composition' &&
108
- transformation.folderName === null &&
109
- (statement.argument.type === 'JSXElement' ||
110
- statement.argument.type === 'JSXFragment')) {
111
- return {
112
- ...statement,
113
- argument: addNewCompositionToRootJsx(statement.argument, transformation, changesMade),
114
- };
115
- }
116
- if (transformation.type === 'new-folder' &&
117
- transformation.parentName === null &&
118
- (statement.argument.type === 'JSXElement' ||
119
- statement.argument.type === 'JSXFragment')) {
120
- return {
121
- ...statement,
122
- argument: addNewFolderToRootJsx(statement.argument, transformation, changesMade),
123
- };
124
- }
125
- const replacement = transformLoneJsxElement(statement.argument, transformation, changesMade, parentFolderName);
126
- if (replacement !== null) {
127
- return { ...statement, argument: replacement };
128
- }
129
- return {
130
- ...statement,
131
- argument: mapAll(statement.argument, transformation, changesMade, parentFolderName),
132
- };
133
- };
134
- const nullLiteral = () => ({ type: 'NullLiteral' });
135
- const wrapInJsxFragment = (children) => ({
136
- type: 'JSXFragment',
137
- openingFragment: { type: 'JSXOpeningFragment' },
138
- closingFragment: { type: 'JSXClosingFragment' },
139
- children: children.map((child) => {
140
- if (child.type === 'JSXElement' || child.type === 'JSXFragment') {
141
- return (0, strip_parenthesized_extra_1.stripParenthesizedExtra)(child);
142
- }
143
- return child;
144
- }),
145
- });
146
- const isJsxExpression = (child) => {
147
- return child.type === 'JSXElement' || child.type === 'JSXFragment';
148
- };
149
- const isMeaningfulJsxChild = (child) => {
150
- return child.type !== 'JSXText' || child.value.trim() !== '';
151
- };
152
- const jsxId = (name) => ({ type: 'JSXIdentifier', name });
153
- const jsxAttributeWithString = (name, value) => ({
154
- type: 'JSXAttribute',
155
- name: jsxId(name),
156
- value: { type: 'StringLiteral', value },
157
- });
158
- const jsxAttributeWithExpression = (name, expression) => ({
159
- type: 'JSXAttribute',
160
- name: jsxId(name),
161
- value: {
162
- type: 'JSXExpressionContainer',
163
- expression,
164
- },
165
- });
166
- const newCompositionElement = (transformation) => {
167
- if (transformation.canvasCapture !== null) {
168
- return {
169
- type: 'JSXElement',
170
- openingElement: {
171
- type: 'JSXOpeningElement',
172
- name: jsxId(transformation.componentName),
173
- attributes: [],
174
- selfClosing: true,
175
- },
176
- closingElement: null,
177
- children: [],
178
- };
179
- }
180
- return {
181
- type: 'JSXElement',
182
- openingElement: {
183
- type: 'JSXOpeningElement',
184
- name: jsxId('Composition'),
185
- attributes: [
186
- jsxAttributeWithString('id', transformation.newId),
187
- jsxAttributeWithExpression('component', b.identifier(transformation.componentName)),
188
- jsxAttributeWithExpression('durationInFrames', b.numericLiteral(transformation.newDurationInFrames)),
189
- jsxAttributeWithExpression('fps', b.numericLiteral(transformation.newFps)),
190
- jsxAttributeWithExpression('width', b.numericLiteral(transformation.newWidth)),
191
- jsxAttributeWithExpression('height', b.numericLiteral(transformation.newHeight)),
192
- ],
193
- selfClosing: true,
194
- },
195
- closingElement: null,
196
- children: [],
197
- };
198
- };
199
- const newFolderElement = (transformation) => {
200
- return {
201
- type: 'JSXElement',
202
- openingElement: {
203
- type: 'JSXOpeningElement',
204
- name: jsxId('Folder'),
205
- attributes: [jsxAttributeWithString('name', transformation.folderName)],
206
- selfClosing: true,
207
- },
208
- closingElement: null,
209
- children: [],
210
- };
211
- };
212
- const addNewCompositionToRootJsx = (root, transformation, changesMade) => {
213
- if (changesMade.length > 0) {
214
- return root;
215
- }
216
- changesMade.push({
217
- description: 'Added new composition',
218
- });
219
- if (root.type === 'JSXFragment') {
220
- return {
221
- ...root,
222
- children: [...root.children, newCompositionElement(transformation)],
223
- };
224
- }
225
- return wrapInJsxFragment([root, newCompositionElement(transformation)]);
226
- };
227
- const addNewFolderToRootJsx = (root, transformation, changesMade) => {
228
- if (changesMade.length > 0) {
229
- return root;
230
- }
231
- changesMade.push({
232
- description: 'Added new folder',
233
- });
234
- if (root.type === 'JSXFragment') {
235
- return {
236
- ...root,
237
- children: [...root.children, newFolderElement(transformation)],
238
- };
239
- }
240
- return wrapInJsxFragment([root, newFolderElement(transformation)]);
241
- };
242
- const addNewCompositionToFolder = (folderElement, transformation, changesMade) => {
243
- var _a;
244
- if (changesMade.length > 0) {
245
- return folderElement;
246
- }
247
- changesMade.push({
248
- description: 'Added new composition',
249
- });
250
- return {
251
- ...folderElement,
252
- openingElement: {
253
- ...folderElement.openingElement,
254
- selfClosing: false,
255
- },
256
- closingElement: (_a = folderElement.closingElement) !== null && _a !== void 0 ? _a : {
257
- type: 'JSXClosingElement',
258
- name: folderElement.openingElement.name,
259
- },
260
- children: [
261
- ...folderElement.children,
262
- newCompositionElement(transformation),
263
- ],
264
- };
265
- };
266
- const addNewFolderToFolder = (folderElement, transformation, changesMade) => {
267
- var _a;
268
- if (changesMade.length > 0) {
269
- return folderElement;
270
- }
271
- changesMade.push({
272
- description: 'Added new folder',
273
- });
274
- return {
275
- ...folderElement,
276
- openingElement: {
277
- ...folderElement.openingElement,
278
- selfClosing: false,
279
- },
280
- closingElement: (_a = folderElement.closingElement) !== null && _a !== void 0 ? _a : {
281
- type: 'JSXClosingElement',
282
- name: folderElement.openingElement.name,
283
- },
284
- children: [...folderElement.children, newFolderElement(transformation)],
285
- };
286
- };
287
- const getChildFolderParentName = ({ folderName, parentFolderName, }) => {
288
- return [parentFolderName, folderName].filter(Boolean).join('/');
289
- };
290
- const appendCompositionToFolder = ({ compositionElement, folderElement, }) => {
291
- var _a;
292
- folderElement.openingElement.selfClosing = false;
293
- folderElement.closingElement = (_a = folderElement.closingElement) !== null && _a !== void 0 ? _a : {
294
- type: 'JSXClosingElement',
295
- name: folderElement.openingElement.name,
296
- };
297
- folderElement.children.push((0, strip_parenthesized_extra_1.stripParenthesizedExtra)(compositionElement));
298
- };
299
- const appendCompositionToRoot = ({ compositionElement, file, }) => {
300
- let appended = false;
301
- recast.types.visit(file, {
302
- visitReturnStatement(astPath) {
303
- if (appended) {
304
- return false;
305
- }
306
- const { argument } = astPath.node;
307
- if ((argument === null || argument === void 0 ? void 0 : argument.type) !== 'JSXFragment' && (argument === null || argument === void 0 ? void 0 : argument.type) !== 'JSXElement') {
308
- this.traverse(astPath);
309
- return undefined;
310
- }
311
- if (argument.type === 'JSXFragment') {
312
- argument.children.push((0, strip_parenthesized_extra_1.stripParenthesizedExtra)(compositionElement));
313
- }
314
- else {
315
- astPath.node.argument = wrapInJsxFragment([
316
- argument,
317
- compositionElement,
318
- ]);
319
- }
320
- appended = true;
321
- return false;
322
- },
323
- });
324
- if (!appended) {
325
- throw new Error('Could not find a root JSX element');
326
- }
327
- };
328
- const moveCompositionToFolder = ({ file, transformation, changesMade, }) => {
329
- let sourcePath = null;
330
- let sourceParentFolderName = null;
331
- let sourceIsDirectJsxChild = false;
332
- let targetFolder = null;
333
- const folderStack = [];
334
- const isDirectJsxChild = (astPath) => {
335
- var _a;
336
- const parent = (_a = astPath.parentPath) === null || _a === void 0 ? void 0 : _a.node;
337
- return (((parent === null || parent === void 0 ? void 0 : parent.type) === 'JSXElement' || (parent === null || parent === void 0 ? void 0 : parent.type) === 'JSXFragment') &&
338
- parent.children.includes(astPath.node));
339
- };
340
- const visitJsxElementWithFolderContext = (astPath) => {
341
- const node = astPath.node;
342
- const compositionId = getCompositionIdFromJSXElement(node);
343
- if (compositionId === transformation.idToMove) {
344
- sourcePath = astPath;
345
- sourceParentFolderName = folderStack.join('/') || null;
346
- sourceIsDirectJsxChild = isDirectJsxChild(astPath);
347
- }
348
- const folderName = getFolderNameFromJSXElement(node);
349
- const parentName = folderStack.join('/') || null;
350
- if (transformation.folderName !== null &&
351
- folderName === transformation.folderName &&
352
- parentName === transformation.parentName) {
353
- targetFolder = node;
354
- }
355
- if (folderName) {
356
- folderStack.push(folderName);
357
- }
358
- for (let i = 0; i < node.children.length; i++) {
359
- if (node.children[i].type !== 'JSXElement') {
360
- continue;
361
- }
362
- visitJsxElementWithFolderContext(astPath.get('children', i));
363
- }
364
- if (folderName) {
365
- folderStack.pop();
366
- }
367
- };
368
- recast.types.visit(file, {
369
- visitJSXElement(astPath) {
370
- visitJsxElementWithFolderContext(astPath);
371
- return false;
372
- },
373
- });
374
- if (!sourcePath) {
375
- throw new Error(`Could not find composition "${transformation.idToMove}"`);
376
- }
377
- if (!sourceIsDirectJsxChild) {
378
- throw new Error(`Cannot move composition "${transformation.idToMove}" because it is not a direct JSX child`);
379
- }
380
- if (transformation.folderName === null && sourceParentFolderName === null) {
381
- return { newAst: file, changesMade };
382
- }
383
- if (transformation.folderName !== null && !targetFolder) {
384
- const folderLabel = `${transformation.parentName ? `${transformation.parentName}/` : ''}${transformation.folderName}`;
385
- throw new Error(`Could not find folder "${folderLabel}"`);
386
- }
387
- const compositionElement = sourcePath
388
- .node;
389
- (0, delete_jsx_node_1.deleteJsxElementAtPath)(sourcePath);
390
- if (transformation.folderName === null) {
391
- appendCompositionToRoot({ compositionElement, file });
392
- changesMade.push({ description: 'Moved composition to root' });
393
- }
394
- else {
395
- if (targetFolder === null) {
396
- throw new Error('Could not find target folder');
397
- }
398
- appendCompositionToFolder({
399
- compositionElement,
400
- folderElement: targetFolder,
401
- });
402
- changesMade.push({ description: 'Moved composition into folder' });
403
- }
404
- return { newAst: file, changesMade };
405
- };
406
- // When a <Composition> JSX element appears in a position where it cannot
407
- // simply be removed from a parent's children list (e.g. as the sole return
408
- // value of a wrapper component or as the concise body of an arrow function),
409
- // we still want delete/rename/duplicate codemods to work. This helper detects
410
- // that case and produces a structurally-valid replacement expression.
411
- const transformLoneJsxElement = (expression, transformation, changesMade, parentFolderName) => {
412
- if (expression.type !== 'JSXElement') {
413
- return null;
414
- }
415
- const compId = getCompositionIdFromJSXElement(expression);
416
- const folderName = getFolderNameFromJSXElement(expression);
417
- if (compId === null) {
418
- const isFolderMatch = folderName !== null &&
419
- ((transformation.type === 'delete-folder' &&
420
- folderName === transformation.folderName &&
421
- parentFolderName === transformation.parentName) ||
422
- (transformation.type === 'rename-folder' &&
423
- folderName === transformation.folderName &&
424
- parentFolderName === transformation.parentName) ||
425
- (transformation.type === 'new-composition' &&
426
- folderName === transformation.folderName &&
427
- parentFolderName === transformation.parentName) ||
428
- (transformation.type === 'new-folder' &&
429
- getChildFolderParentName({ folderName, parentFolderName }) ===
430
- transformation.parentName));
431
- if (!isFolderMatch) {
432
- return null;
433
- }
434
- }
435
- const isMatch = (transformation.type === 'delete-composition' &&
436
- compId === transformation.idToDelete) ||
437
- (transformation.type === 'rename-composition' &&
438
- compId === transformation.idToRename) ||
439
- (transformation.type === 'update-composition-metadata' &&
440
- compId === transformation.idToUpdate) ||
441
- (transformation.type === 'delete-folder' &&
442
- folderName === transformation.folderName &&
443
- parentFolderName === transformation.parentName) ||
444
- (transformation.type === 'rename-folder' &&
445
- folderName === transformation.folderName &&
446
- parentFolderName === transformation.parentName) ||
447
- (transformation.type === 'new-composition' &&
448
- folderName === transformation.folderName &&
449
- parentFolderName === transformation.parentName) ||
450
- (transformation.type === 'new-folder' &&
451
- folderName !== null &&
452
- getChildFolderParentName({ folderName, parentFolderName }) ===
453
- transformation.parentName);
454
- if (!isMatch) {
455
- return null;
456
- }
457
- const transformed = mapJsxChild(expression, transformation, changesMade, parentFolderName);
458
- const meaningful = transformed.filter(isMeaningfulJsxChild);
459
- if (meaningful.length === 0) {
460
- return nullLiteral();
461
- }
462
- if (meaningful.length === 1 && isJsxExpression(meaningful[0])) {
463
- return meaningful[0];
464
- }
465
- return wrapInJsxFragment(transformed);
466
- };
467
- const mapJsxElementOrFragment = (jsxFragment, transformation, changesMade, parentFolderName) => {
468
- return {
469
- ...jsxFragment,
470
- children: jsxFragment.children
471
- .map((c) => {
472
- if (c.type !== 'JSXElement') {
473
- return c;
474
- }
475
- return mapJsxChild(c, transformation, changesMade, parentFolderName);
476
- })
477
- .flat(1),
478
- };
479
- };
480
- const mapJsxChild = (c, transformation, changesMade, parentFolderName) => {
481
- const compId = getCompositionIdFromJSXElement(c);
482
- const folderName = getFolderNameFromJSXElement(c);
483
- if (transformation === null) {
484
- return [c];
485
- }
486
- if (transformation.type === 'rename-composition' &&
487
- compId === transformation.idToRename) {
488
- return [
489
- changeComposition({
490
- jsxElement: c,
491
- newCompositionId: transformation.newId,
492
- newCompositionFps: null,
493
- newCompositionDurationInFrames: null,
494
- newCompositionHeight: null,
495
- newCompositionWidth: null,
496
- changesMade,
497
- newTagToUse: null,
498
- }),
499
- ];
500
- }
501
- if (transformation.type === 'update-composition-metadata' &&
502
- compId === transformation.idToUpdate) {
503
- return [
504
- changeComposition({
505
- jsxElement: c,
506
- newCompositionId: null,
507
- newCompositionFps: transformation.newFps,
508
- newCompositionDurationInFrames: transformation.newDurationInFrames,
509
- newCompositionHeight: transformation.newHeight,
510
- newCompositionWidth: transformation.newWidth,
511
- changesMade,
512
- newTagToUse: null,
513
- }),
514
- ];
515
- }
516
- if (transformation.type === 'delete-composition' &&
517
- compId === transformation.idToDelete) {
518
- changesMade.push({
519
- description: 'Deleted composition',
520
- });
521
- return [];
522
- }
523
- if (transformation.type === 'rename-folder' &&
524
- folderName === transformation.folderName &&
525
- parentFolderName === transformation.parentName) {
526
- return [
527
- changeFolderName({
528
- jsxElement: c,
529
- newFolderName: transformation.newName,
530
- changesMade,
531
- }),
532
- ];
533
- }
534
- if (transformation.type === 'delete-folder' &&
535
- folderName === transformation.folderName &&
536
- parentFolderName === transformation.parentName) {
537
- changesMade.push({
538
- description: 'Deleted folder',
539
- });
540
- return c.children;
541
- }
542
- if (transformation.type === 'new-composition' &&
543
- folderName === transformation.folderName &&
544
- parentFolderName === transformation.parentName) {
545
- return [addNewCompositionToFolder(c, transformation, changesMade)];
546
- }
547
- if (transformation.type === 'new-folder' &&
548
- folderName !== null &&
549
- getChildFolderParentName({ folderName, parentFolderName }) ===
550
- transformation.parentName) {
551
- return [addNewFolderToFolder(c, transformation, changesMade)];
552
- }
553
- const childParentFolderName = folderName
554
- ? getChildFolderParentName({ folderName, parentFolderName })
555
- : parentFolderName;
556
- return [mapAll(c, transformation, changesMade, childParentFolderName)];
557
- };
558
- const mapRecognizedType = (expression, transformation, changesMade, parentFolderName) => {
559
- if (expression.type === 'JSXFragment' || expression.type === 'JSXElement') {
560
- return mapJsxElementOrFragment(expression, transformation, changesMade, parentFolderName);
561
- }
562
- if (expression.type === 'ArrowFunctionExpression' ||
563
- expression.type === 'FunctionExpression') {
564
- if (transformation.type === 'new-composition' &&
565
- transformation.folderName === null &&
566
- (expression.body.type === 'JSXElement' ||
567
- expression.body.type === 'JSXFragment')) {
568
- return {
569
- ...expression,
570
- body: addNewCompositionToRootJsx(expression.body, transformation, changesMade),
571
- };
572
- }
573
- if (transformation.type === 'new-folder' &&
574
- transformation.parentName === null &&
575
- (expression.body.type === 'JSXElement' ||
576
- expression.body.type === 'JSXFragment')) {
577
- return {
578
- ...expression,
579
- body: addNewFolderToRootJsx(expression.body, transformation, changesMade),
580
- };
581
- }
582
- if (expression.type === 'ArrowFunctionExpression' &&
583
- expression.body.type === 'JSXElement') {
584
- const replacement = transformLoneJsxElement(expression.body, transformation, changesMade, parentFolderName);
585
- if (replacement !== null) {
586
- return {
587
- ...expression,
588
- body: replacement,
589
- };
590
- }
591
- }
592
- return {
593
- ...expression,
594
- body: mapAll(expression.body, transformation, changesMade, parentFolderName),
595
- };
596
- }
597
- if (expression.type === 'VariableDeclaration') {
598
- const declarations = expression.declarations.map((d) => {
599
- return mapVariableDeclarator(d, transformation, changesMade, parentFolderName);
600
- });
601
- return { ...expression, declarations };
602
- }
603
- if (expression.type === 'FunctionDeclaration') {
604
- return {
605
- ...expression,
606
- body: mapBlockStatement(expression.body, transformation, changesMade, parentFolderName),
607
- };
608
- }
609
- if (expression.type === 'ExportNamedDeclaration' ||
610
- expression.type === 'ExportDefaultDeclaration') {
611
- if (!expression.declaration) {
612
- return expression;
613
- }
614
- return {
615
- ...expression,
616
- declaration: mapAll(expression.declaration, transformation, changesMade, parentFolderName),
617
- };
618
- }
619
- if (expression.type === 'ReturnStatement') {
620
- return mapReturnStatement(expression, transformation, changesMade, parentFolderName);
621
- }
622
- if (expression.type === 'BlockStatement') {
623
- return mapBlockStatement(expression, transformation, changesMade, parentFolderName);
624
- }
625
- return expression;
626
- };
627
- const getCompositionIdFromJSXElement = (jsxElement) => {
628
- if (jsxElement.type !== 'JSXElement') {
629
- return null;
630
- }
631
- const { openingElement } = jsxElement;
632
- const { name } = openingElement;
633
- if (name.type !== 'JSXIdentifier') {
634
- return null;
635
- }
636
- if (name.name !== 'Composition' && name.name !== 'Still') {
637
- return null;
638
- }
639
- const id = openingElement.attributes
640
- .map((attribute) => {
641
- if (attribute.type === 'JSXSpreadAttribute') {
642
- return null;
643
- }
644
- if (attribute.name.type === 'JSXNamespacedName') {
645
- return null;
646
- }
647
- if (attribute.name.name !== 'id') {
648
- return null;
649
- }
650
- if (!attribute.value) {
651
- return null;
652
- }
653
- if (attribute.value.type === 'StringLiteral') {
654
- return attribute.value.value;
655
- }
656
- if (attribute.value.type === 'JSXExpressionContainer' &&
657
- attribute.value.expression.type === 'StringLiteral') {
658
- return attribute.value.expression.value;
659
- }
660
- return null;
661
- })
662
- .filter(Boolean);
663
- return id[0];
664
- };
665
- const getFolderNameFromJSXElement = (jsxElement) => {
666
- if (jsxElement.type !== 'JSXElement') {
667
- return null;
668
- }
669
- const { openingElement } = jsxElement;
670
- const { name } = openingElement;
671
- if (name.type !== 'JSXIdentifier') {
672
- return null;
673
- }
674
- if (name.name !== 'Folder') {
675
- return null;
676
- }
677
- const folderName = openingElement.attributes
678
- .map((attribute) => {
679
- if (attribute.type === 'JSXSpreadAttribute') {
680
- return null;
681
- }
682
- if (attribute.name.type === 'JSXNamespacedName') {
683
- return null;
684
- }
685
- if (attribute.name.name !== 'name') {
686
- return null;
687
- }
688
- if (!attribute.value) {
689
- return null;
690
- }
691
- if (attribute.value.type === 'StringLiteral') {
692
- return attribute.value.value;
693
- }
694
- if (attribute.value.type === 'JSXExpressionContainer' &&
695
- attribute.value.expression.type === 'StringLiteral') {
696
- return attribute.value.expression.value;
697
- }
698
- return null;
699
- })
700
- .filter(Boolean);
701
- return folderName[0];
702
- };
703
- const changeFolderName = ({ jsxElement, newFolderName, changesMade, }) => {
704
- const { openingElement } = jsxElement;
705
- const { name } = openingElement;
706
- if (name.type !== 'JSXIdentifier') {
707
- return jsxElement;
708
- }
709
- if (name.name !== 'Folder') {
710
- return jsxElement;
711
- }
712
- const attributes = openingElement.attributes.map((attribute) => {
713
- if (attribute.type === 'JSXSpreadAttribute') {
714
- return attribute;
715
- }
716
- if (attribute.name.type === 'JSXNamespacedName') {
717
- return attribute;
718
- }
719
- if (attribute.name.name === 'name' &&
720
- attribute.value &&
721
- attribute.value.type === 'StringLiteral') {
722
- changesMade.push({
723
- description: 'Replaced folder name',
724
- });
725
- return {
726
- ...attribute,
727
- value: { ...attribute.value, value: newFolderName },
728
- };
729
- }
730
- if (attribute.name.name === 'name' &&
731
- attribute.value &&
732
- attribute.value.type === 'JSXExpressionContainer' &&
733
- attribute.value.expression.type === 'StringLiteral') {
734
- changesMade.push({
735
- description: 'Replaced folder name',
736
- });
737
- return {
738
- ...attribute,
739
- value: {
740
- ...attribute.value,
741
- expression: {
742
- ...attribute.value.expression,
743
- value: newFolderName,
744
- },
745
- },
746
- };
747
- }
748
- return attribute;
749
- });
750
- return {
751
- ...jsxElement,
752
- openingElement: {
753
- ...jsxElement.openingElement,
754
- attributes,
755
- },
756
- };
757
- };
758
- const changeComposition = ({ jsxElement, newCompositionId, newCompositionFps, newCompositionDurationInFrames, newCompositionHeight, newCompositionWidth, changesMade, newTagToUse, }) => {
759
- const { openingElement } = jsxElement;
760
- const { name } = openingElement;
761
- if (name.type !== 'JSXIdentifier') {
762
- return jsxElement;
763
- }
764
- if (name.name !== 'Composition' && name.name !== 'Still') {
765
- return jsxElement;
766
- }
767
- const attributes = openingElement.attributes
768
- .map((attribute) => {
769
- if (attribute.type === 'JSXSpreadAttribute') {
770
- return attribute;
771
- }
772
- if (attribute.name.type === 'JSXNamespacedName') {
773
- return attribute;
774
- }
775
- if (attribute.name.name === 'fps' && newTagToUse === 'Still') {
776
- changesMade.push({ description: 'Removed fps attribute' });
777
- return null;
778
- }
779
- if (attribute.name.name === 'durationInFrames' &&
780
- newTagToUse === 'Still') {
781
- changesMade.push({ description: 'Removed durationInFrames' });
782
- return null;
783
- }
784
- // id="one"
785
- if (attribute.name.name === 'id' &&
786
- attribute.value &&
787
- attribute.value.type === 'StringLiteral' &&
788
- newCompositionId !== null) {
789
- changesMade.push({
790
- description: 'Replaced composition id',
791
- });
792
- return {
793
- ...attribute,
794
- value: { ...attribute.value, value: newCompositionId },
795
- };
796
- }
797
- // id={"one"}
798
- if (attribute.name.name === 'id' &&
799
- attribute.value &&
800
- attribute.value.type === 'JSXExpressionContainer' &&
801
- attribute.value.expression.type === 'StringLiteral' &&
802
- newCompositionId !== null) {
803
- changesMade.push({
804
- description: 'Replaced composition id',
805
- });
806
- return {
807
- ...attribute,
808
- value: {
809
- ...attribute.value,
810
- expression: {
811
- ...attribute.value.expression,
812
- value: newCompositionId,
813
- },
814
- },
815
- };
816
- }
817
- if (attribute.name.name === 'fps' && newCompositionFps !== null) {
818
- changesMade.push({
819
- description: 'Replaced FPS',
820
- });
821
- return {
822
- ...attribute,
823
- value: b.jsxExpressionContainer(b.numericLiteral(newCompositionFps)),
824
- };
825
- }
826
- if (attribute.name.name === 'durationInFrames' &&
827
- newCompositionDurationInFrames !== null) {
828
- changesMade.push({
829
- description: 'Replaced durationInFrames',
830
- });
831
- return {
832
- ...attribute,
833
- value: b.jsxExpressionContainer(b.numericLiteral(newCompositionDurationInFrames)),
834
- };
835
- }
836
- if (attribute.name.name === 'width' && newCompositionWidth !== null) {
837
- changesMade.push({
838
- description: 'Replaced width',
839
- });
840
- return {
841
- ...attribute,
842
- value: b.jsxExpressionContainer(b.numericLiteral(newCompositionWidth)),
843
- };
844
- }
845
- if (attribute.name.name === 'height' && newCompositionHeight !== null) {
846
- changesMade.push({
847
- description: 'Replaced height',
848
- });
849
- return {
850
- ...attribute,
851
- value: b.jsxExpressionContainer(b.numericLiteral(newCompositionHeight)),
852
- };
853
- }
854
- return attribute;
855
- })
856
- .filter(Boolean);
857
- if (newCompositionFps !== null &&
858
- !attributes.some((attribute) => attribute.type === 'JSXAttribute' &&
859
- attribute.name.type === 'JSXIdentifier' &&
860
- attribute.name.name === 'fps')) {
861
- changesMade.push({ description: 'Added FPS' });
862
- attributes.push(jsxAttributeWithExpression('fps', b.numericLiteral(newCompositionFps)));
863
- }
864
- if (newCompositionDurationInFrames !== null &&
865
- !attributes.some((attribute) => attribute.type === 'JSXAttribute' &&
866
- attribute.name.type === 'JSXIdentifier' &&
867
- attribute.name.name === 'durationInFrames')) {
868
- changesMade.push({ description: 'Added durationInFrames' });
869
- attributes.push(jsxAttributeWithExpression('durationInFrames', b.numericLiteral(newCompositionDurationInFrames)));
870
- }
871
- if (newCompositionWidth !== null &&
872
- !attributes.some((attribute) => attribute.type === 'JSXAttribute' &&
873
- attribute.name.type === 'JSXIdentifier' &&
874
- attribute.name.name === 'width')) {
875
- changesMade.push({ description: 'Added width' });
876
- attributes.push(jsxAttributeWithExpression('width', b.numericLiteral(newCompositionWidth)));
877
- }
878
- if (newCompositionHeight !== null &&
879
- !attributes.some((attribute) => attribute.type === 'JSXAttribute' &&
880
- attribute.name.type === 'JSXIdentifier' &&
881
- attribute.name.name === 'height')) {
882
- changesMade.push({ description: 'Added height' });
883
- attributes.push(jsxAttributeWithExpression('height', b.numericLiteral(newCompositionHeight)));
884
- }
885
- const newName = newTagToUse !== null && newTagToUse !== void 0 ? newTagToUse : name.name;
886
- if (newName !== name.name) {
887
- changesMade.push({
888
- description: `Changed tag`,
889
- });
890
- }
891
- return {
892
- ...jsxElement,
893
- openingElement: {
894
- ...jsxElement.openingElement,
895
- name: {
896
- ...name,
897
- name: newName,
898
- },
899
- attributes,
900
- },
901
- };
902
- };