remotion 4.0.477 → 4.0.479

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 (48) hide show
  1. package/dist/cjs/CompositionManager.d.ts +5 -2
  2. package/dist/cjs/HtmlInCanvas.d.ts +4 -3
  3. package/dist/cjs/HtmlInCanvas.js +7 -10
  4. package/dist/cjs/Img.d.ts +6 -4
  5. package/dist/cjs/Img.js +10 -13
  6. package/dist/cjs/Interactive.d.ts +187 -2
  7. package/dist/cjs/Interactive.js +12 -10
  8. package/dist/cjs/Sequence.d.ts +4 -3
  9. package/dist/cjs/Sequence.js +35 -9
  10. package/dist/cjs/animated-image/AnimatedImage.d.ts +2 -3
  11. package/dist/cjs/animated-image/AnimatedImage.js +7 -10
  12. package/dist/cjs/animated-image/props.d.ts +2 -3
  13. package/dist/cjs/canvas-image/CanvasImage.d.ts +5 -3
  14. package/dist/cjs/canvas-image/CanvasImage.js +86 -42
  15. package/dist/cjs/canvas-image/props.d.ts +5 -4
  16. package/dist/cjs/effects/Solid.d.ts +2 -2
  17. package/dist/cjs/effects/Solid.js +7 -10
  18. package/dist/cjs/effects/create-effect.d.ts +2 -2
  19. package/dist/cjs/effects/effect-types.d.ts +2 -2
  20. package/dist/cjs/effects/index.d.ts +2 -1
  21. package/dist/cjs/effects/index.js +3 -0
  22. package/dist/cjs/find-props-to-delete.d.ts +2 -2
  23. package/dist/cjs/flatten-schema.d.ts +3 -3
  24. package/dist/cjs/index.d.ts +4 -4
  25. package/dist/cjs/index.js +16 -14
  26. package/dist/cjs/interactivity-schema.d.ts +524 -0
  27. package/dist/cjs/interactivity-schema.js +143 -0
  28. package/dist/cjs/internals.d.ts +95 -21
  29. package/dist/cjs/internals.js +12 -11
  30. package/dist/cjs/interpolate-keyframed-status.js +14 -3
  31. package/dist/cjs/no-react.d.ts +11 -12
  32. package/dist/cjs/no-react.js +2 -2
  33. package/dist/cjs/series/index.js +4 -4
  34. package/dist/cjs/use-media-in-timeline.js +2 -0
  35. package/dist/cjs/use-schema.d.ts +21 -3
  36. package/dist/cjs/use-schema.js +5 -2
  37. package/dist/cjs/version.d.ts +1 -1
  38. package/dist/cjs/version.js +1 -1
  39. package/dist/cjs/with-interactivity-schema.d.ts +20 -0
  40. package/dist/cjs/with-interactivity-schema.js +203 -0
  41. package/dist/cjs/wrap-in-schema.d.ts +3 -3
  42. package/dist/cjs/wrap-in-schema.js +2 -2
  43. package/dist/esm/index.mjs +242 -171
  44. package/dist/esm/no-react.mjs +133 -131
  45. package/dist/esm/version.mjs +1 -1
  46. package/package.json +2 -2
  47. package/dist/cjs/interpolate-translate.d.ts +0 -8
  48. package/dist/cjs/interpolate-translate.js +0 -70
@@ -636,6 +636,139 @@ var deserializeJSONWithSpecialTypes = (data) => {
636
636
  });
637
637
  };
638
638
 
