remotion 4.0.499 → 4.0.500
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/cjs/CompositionManager.d.ts +0 -1
- package/dist/cjs/HtmlInCanvas.d.ts +43 -3
- package/dist/cjs/HtmlInCanvas.js +29 -2
- package/dist/cjs/Img.d.ts +43 -3
- package/dist/cjs/Img.js +15 -5
- package/dist/cjs/Interactive.d.ts +118 -0
- package/dist/cjs/Interactive.js +28 -9
- package/dist/cjs/Sequence.d.ts +4 -0
- package/dist/cjs/Sequence.js +22 -7
- package/dist/cjs/TimelineContext.d.ts +0 -1
- package/dist/cjs/TimelineContext.js +1 -4
- package/dist/cjs/animated-image/AnimatedImage.d.ts +41 -1
- package/dist/cjs/animated-image/AnimatedImage.js +12 -2
- package/dist/cjs/animated-image/props.d.ts +2 -2
- package/dist/cjs/canvas-image/CanvasImage.d.ts +42 -1
- package/dist/cjs/canvas-image/CanvasImage.js +12 -2
- package/dist/cjs/canvas-image/props.d.ts +6 -2
- package/dist/cjs/effects/Solid.d.ts +43 -3
- package/dist/cjs/effects/Solid.js +12 -2
- package/dist/cjs/index.d.ts +1 -1
- package/dist/cjs/interactivity-schema.d.ts +239 -0
- package/dist/cjs/interactivity-schema.js +70 -1
- package/dist/cjs/internals.d.ts +127 -1
- package/dist/cjs/internals.js +5 -0
- package/dist/cjs/no-react.d.ts +40 -0
- package/dist/cjs/sequence-crop.d.ts +19 -0
- package/dist/cjs/sequence-crop.js +45 -0
- package/dist/cjs/use-crop-style.d.ts +6 -0
- package/dist/cjs/use-crop-style.js +19 -0
- package/dist/cjs/use-media-in-timeline.d.ts +0 -1
- package/dist/cjs/use-media-in-timeline.js +1 -7
- package/dist/cjs/version.d.ts +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/cjs/with-interactivity-schema.js +4 -2
- package/dist/esm/index.mjs +408 -140
- package/dist/esm/no-react.mjs +67 -0
- package/dist/esm/version.mjs +1 -1
- package/package.json +2 -2
|
@@ -328,6 +328,41 @@ export declare const backgroundSchema: {
|
|
|
328
328
|
readonly description: "Color";
|
|
329
329
|
};
|
|
330
330
|
};
|
|
331
|
+
export declare const svgStrokeSchema: {
|
|
332
|
+
readonly stroke: {
|
|
333
|
+
readonly type: "color";
|
|
334
|
+
readonly default: "none";
|
|
335
|
+
readonly description: "Stroke";
|
|
336
|
+
};
|
|
337
|
+
readonly strokeWidth: {
|
|
338
|
+
readonly type: "number";
|
|
339
|
+
readonly default: 1;
|
|
340
|
+
readonly description: "Stroke width";
|
|
341
|
+
readonly min: 0;
|
|
342
|
+
readonly step: 1;
|
|
343
|
+
readonly hiddenFromList: false;
|
|
344
|
+
};
|
|
345
|
+
};
|
|
346
|
+
export declare const svgPaintSchema: {
|
|
347
|
+
readonly stroke: {
|
|
348
|
+
readonly type: "color";
|
|
349
|
+
readonly default: "none";
|
|
350
|
+
readonly description: "Stroke";
|
|
351
|
+
};
|
|
352
|
+
readonly strokeWidth: {
|
|
353
|
+
readonly type: "number";
|
|
354
|
+
readonly default: 1;
|
|
355
|
+
readonly description: "Stroke width";
|
|
356
|
+
readonly min: 0;
|
|
357
|
+
readonly step: 1;
|
|
358
|
+
readonly hiddenFromList: false;
|
|
359
|
+
};
|
|
360
|
+
readonly fill: {
|
|
361
|
+
readonly type: "color";
|
|
362
|
+
readonly default: undefined;
|
|
363
|
+
readonly description: "Fill";
|
|
364
|
+
};
|
|
365
|
+
};
|
|
331
366
|
export declare const textContentSchema: {
|
|
332
367
|
readonly children: {
|
|
333
368
|
readonly type: "text-content";
|
|
@@ -374,6 +409,90 @@ export declare const sequencePremountSchema: {
|
|
|
374
409
|
readonly keyframable: false;
|
|
375
410
|
};
|
|
376
411
|
};
|
|
412
|
+
export declare const cropSchema: {
|
|
413
|
+
readonly cropLeft: {
|
|
414
|
+
readonly type: "number";
|
|
415
|
+
readonly default: 0;
|
|
416
|
+
readonly description: "Crop left";
|
|
417
|
+
readonly min: 0;
|
|
418
|
+
readonly max: 1;
|
|
419
|
+
readonly step: 0.01;
|
|
420
|
+
readonly hiddenFromList: false;
|
|
421
|
+
readonly keyframable: true;
|
|
422
|
+
};
|
|
423
|
+
readonly cropRight: {
|
|
424
|
+
readonly type: "number";
|
|
425
|
+
readonly default: 0;
|
|
426
|
+
readonly description: "Crop right";
|
|
427
|
+
readonly min: 0;
|
|
428
|
+
readonly max: 1;
|
|
429
|
+
readonly step: 0.01;
|
|
430
|
+
readonly hiddenFromList: false;
|
|
431
|
+
readonly keyframable: true;
|
|
432
|
+
};
|
|
433
|
+
readonly cropTop: {
|
|
434
|
+
readonly type: "number";
|
|
435
|
+
readonly default: 0;
|
|
436
|
+
readonly description: "Crop top";
|
|
437
|
+
readonly min: 0;
|
|
438
|
+
readonly max: 1;
|
|
439
|
+
readonly step: 0.01;
|
|
440
|
+
readonly hiddenFromList: false;
|
|
441
|
+
readonly keyframable: true;
|
|
442
|
+
};
|
|
443
|
+
readonly cropBottom: {
|
|
444
|
+
readonly type: "number";
|
|
445
|
+
readonly default: 0;
|
|
446
|
+
readonly description: "Crop bottom";
|
|
447
|
+
readonly min: 0;
|
|
448
|
+
readonly max: 1;
|
|
449
|
+
readonly step: 0.01;
|
|
450
|
+
readonly hiddenFromList: false;
|
|
451
|
+
readonly keyframable: true;
|
|
452
|
+
};
|
|
453
|
+
};
|
|
454
|
+
export declare const sequenceCropSchema: {
|
|
455
|
+
readonly cropLeft: {
|
|
456
|
+
readonly type: "number";
|
|
457
|
+
readonly default: 0;
|
|
458
|
+
readonly description: "Crop left";
|
|
459
|
+
readonly min: 0;
|
|
460
|
+
readonly max: 1;
|
|
461
|
+
readonly step: 0.01;
|
|
462
|
+
readonly hiddenFromList: false;
|
|
463
|
+
readonly keyframable: true;
|
|
464
|
+
};
|
|
465
|
+
readonly cropRight: {
|
|
466
|
+
readonly type: "number";
|
|
467
|
+
readonly default: 0;
|
|
468
|
+
readonly description: "Crop right";
|
|
469
|
+
readonly min: 0;
|
|
470
|
+
readonly max: 1;
|
|
471
|
+
readonly step: 0.01;
|
|
472
|
+
readonly hiddenFromList: false;
|
|
473
|
+
readonly keyframable: true;
|
|
474
|
+
};
|
|
475
|
+
readonly cropTop: {
|
|
476
|
+
readonly type: "number";
|
|
477
|
+
readonly default: 0;
|
|
478
|
+
readonly description: "Crop top";
|
|
479
|
+
readonly min: 0;
|
|
480
|
+
readonly max: 1;
|
|
481
|
+
readonly step: 0.01;
|
|
482
|
+
readonly hiddenFromList: false;
|
|
483
|
+
readonly keyframable: true;
|
|
484
|
+
};
|
|
485
|
+
readonly cropBottom: {
|
|
486
|
+
readonly type: "number";
|
|
487
|
+
readonly default: 0;
|
|
488
|
+
readonly description: "Crop bottom";
|
|
489
|
+
readonly min: 0;
|
|
490
|
+
readonly max: 1;
|
|
491
|
+
readonly step: 0.01;
|
|
492
|
+
readonly hiddenFromList: false;
|
|
493
|
+
readonly keyframable: true;
|
|
494
|
+
};
|
|
495
|
+
};
|
|
377
496
|
export declare const sequenceStyleSchema: {
|
|
378
497
|
readonly 'style.transformOrigin': {
|
|
379
498
|
readonly type: "transform-origin";
|
|
@@ -462,6 +581,46 @@ export declare const sequenceStyleSchema: {
|
|
|
462
581
|
readonly hiddenFromList: true;
|
|
463
582
|
readonly keyframable: false;
|
|
464
583
|
};
|
|
584
|
+
readonly cropLeft: {
|
|
585
|
+
readonly type: "number";
|
|
586
|
+
readonly default: 0;
|
|
587
|
+
readonly description: "Crop left";
|
|
588
|
+
readonly min: 0;
|
|
589
|
+
readonly max: 1;
|
|
590
|
+
readonly step: 0.01;
|
|
591
|
+
readonly hiddenFromList: false;
|
|
592
|
+
readonly keyframable: true;
|
|
593
|
+
};
|
|
594
|
+
readonly cropRight: {
|
|
595
|
+
readonly type: "number";
|
|
596
|
+
readonly default: 0;
|
|
597
|
+
readonly description: "Crop right";
|
|
598
|
+
readonly min: 0;
|
|
599
|
+
readonly max: 1;
|
|
600
|
+
readonly step: 0.01;
|
|
601
|
+
readonly hiddenFromList: false;
|
|
602
|
+
readonly keyframable: true;
|
|
603
|
+
};
|
|
604
|
+
readonly cropTop: {
|
|
605
|
+
readonly type: "number";
|
|
606
|
+
readonly default: 0;
|
|
607
|
+
readonly description: "Crop top";
|
|
608
|
+
readonly min: 0;
|
|
609
|
+
readonly max: 1;
|
|
610
|
+
readonly step: 0.01;
|
|
611
|
+
readonly hiddenFromList: false;
|
|
612
|
+
readonly keyframable: true;
|
|
613
|
+
};
|
|
614
|
+
readonly cropBottom: {
|
|
615
|
+
readonly type: "number";
|
|
616
|
+
readonly default: 0;
|
|
617
|
+
readonly description: "Crop bottom";
|
|
618
|
+
readonly min: 0;
|
|
619
|
+
readonly max: 1;
|
|
620
|
+
readonly step: 0.01;
|
|
621
|
+
readonly hiddenFromList: false;
|
|
622
|
+
readonly keyframable: true;
|
|
623
|
+
};
|
|
465
624
|
};
|
|
466
625
|
export declare const hiddenField: InteractivitySchemaField;
|
|
467
626
|
export declare const sequenceNameField: InteractivitySchemaField;
|
|
@@ -648,6 +807,46 @@ export declare const sequenceSchema: {
|
|
|
648
807
|
readonly hiddenFromList: true;
|
|
649
808
|
readonly keyframable: false;
|
|
650
809
|
};
|
|
810
|
+
readonly cropLeft: {
|
|
811
|
+
readonly type: "number";
|
|
812
|
+
readonly default: 0;
|
|
813
|
+
readonly description: "Crop left";
|
|
814
|
+
readonly min: 0;
|
|
815
|
+
readonly max: 1;
|
|
816
|
+
readonly step: 0.01;
|
|
817
|
+
readonly hiddenFromList: false;
|
|
818
|
+
readonly keyframable: true;
|
|
819
|
+
};
|
|
820
|
+
readonly cropRight: {
|
|
821
|
+
readonly type: "number";
|
|
822
|
+
readonly default: 0;
|
|
823
|
+
readonly description: "Crop right";
|
|
824
|
+
readonly min: 0;
|
|
825
|
+
readonly max: 1;
|
|
826
|
+
readonly step: 0.01;
|
|
827
|
+
readonly hiddenFromList: false;
|
|
828
|
+
readonly keyframable: true;
|
|
829
|
+
};
|
|
830
|
+
readonly cropTop: {
|
|
831
|
+
readonly type: "number";
|
|
832
|
+
readonly default: 0;
|
|
833
|
+
readonly description: "Crop top";
|
|
834
|
+
readonly min: 0;
|
|
835
|
+
readonly max: 1;
|
|
836
|
+
readonly step: 0.01;
|
|
837
|
+
readonly hiddenFromList: false;
|
|
838
|
+
readonly keyframable: true;
|
|
839
|
+
};
|
|
840
|
+
readonly cropBottom: {
|
|
841
|
+
readonly type: "number";
|
|
842
|
+
readonly default: 0;
|
|
843
|
+
readonly description: "Crop bottom";
|
|
844
|
+
readonly min: 0;
|
|
845
|
+
readonly max: 1;
|
|
846
|
+
readonly step: 0.01;
|
|
847
|
+
readonly hiddenFromList: false;
|
|
848
|
+
readonly keyframable: true;
|
|
849
|
+
};
|
|
651
850
|
};
|
|
652
851
|
readonly none: {};
|
|
653
852
|
};
|
|
@@ -795,6 +994,46 @@ export declare const sequenceSchemaWithoutFrom: {
|
|
|
795
994
|
readonly hiddenFromList: true;
|
|
796
995
|
readonly keyframable: false;
|
|
797
996
|
};
|
|
997
|
+
readonly cropLeft: {
|
|
998
|
+
readonly type: "number";
|
|
999
|
+
readonly default: 0;
|
|
1000
|
+
readonly description: "Crop left";
|
|
1001
|
+
readonly min: 0;
|
|
1002
|
+
readonly max: 1;
|
|
1003
|
+
readonly step: 0.01;
|
|
1004
|
+
readonly hiddenFromList: false;
|
|
1005
|
+
readonly keyframable: true;
|
|
1006
|
+
};
|
|
1007
|
+
readonly cropRight: {
|
|
1008
|
+
readonly type: "number";
|
|
1009
|
+
readonly default: 0;
|
|
1010
|
+
readonly description: "Crop right";
|
|
1011
|
+
readonly min: 0;
|
|
1012
|
+
readonly max: 1;
|
|
1013
|
+
readonly step: 0.01;
|
|
1014
|
+
readonly hiddenFromList: false;
|
|
1015
|
+
readonly keyframable: true;
|
|
1016
|
+
};
|
|
1017
|
+
readonly cropTop: {
|
|
1018
|
+
readonly type: "number";
|
|
1019
|
+
readonly default: 0;
|
|
1020
|
+
readonly description: "Crop top";
|
|
1021
|
+
readonly min: 0;
|
|
1022
|
+
readonly max: 1;
|
|
1023
|
+
readonly step: 0.01;
|
|
1024
|
+
readonly hiddenFromList: false;
|
|
1025
|
+
readonly keyframable: true;
|
|
1026
|
+
};
|
|
1027
|
+
readonly cropBottom: {
|
|
1028
|
+
readonly type: "number";
|
|
1029
|
+
readonly default: 0;
|
|
1030
|
+
readonly description: "Crop bottom";
|
|
1031
|
+
readonly min: 0;
|
|
1032
|
+
readonly max: 1;
|
|
1033
|
+
readonly step: 0.01;
|
|
1034
|
+
readonly hiddenFromList: false;
|
|
1035
|
+
readonly keyframable: true;
|
|
1036
|
+
};
|
|
798
1037
|
};
|
|
799
1038
|
readonly none: {};
|
|
800
1039
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.sequenceSchemaDefaultLayoutNone = exports.sequenceSchemaWithoutFrom = exports.baseSchemaWithoutFrom = exports.sequenceSchema = exports.baseSchema = exports.freezeField = exports.trimBeforeField = exports.fromField = exports.durationInFramesField = exports.extendSchemaWithSequenceName = exports.sequenceNameField = exports.hiddenField = exports.sequenceStyleSchema = exports.sequencePremountSchema = exports.premountSchema = exports.textContentSchema = exports.backgroundSchema = exports.borderSchema = exports.textSchema = exports.sequenceVisualStyleSchema = exports.transformSchema = void 0;
|
|
3
|
+
exports.sequenceSchemaDefaultLayoutNone = exports.sequenceSchemaWithoutFrom = exports.baseSchemaWithoutFrom = exports.sequenceSchema = exports.baseSchema = exports.freezeField = exports.trimBeforeField = exports.fromField = exports.durationInFramesField = exports.extendSchemaWithSequenceName = exports.sequenceNameField = exports.hiddenField = exports.sequenceStyleSchema = exports.sequenceCropSchema = exports.cropSchema = exports.sequencePremountSchema = exports.premountSchema = exports.textContentSchema = exports.svgPaintSchema = exports.svgStrokeSchema = exports.backgroundSchema = exports.borderSchema = exports.textSchema = exports.sequenceVisualStyleSchema = exports.transformSchema = void 0;
|
|
4
4
|
exports.transformSchema = {
|
|
5
5
|
'style.transformOrigin': {
|
|
6
6
|
type: 'transform-origin',
|
|
@@ -157,6 +157,31 @@ exports.backgroundSchema = {
|
|
|
157
157
|
description: 'Color',
|
|
158
158
|
},
|
|
159
159
|
};
|
|
160
|
+
exports.svgStrokeSchema = {
|
|
161
|
+
stroke: {
|
|
162
|
+
type: 'color',
|
|
163
|
+
// `none` is the SVG initial value of stroke.
|
|
164
|
+
default: 'none',
|
|
165
|
+
description: 'Stroke',
|
|
166
|
+
},
|
|
167
|
+
strokeWidth: {
|
|
168
|
+
type: 'number',
|
|
169
|
+
// `1` is the SVG initial value of stroke-width.
|
|
170
|
+
default: 1,
|
|
171
|
+
description: 'Stroke width',
|
|
172
|
+
min: 0,
|
|
173
|
+
step: 1,
|
|
174
|
+
hiddenFromList: false,
|
|
175
|
+
},
|
|
176
|
+
};
|
|
177
|
+
exports.svgPaintSchema = {
|
|
178
|
+
fill: {
|
|
179
|
+
type: 'color',
|
|
180
|
+
default: undefined,
|
|
181
|
+
description: 'Fill',
|
|
182
|
+
},
|
|
183
|
+
...exports.svgStrokeSchema,
|
|
184
|
+
};
|
|
160
185
|
exports.textContentSchema = {
|
|
161
186
|
children: {
|
|
162
187
|
type: 'text-content',
|
|
@@ -187,7 +212,51 @@ exports.premountSchema = {
|
|
|
187
212
|
exports.sequencePremountSchema = {
|
|
188
213
|
...exports.premountSchema,
|
|
189
214
|
};
|
|
215
|
+
exports.cropSchema = {
|
|
216
|
+
cropLeft: {
|
|
217
|
+
type: 'number',
|
|
218
|
+
default: 0,
|
|
219
|
+
description: 'Crop left',
|
|
220
|
+
min: 0,
|
|
221
|
+
max: 1,
|
|
222
|
+
step: 0.01,
|
|
223
|
+
hiddenFromList: false,
|
|
224
|
+
keyframable: true,
|
|
225
|
+
},
|
|
226
|
+
cropRight: {
|
|
227
|
+
type: 'number',
|
|
228
|
+
default: 0,
|
|
229
|
+
description: 'Crop right',
|
|
230
|
+
min: 0,
|
|
231
|
+
max: 1,
|
|
232
|
+
step: 0.01,
|
|
233
|
+
hiddenFromList: false,
|
|
234
|
+
keyframable: true,
|
|
235
|
+
},
|
|
236
|
+
cropTop: {
|
|
237
|
+
type: 'number',
|
|
238
|
+
default: 0,
|
|
239
|
+
description: 'Crop top',
|
|
240
|
+
min: 0,
|
|
241
|
+
max: 1,
|
|
242
|
+
step: 0.01,
|
|
243
|
+
hiddenFromList: false,
|
|
244
|
+
keyframable: true,
|
|
245
|
+
},
|
|
246
|
+
cropBottom: {
|
|
247
|
+
type: 'number',
|
|
248
|
+
default: 0,
|
|
249
|
+
description: 'Crop bottom',
|
|
250
|
+
min: 0,
|
|
251
|
+
max: 1,
|
|
252
|
+
step: 0.01,
|
|
253
|
+
hiddenFromList: false,
|
|
254
|
+
keyframable: true,
|
|
255
|
+
},
|
|
256
|
+
};
|
|
257
|
+
exports.sequenceCropSchema = exports.cropSchema;
|
|
190
258
|
exports.sequenceStyleSchema = {
|
|
259
|
+
...exports.sequenceCropSchema,
|
|
191
260
|
...exports.transformSchema,
|
|
192
261
|
...exports.backgroundSchema,
|
|
193
262
|
...exports.borderSchema,
|
package/dist/cjs/internals.d.ts
CHANGED
|
@@ -237,6 +237,46 @@ export declare const Internals: {
|
|
|
237
237
|
readonly hiddenFromList: true;
|
|
238
238
|
readonly keyframable: false;
|
|
239
239
|
};
|
|
240
|
+
readonly cropLeft: {
|
|
241
|
+
readonly type: "number";
|
|
242
|
+
readonly default: 0;
|
|
243
|
+
readonly description: "Crop left";
|
|
244
|
+
readonly min: 0;
|
|
245
|
+
readonly max: 1;
|
|
246
|
+
readonly step: 0.01;
|
|
247
|
+
readonly hiddenFromList: false;
|
|
248
|
+
readonly keyframable: true;
|
|
249
|
+
};
|
|
250
|
+
readonly cropRight: {
|
|
251
|
+
readonly type: "number";
|
|
252
|
+
readonly default: 0;
|
|
253
|
+
readonly description: "Crop right";
|
|
254
|
+
readonly min: 0;
|
|
255
|
+
readonly max: 1;
|
|
256
|
+
readonly step: 0.01;
|
|
257
|
+
readonly hiddenFromList: false;
|
|
258
|
+
readonly keyframable: true;
|
|
259
|
+
};
|
|
260
|
+
readonly cropTop: {
|
|
261
|
+
readonly type: "number";
|
|
262
|
+
readonly default: 0;
|
|
263
|
+
readonly description: "Crop top";
|
|
264
|
+
readonly min: 0;
|
|
265
|
+
readonly max: 1;
|
|
266
|
+
readonly step: 0.01;
|
|
267
|
+
readonly hiddenFromList: false;
|
|
268
|
+
readonly keyframable: true;
|
|
269
|
+
};
|
|
270
|
+
readonly cropBottom: {
|
|
271
|
+
readonly type: "number";
|
|
272
|
+
readonly default: 0;
|
|
273
|
+
readonly description: "Crop bottom";
|
|
274
|
+
readonly min: 0;
|
|
275
|
+
readonly max: 1;
|
|
276
|
+
readonly step: 0.01;
|
|
277
|
+
readonly hiddenFromList: false;
|
|
278
|
+
readonly keyframable: true;
|
|
279
|
+
};
|
|
240
280
|
};
|
|
241
281
|
readonly none: {};
|
|
242
282
|
};
|
|
@@ -331,6 +371,46 @@ export declare const Internals: {
|
|
|
331
371
|
readonly hiddenFromList: true;
|
|
332
372
|
readonly keyframable: false;
|
|
333
373
|
};
|
|
374
|
+
readonly cropLeft: {
|
|
375
|
+
readonly type: "number";
|
|
376
|
+
readonly default: 0;
|
|
377
|
+
readonly description: "Crop left";
|
|
378
|
+
readonly min: 0;
|
|
379
|
+
readonly max: 1;
|
|
380
|
+
readonly step: 0.01;
|
|
381
|
+
readonly hiddenFromList: false;
|
|
382
|
+
readonly keyframable: true;
|
|
383
|
+
};
|
|
384
|
+
readonly cropRight: {
|
|
385
|
+
readonly type: "number";
|
|
386
|
+
readonly default: 0;
|
|
387
|
+
readonly description: "Crop right";
|
|
388
|
+
readonly min: 0;
|
|
389
|
+
readonly max: 1;
|
|
390
|
+
readonly step: 0.01;
|
|
391
|
+
readonly hiddenFromList: false;
|
|
392
|
+
readonly keyframable: true;
|
|
393
|
+
};
|
|
394
|
+
readonly cropTop: {
|
|
395
|
+
readonly type: "number";
|
|
396
|
+
readonly default: 0;
|
|
397
|
+
readonly description: "Crop top";
|
|
398
|
+
readonly min: 0;
|
|
399
|
+
readonly max: 1;
|
|
400
|
+
readonly step: 0.01;
|
|
401
|
+
readonly hiddenFromList: false;
|
|
402
|
+
readonly keyframable: true;
|
|
403
|
+
};
|
|
404
|
+
readonly cropBottom: {
|
|
405
|
+
readonly type: "number";
|
|
406
|
+
readonly default: 0;
|
|
407
|
+
readonly description: "Crop bottom";
|
|
408
|
+
readonly min: 0;
|
|
409
|
+
readonly max: 1;
|
|
410
|
+
readonly step: 0.01;
|
|
411
|
+
readonly hiddenFromList: false;
|
|
412
|
+
readonly keyframable: true;
|
|
413
|
+
};
|
|
334
414
|
};
|
|
335
415
|
readonly sequenceVisualStyleSchema: {
|
|
336
416
|
readonly 'style.transformOrigin': {
|
|
@@ -388,6 +468,48 @@ export declare const Internals: {
|
|
|
388
468
|
readonly keyframable: false;
|
|
389
469
|
};
|
|
390
470
|
};
|
|
471
|
+
readonly sequenceCropSchema: {
|
|
472
|
+
readonly cropLeft: {
|
|
473
|
+
readonly type: "number";
|
|
474
|
+
readonly default: 0;
|
|
475
|
+
readonly description: "Crop left";
|
|
476
|
+
readonly min: 0;
|
|
477
|
+
readonly max: 1;
|
|
478
|
+
readonly step: 0.01;
|
|
479
|
+
readonly hiddenFromList: false;
|
|
480
|
+
readonly keyframable: true;
|
|
481
|
+
};
|
|
482
|
+
readonly cropRight: {
|
|
483
|
+
readonly type: "number";
|
|
484
|
+
readonly default: 0;
|
|
485
|
+
readonly description: "Crop right";
|
|
486
|
+
readonly min: 0;
|
|
487
|
+
readonly max: 1;
|
|
488
|
+
readonly step: 0.01;
|
|
489
|
+
readonly hiddenFromList: false;
|
|
490
|
+
readonly keyframable: true;
|
|
491
|
+
};
|
|
492
|
+
readonly cropTop: {
|
|
493
|
+
readonly type: "number";
|
|
494
|
+
readonly default: 0;
|
|
495
|
+
readonly description: "Crop top";
|
|
496
|
+
readonly min: 0;
|
|
497
|
+
readonly max: 1;
|
|
498
|
+
readonly step: 0.01;
|
|
499
|
+
readonly hiddenFromList: false;
|
|
500
|
+
readonly keyframable: true;
|
|
501
|
+
};
|
|
502
|
+
readonly cropBottom: {
|
|
503
|
+
readonly type: "number";
|
|
504
|
+
readonly default: 0;
|
|
505
|
+
readonly description: "Crop bottom";
|
|
506
|
+
readonly min: 0;
|
|
507
|
+
readonly max: 1;
|
|
508
|
+
readonly step: 0.01;
|
|
509
|
+
readonly hiddenFromList: false;
|
|
510
|
+
readonly keyframable: true;
|
|
511
|
+
};
|
|
512
|
+
};
|
|
391
513
|
readonly textSchema: {
|
|
392
514
|
readonly 'style.color': {
|
|
393
515
|
readonly type: "color";
|
|
@@ -935,7 +1057,6 @@ export declare const Internals: {
|
|
|
935
1057
|
duration: number;
|
|
936
1058
|
doesVolumeChange: boolean;
|
|
937
1059
|
nonce: import("./nonce.js").NonceHistoryContext;
|
|
938
|
-
rootId: string;
|
|
939
1060
|
finalDisplayName: string;
|
|
940
1061
|
startMediaFrom: number;
|
|
941
1062
|
src: string;
|
|
@@ -1059,5 +1180,10 @@ export declare const Internals: {
|
|
|
1059
1180
|
readonly step: 1;
|
|
1060
1181
|
readonly hiddenFromList: true;
|
|
1061
1182
|
};
|
|
1183
|
+
readonly resolveSequenceCrop: ({ cropLeft, cropRight, cropTop, cropBottom, }: import("./sequence-crop.js").SequenceCropInput) => import("./sequence-crop.js").ResolvedSequenceCrop;
|
|
1184
|
+
readonly useCropStyle: ({ cropLeft, cropRight, cropTop, cropBottom, style, componentName, }: import("./sequence-crop.js").SequenceCropInput & {
|
|
1185
|
+
readonly style: import("react").CSSProperties | null;
|
|
1186
|
+
readonly componentName: string;
|
|
1187
|
+
}) => import("react").CSSProperties | null;
|
|
1062
1188
|
};
|
|
1063
1189
|
export type { ArrayFieldSchema, AssetFieldSchema, ArrayItemFieldSchema, CannotUpdateSequenceReason, CanUpdateEffectPropsResponse, CanUpdateEffectPropsResponseFalse, CanUpdateEffectPropsResponseTrue, CanUpdateSequencePropsResponse, CanUpdateSequencePropsResponseFalse, CanUpdateSequencePropsResponseTrue, CanUpdateSequencePropStatus, CanUpdateSequencePropStatusEasing, CanUpdateSequencePropStatusFalse, CanUpdateSequencePropStatusKeyframed, CanUpdateSequencePropStatusStatic, VideoConfigNumericExpression, CompositionManagerContext, CompProps, DragOverrides, DragOverrideValue, EffectDragOverrides, GetDragOverrides, GetEffectDragOverrides, GetEffectPropStatuses, GetPropStatuses, JsxComponentIdentity, LoggingContextValue, MediaVolumeContextValue, NonceHistory, OverrideIdsToNodePathsGettersContext, OverrideIdsToNodePathsSettersContext, OverrideIdToNodePaths, OverrideToNodePathGetters, OverrideToNodeSetters, PlaybackRateContextValue, PropStatuses, RemotionAudioContextState, RemotionEnvironment, ResolvedStackLocation, ScheduleAudioNodeOptions, ScheduleAudioNodeResult, InteractivitySchemaField, SequenceNodePath, SequencePropsSubscriptionKey, VideoConfigValues, InteractivitySchema, SerializedJSONWithCustomFields, SetMediaVolumeContextValue, SetTimelineContextValue, TCompMetadata, TComposition, TimelineContextValue, TRenderAsset, TSequence, VisibleFieldSchema, WatchRemotionStaticFilesPayload, };
|
package/dist/cjs/internals.js
CHANGED
|
@@ -81,6 +81,7 @@ const RemotionRoot_js_1 = require("./RemotionRoot.js");
|
|
|
81
81
|
const RenderAssetManager_js_1 = require("./RenderAssetManager.js");
|
|
82
82
|
const resolve_video_config_js_1 = require("./resolve-video-config.js");
|
|
83
83
|
const ResolveCompositionConfig_js_1 = require("./ResolveCompositionConfig.js");
|
|
84
|
+
const sequence_crop_js_1 = require("./sequence-crop.js");
|
|
84
85
|
const sequence_node_path_js_1 = require("./sequence-node-path.js");
|
|
85
86
|
const sequence_stack_traces_js_1 = require("./sequence-stack-traces.js");
|
|
86
87
|
const Sequence_js_1 = require("./Sequence.js");
|
|
@@ -91,6 +92,7 @@ const TimelinePosition = __importStar(require("./timeline-position-state.js"));
|
|
|
91
92
|
const timeline_position_state_js_1 = require("./timeline-position-state.js");
|
|
92
93
|
const TimelineContext_js_1 = require("./TimelineContext.js");
|
|
93
94
|
const truthy_js_1 = require("./truthy.js");
|
|
95
|
+
const use_crop_style_js_1 = require("./use-crop-style.js");
|
|
94
96
|
const use_current_scale_js_1 = require("./use-current-scale.js");
|
|
95
97
|
const use_delay_render_js_1 = require("./use-delay-render.js");
|
|
96
98
|
const use_lazy_component_js_1 = require("./use-lazy-component.js");
|
|
@@ -149,6 +151,7 @@ exports.Internals = {
|
|
|
149
151
|
sequenceStyleSchema: interactivity_schema_js_1.sequenceStyleSchema,
|
|
150
152
|
sequenceVisualStyleSchema: interactivity_schema_js_1.sequenceVisualStyleSchema,
|
|
151
153
|
sequencePremountSchema: interactivity_schema_js_1.sequencePremountSchema,
|
|
154
|
+
sequenceCropSchema: interactivity_schema_js_1.sequenceCropSchema,
|
|
152
155
|
textSchema: interactivity_schema_js_1.textSchema,
|
|
153
156
|
transformSchema: interactivity_schema_js_1.transformSchema,
|
|
154
157
|
premountSchema: interactivity_schema_js_1.premountSchema,
|
|
@@ -273,4 +276,6 @@ exports.Internals = {
|
|
|
273
276
|
durationInFramesField: interactivity_schema_js_1.durationInFramesField,
|
|
274
277
|
freezeField: interactivity_schema_js_1.freezeField,
|
|
275
278
|
fromField: interactivity_schema_js_1.fromField,
|
|
279
|
+
resolveSequenceCrop: sequence_crop_js_1.resolveSequenceCrop,
|
|
280
|
+
useCropStyle: use_crop_style_js_1.useCropStyle,
|
|
276
281
|
};
|
package/dist/cjs/no-react.d.ts
CHANGED
|
@@ -185,6 +185,46 @@ export declare const NoReactInternals: {
|
|
|
185
185
|
readonly hiddenFromList: true;
|
|
186
186
|
readonly keyframable: false;
|
|
187
187
|
};
|
|
188
|
+
readonly cropLeft: {
|
|
189
|
+
readonly type: "number";
|
|
190
|
+
readonly default: 0;
|
|
191
|
+
readonly description: "Crop left";
|
|
192
|
+
readonly min: 0;
|
|
193
|
+
readonly max: 1;
|
|
194
|
+
readonly step: 0.01;
|
|
195
|
+
readonly hiddenFromList: false;
|
|
196
|
+
readonly keyframable: true;
|
|
197
|
+
};
|
|
198
|
+
readonly cropRight: {
|
|
199
|
+
readonly type: "number";
|
|
200
|
+
readonly default: 0;
|
|
201
|
+
readonly description: "Crop right";
|
|
202
|
+
readonly min: 0;
|
|
203
|
+
readonly max: 1;
|
|
204
|
+
readonly step: 0.01;
|
|
205
|
+
readonly hiddenFromList: false;
|
|
206
|
+
readonly keyframable: true;
|
|
207
|
+
};
|
|
208
|
+
readonly cropTop: {
|
|
209
|
+
readonly type: "number";
|
|
210
|
+
readonly default: 0;
|
|
211
|
+
readonly description: "Crop top";
|
|
212
|
+
readonly min: 0;
|
|
213
|
+
readonly max: 1;
|
|
214
|
+
readonly step: 0.01;
|
|
215
|
+
readonly hiddenFromList: false;
|
|
216
|
+
readonly keyframable: true;
|
|
217
|
+
};
|
|
218
|
+
readonly cropBottom: {
|
|
219
|
+
readonly type: "number";
|
|
220
|
+
readonly default: 0;
|
|
221
|
+
readonly description: "Crop bottom";
|
|
222
|
+
readonly min: 0;
|
|
223
|
+
readonly max: 1;
|
|
224
|
+
readonly step: 0.01;
|
|
225
|
+
readonly hiddenFromList: false;
|
|
226
|
+
readonly keyframable: true;
|
|
227
|
+
};
|
|
188
228
|
};
|
|
189
229
|
readonly none: {};
|
|
190
230
|
};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export type ResolvedSequenceCrop = {
|
|
2
|
+
readonly left: number;
|
|
3
|
+
readonly right: number;
|
|
4
|
+
readonly top: number;
|
|
5
|
+
readonly bottom: number;
|
|
6
|
+
};
|
|
7
|
+
type ResolvedSequenceCropWithBorderRadius = ResolvedSequenceCrop & {
|
|
8
|
+
readonly borderRadius?: string | number;
|
|
9
|
+
};
|
|
10
|
+
export type SequenceCropInput = {
|
|
11
|
+
readonly cropLeft?: number;
|
|
12
|
+
readonly cropRight?: number;
|
|
13
|
+
readonly cropTop?: number;
|
|
14
|
+
readonly cropBottom?: number;
|
|
15
|
+
};
|
|
16
|
+
export declare const resolveSequenceCrop: ({ cropLeft, cropRight, cropTop, cropBottom, }: SequenceCropInput) => ResolvedSequenceCrop;
|
|
17
|
+
export declare const getSequenceCropClipPath: ({ left, right, top, bottom, borderRadius, }: ResolvedSequenceCropWithBorderRadius) => string | null;
|
|
18
|
+
export declare const validateSequenceCrop: (crop: SequenceCropInput, componentName?: string) => void;
|
|
19
|
+
export {};
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.validateSequenceCrop = exports.getSequenceCropClipPath = exports.resolveSequenceCrop = void 0;
|
|
4
|
+
const clampCrop = (value) => {
|
|
5
|
+
return Math.min(1, Math.max(0, value !== null && value !== void 0 ? value : 0));
|
|
6
|
+
};
|
|
7
|
+
const resolveAxis = (start, end) => {
|
|
8
|
+
const resolvedStart = clampCrop(start);
|
|
9
|
+
const resolvedEnd = clampCrop(end);
|
|
10
|
+
if (resolvedStart + resolvedEnd > 1) {
|
|
11
|
+
return [0.5, 0.5];
|
|
12
|
+
}
|
|
13
|
+
return [resolvedStart, resolvedEnd];
|
|
14
|
+
};
|
|
15
|
+
const resolveSequenceCrop = ({ cropLeft, cropRight, cropTop, cropBottom, }) => {
|
|
16
|
+
const [left, right] = resolveAxis(cropLeft, cropRight);
|
|
17
|
+
const [top, bottom] = resolveAxis(cropTop, cropBottom);
|
|
18
|
+
return { left, right, top, bottom };
|
|
19
|
+
};
|
|
20
|
+
exports.resolveSequenceCrop = resolveSequenceCrop;
|
|
21
|
+
const getSequenceCropClipPath = ({ left, right, top, bottom, borderRadius, }) => {
|
|
22
|
+
if (left === 0 && right === 0 && top === 0 && bottom === 0) {
|
|
23
|
+
return null;
|
|
24
|
+
}
|
|
25
|
+
const serializedBorderRadius = typeof borderRadius === 'number' ? `${borderRadius}px` : borderRadius;
|
|
26
|
+
const rounded = serializedBorderRadius
|
|
27
|
+
? ` round ${serializedBorderRadius}`
|
|
28
|
+
: '';
|
|
29
|
+
return `inset(${top * 100}% ${right * 100}% ${bottom * 100}% ${left * 100}%${rounded})`;
|
|
30
|
+
};
|
|
31
|
+
exports.getSequenceCropClipPath = getSequenceCropClipPath;
|
|
32
|
+
const validateSequenceCrop = (crop, componentName = '<Sequence />') => {
|
|
33
|
+
for (const [name, value] of Object.entries(crop)) {
|
|
34
|
+
if (value === undefined) {
|
|
35
|
+
continue;
|
|
36
|
+
}
|
|
37
|
+
if (typeof value !== 'number' || !Number.isFinite(value)) {
|
|
38
|
+
throw new TypeError(`The "${name}" prop of ${componentName} must be a finite number, but got ${String(value)}.`);
|
|
39
|
+
}
|
|
40
|
+
if (value < 0 || value > 1) {
|
|
41
|
+
throw new RangeError(`The "${name}" prop of ${componentName} must be between 0 and 1, but got ${value}.`);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
exports.validateSequenceCrop = validateSequenceCrop;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type React from 'react';
|
|
2
|
+
import { type SequenceCropInput } from './sequence-crop.js';
|
|
3
|
+
export declare const useCropStyle: ({ cropLeft, cropRight, cropTop, cropBottom, style, componentName, }: SequenceCropInput & {
|
|
4
|
+
readonly style: React.CSSProperties | null;
|
|
5
|
+
readonly componentName: string;
|
|
6
|
+
}) => React.CSSProperties | null;
|