639
+ // src/interactivity-schema.ts
640
+ var transformSchema = {
641
+ "style.transformOrigin": {
642
+ type: "transform-origin",
643
+ step: 1,
644
+ default: "50% 50%",
645
+ description: "Transform origin"
646
+ },
647
+ "style.translate": {
648
+ type: "translate",
649
+ step: 1,
650
+ default: "0px 0px",
651
+ description: "Offset"
652
+ },
653
+ "style.scale": {
654
+ type: "scale",
655
+ max: 100,
656
+ step: 0.01,
657
+ default: 1,
658
+ description: "Scale"
659
+ },
660
+ "style.rotate": {
661
+ type: "rotation-css",
662
+ step: 1,
663
+ default: "0deg",
664
+ description: "Rotation"
665
+ },
666
+ "style.opacity": {
667
+ type: "number",
668
+ min: 0,
669
+ max: 1,
670
+ step: 0.01,
671
+ default: 1,
672
+ description: "Opacity",
673
+ hiddenFromList: false
674
+ }
675
+ };
676
+ var premountSchema = {
677
+ premountFor: {
678
+ type: "number",
679
+ default: 0,
680
+ description: "Premount For",
681
+ min: 0,
682
+ step: 1,
683
+ hiddenFromList: false
684
+ },
685
+ postmountFor: {
686
+ type: "number",
687
+ default: 0,
688
+ min: 0,
689
+ step: 1,
690
+ hiddenFromList: true
691
+ },
692
+ styleWhilePremounted: {
693
+ type: "hidden"
694
+ },
695
+ styleWhilePostmounted: {
696
+ type: "hidden"
697
+ }
698
+ };
699
+ var sequenceStyleSchema = {
700
+ ...transformSchema,
701
+ ...premountSchema
702
+ };
703
+ var hiddenField = {
704
+ type: "boolean",
705
+ default: false,
706
+ description: "Hidden"
707
+ };
708
+ var showInTimelineField = {
709
+ type: "hidden"
710
+ };
711
+ var sequenceNameField = {
712
+ type: "hidden"
713
+ };
714
+ var durationInFramesField = {
715
+ type: "number",
716
+ default: undefined,
717
+ min: 1,
718
+ step: 1,
719
+ hiddenFromList: true
720
+ };
721
+ var fromField = {
722
+ type: "number",
723
+ default: 0,
724
+ step: 1,
725
+ hiddenFromList: true
726
+ };
727
+ var freezeField = {
728
+ type: "number",
729
+ default: null,
730
+ step: 1,
731
+ hiddenFromList: true
732
+ };
733
+ var baseSchema = {
734
+ durationInFrames: durationInFramesField,
735
+ from: fromField,
736
+ freeze: freezeField,
737
+ hidden: hiddenField,
738
+ name: sequenceNameField,
739
+ showInTimeline: showInTimelineField
740
+ };
741
+ var sequenceSchema = {
742
+ ...baseSchema,
743
+ layout: {
744
+ type: "enum",
745
+ default: "absolute-fill",
746
+ description: "Layout",
747
+ variants: {
748
+ "absolute-fill": sequenceStyleSchema,
749
+ none: {}
750
+ }
751
+ }
752
+ };
753
+ var baseSchemaWithoutFrom = {
754
+ durationInFrames: durationInFramesField,
755
+ freeze: freezeField,
756
+ hidden: hiddenField,
757
+ name: sequenceNameField,
758
+ showInTimeline: showInTimelineField
759
+ };
760
+ var sequenceSchemaWithoutFrom = {
761
+ ...baseSchemaWithoutFrom,
762
+ layout: sequenceSchema.layout
763
+ };
764
+ var sequenceSchemaDefaultLayoutNone = {
765
+ ...sequenceSchema,
766
+ layout: {
767
+ ...sequenceSchema.layout,
768
+ default: "none"
769
+ }
770
+ };
771
+
639
772
  // src/interpolate-colors.ts
640
773
  var NUMBER = "[-+]?\\d*\\.?\\d+";
641
774
  var PERCENTAGE = NUMBER + "%";
@@ -1138,137 +1271,6 @@ var serializeScaleValue = ([x, y, z]) => {
1138
1271
  return `${normalizedX} ${normalizedY} ${normalizedZ}`;
1139
1272
  };
1140
1273
 
1141
- // src/sequence-field-schema.ts
1142
- var sequenceVisualStyleSchema = {
1143
- "style.transformOrigin": {
1144
- type: "transform-origin",
1145
- step: 1,
1146
- default: "50% 50%",
1147
- description: "Transform origin"
1148
- },
1149
- "style.translate": {
1150
- type: "translate",
1151
- step: 1,
1152
- default: "0px 0px",
1153
- description: "Offset"
1154
- },
1155
- "style.scale": {
1156
- type: "scale",
1157
- max: 100,
1158
- step: 0.01,
1159
- default: 1,
1160
- description: "Scale"
1161
- },
1162
- "style.rotate": {
1163
- type: "rotation-css",
1164
- step: 1,
1165
- default: "0deg",
1166
- description: "Rotation"
1167
- },
1168
- "style.opacity": {
1169
- type: "number",
1170
- min: 0,
1171
- max: 1,
1172
- step: 0.01,
1173
- default: 1,
1174
- description: "Opacity",
1175
- hiddenFromList: false
1176
- }
1177
- };
1178
- var sequencePremountSchema = {
1179
- premountFor: {
1180
- type: "number",
1181
- default: 0,
1182
- description: "Premount For",
1183
- min: 0,
1184
- step: 1,
1185
- hiddenFromList: false
1186
- },
1187
- postmountFor: {
1188
- type: "number",
1189
- default: 0,
1190
- min: 0,
1191
- step: 1,
1192
- hiddenFromList: true
1193
- },
1194
- styleWhilePremounted: {
1195
- type: "hidden"
1196
- },
1197
- styleWhilePostmounted: {
1198
- type: "hidden"
1199
- }
1200
- };
1201
- var sequenceStyleSchema = {
1202
- ...sequenceVisualStyleSchema,
1203
- ...sequencePremountSchema
1204
- };
1205
- var hiddenField = {
1206
- type: "boolean",
1207
- default: false,
1208
- description: "Hidden"
1209
- };
1210
- var showInTimelineField = {
1211
- type: "hidden"
1212
- };
1213
- var sequenceNameField = {
1214
- type: "hidden"
1215
- };
1216
- var extendSchemaWithSequenceName = (schema) => {
1217
- return {
1218
- name: sequenceNameField,
1219
- ...schema
1220
- };
1221
- };
1222
- var durationInFramesField = {
1223
- type: "number",
1224
- default: undefined,
1225
- min: 1,
1226
- step: 1,
1227
- hiddenFromList: true
1228
- };
1229
- var fromField = {
1230
- type: "number",
1231
- default: 0,
1232
- step: 1,
1233
- hiddenFromList: true
1234
- };
1235
- var freezeField = {
1236
- type: "number",
1237
- default: null,
1238
- step: 1,
1239
- hiddenFromList: true
1240
- };
1241
- var sequenceSchema = extendSchemaWithSequenceName({
1242
- hidden: hiddenField,
1243
- showInTimeline: showInTimelineField,
1244
- from: fromField,
1245
- freeze: freezeField,
1246
- durationInFrames: durationInFramesField,
1247
- layout: {
1248
- type: "enum",
1249
- default: "absolute-fill",
1250
- description: "Layout",
1251
- variants: {
1252
- "absolute-fill": sequenceStyleSchema,
1253
- none: {}
1254
- }
1255
- }
1256
- });
1257
- var sequenceSchemaWithoutFrom = extendSchemaWithSequenceName({
1258
- hidden: hiddenField,
1259
- showInTimeline: showInTimelineField,
1260
- freeze: freezeField,
1261
- durationInFrames: durationInFramesField,
1262
- layout: sequenceSchema.layout
1263
- });
1264
- var sequenceSchemaDefaultLayoutNone = {
1265
- ...sequenceSchema,
1266
- layout: {
1267
- ...sequenceSchema.layout,
1268
- default: "none"
1269
- }
1270
- };
1271
-
1272
1274
  // src/v5-flag.ts
1273
1275
  var ENABLE_V5_BREAKING_CHANGES = false;
1274
1276
 
@@ -1,5 +1,5 @@
1
1
  // src/version.ts
2
- var VERSION = "4.0.477";
2
+ var VERSION = "4.0.479";
3
3
  export {
4
4
  VERSION
5
5
  };
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "url": "https://github.com/remotion-dev/remotion/tree/main/packages/core"
4
4
  },
5
5
  "name": "remotion",
6
- "version": "4.0.477",
6
+ "version": "4.0.479",
7
7
  "description": "Make videos programmatically",
8
8
  "main": "dist/cjs/index.js",
9
9
  "types": "dist/cjs/index.d.ts",
@@ -35,7 +35,7 @@
35
35
  "react-dom": "19.2.3",
36
36
  "webpack": "5.105.0",
37
37
  "zod": "4.3.6",
38
- "@remotion/eslint-config-internal": "4.0.477",
38
+ "@remotion/eslint-config-internal": "4.0.479",
39
39
  "eslint": "9.19.0",
40
40
  "@typescript/native-preview": "7.0.0-dev.20260217.1"
41
41
  },
@@ -1,8 +0,0 @@
1
- import { type InterpolateOptions } from './interpolate.js';
2
- export type InterpolateTranslateOptions = InterpolateOptions;
3
- export declare const interpolateTranslate: (input: number, inputRange: readonly number[], outputRange: readonly string[], options?: Partial<{
4
- easing: import("./interpolate.js").EasingFunction | readonly import("./interpolate.js").EasingFunction[];
5
- extrapolateLeft: import("./interpolate.js").ExtrapolateType;
6
- extrapolateRight: import("./interpolate.js").ExtrapolateType;
7
- posterize: number;
8
- }> | undefined) => string;
@@ -1,70 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.interpolateTranslate = void 0;
4
- const interpolate_js_1 = require("./interpolate.js");
5
- const pixelValueRegex = /^([+-]?(?:\d+\.?\d*|\.\d+))px$/;
6
- const parseTranslate = (value) => {
7
- if (typeof value !== 'string') {
8
- throw new TypeError(`outputRange must contain only strings, but got ${typeof value}`);
9
- }
10
- const parts = value.trim().split(/\s+/);
11
- if (parts.length < 1 || parts.length > 3 || parts[0] === '') {
12
- throw new TypeError(`translate values must contain 1 to 3 pixel values, but got "${value}"`);
13
- }
14
- return parts.map((part) => {
15
- const match = pixelValueRegex.exec(part);
16
- if (match === null) {
17
- throw new TypeError(`interpolateTranslate() only supports px values, but got "${part}" in "${value}"`);
18
- }
19
- return Number(match[1]);
20
- });
21
- };
22
- /*
23
- * @description Allows you to map a range of values to CSS translate values using pixel units.
24
- * @see [Documentation](https://remotion.dev/docs/interpolate-translate)
25
- */
26
- const interpolateTranslate = (input, inputRange, outputRange, options) => {
27
- var _a;
28
- if (typeof input === 'undefined') {
29
- throw new TypeError('input can not be undefined');
30
- }
31
- if (typeof inputRange === 'undefined') {
32
- throw new TypeError('inputRange can not be undefined');
33
- }
34
- if (typeof outputRange === 'undefined') {
35
- throw new TypeError('outputRange can not be undefined');
36
- }
37
- if (inputRange.length !== outputRange.length) {
38
- throw new TypeError('inputRange (' +
39
- inputRange.length +
40
- ' values provided) and outputRange (' +
41
- outputRange.length +
42
- ' values provided) must have the same length');
43
- }
44
- const parsedOutputRange = outputRange.map((translateValue) => parseTranslate(translateValue));
45
- const firstValueLength = (_a = parsedOutputRange[0]) === null || _a === void 0 ? void 0 : _a.length;
46
- if (firstValueLength === undefined) {
47
- throw new TypeError('outputRange must have at least 1 element');
48
- }
49
- for (const parsedTranslate of parsedOutputRange) {
50
- if (parsedTranslate.length !== firstValueLength) {
51
- throw new TypeError(`All translate values must have the same number of pixel values, but got ${firstValueLength} and ${parsedTranslate.length}`);
52
- }
53
- }
54
- return new Array(firstValueLength)
55
- .fill(true)
56
- .map((_, index) => {
57
- const outputValues = [];
58
- for (const translateValue of parsedOutputRange) {
59
- const value = translateValue[index];
60
- if (value === undefined) {
61
- throw new TypeError(`All translate values must have the same number of pixel values, but got ${firstValueLength} and ${translateValue.length}`);
62
- }
63
- outputValues.push(value);
64
- }
65
- const interpolatedValue = (0, interpolate_js_1.interpolate)(input, inputRange, outputValues, options);
66
- return `${interpolatedValue}px`;
67
- })
68
- .join(' ');
69
- };
70
- exports.interpolateTranslate = interpolateTranslate;