remotion 3.3.45 → 3.3.52

package/dist/esm/test/easing.test.js

@@ -0,0 +1,189 @@
+import { describe, expect, test } from 'vitest';
+import { Easing } from '../easing.js';
+const numbersToTest = [-0.5, 0, 0.4, 0.5, 0.7, 1, 1.5];
+describe('Easing step0', () => {
+    const step0 = (n) => {
+        return n > 0 ? 1 : 0;
+    };
+    const out = (n) => 1 - step0(1 - n);
+    const inOut = (n) => {
+        if (n >= 0.5) {
+            return 1 - step0((1 - n) * 2) / 2;
+        }
+        return step0(n * 2) / 2;
+    };
+    test('Easing In', () => {
+        const easingIn = Easing.in(Easing.step0);
+        numbersToTest.forEach((n) => expect(easingIn(n)).toBe(step0(n)));
+    });
+    test('Easing Out', () => {
+        const easingOut = Easing.out(Easing.step0);
+        numbersToTest.forEach((n) => expect(easingOut(n)).toBe(out(n)));
+    });
+    test('Easing In Out', () => {
+        const easingInOut = Easing.inOut(Easing.step0);
+        numbersToTest.forEach((n) => expect(easingInOut(n)).toBe(inOut(n)));
+    });
+});
+describe('Easing step1', () => {
+    const step1 = (n) => {
+        return n >= 1 ? 1 : 0;
+    };
+    const out = (n) => 1 - step1(1 - n);
+    const inOut = (n) => {
+        if (n >= 0.5) {
+            return 1 - step1((1 - n) * 2) / 2;
+        }
+        return step1(n * 2) / 2;
+    };
+    test('Easing In', () => {
+        const easingIn = Easing.in(Easing.step1);
+        numbersToTest.forEach((n) => expect(easingIn(n)).toBe(step1(n)));
+    });
+    test('Easing Out', () => {
+        const easingOut = Easing.out(Easing.step1);
+        numbersToTest.forEach((n) => expect(easingOut(n)).toBe(out(n)));
+    });
+    test('Easing In Out', () => {
+        const easingInOut = Easing.inOut(Easing.step1);
+        numbersToTest.forEach((n) => expect(easingInOut(n)).toBe(inOut(n)));
+    });
+});
+describe('Easing linear', () => {
+    test('Easing In', () => {
+        const easingIn = Easing.in(Easing.linear);
+        numbersToTest.forEach((n) => expect(easingIn(n)).toBe(n));
+    });
+    test('Easing In Out', () => {
+        const easingOut = Easing.out(Easing.linear);
+        numbersToTest.forEach((n) => expect(easingOut(n)).toBe(n));
+    });
+    test('Easing Out', () => {
+        const easingInOut = Easing.inOut(Easing.linear);
+        numbersToTest.forEach((n) => expect(easingInOut(n)).toBe(n));
+    });
+});
+describe('Easing Quadratic', () => {
+    const quad = (n) => n * n;
+    const out = (n) => 1 - quad(1 - n);
+    const inOut = (n) => {
+        if (n >= 0.5) {
+            return 1 - quad((1 - n) * 2) / 2;
+        }
+        return quad(n * 2) / 2;
+    };
+    test('Easing In', () => {
+        const easingIn = Easing.in(Easing.quad);
+        numbersToTest.forEach((n) => expect(easingIn(n)).toBe(quad(n)));
+    });
+    test('Easing In Out', () => {
+        const easingOut = Easing.out(Easing.quad);
+        numbersToTest.forEach((n) => expect(easingOut(n)).toBe(out(n)));
+    });
+    test('Easing Out', () => {
+        const easingInOut = Easing.inOut(Easing.quad);
+        numbersToTest.forEach((n) => expect(easingInOut(n)).toBe(inOut(n)));
+    });
+});
+describe('Easing Cubic', () => {
+    const cubic = (n) => n * n * n;
+    const out = (n) => 1 - cubic(1 - n);
+    const inOut = (n) => {
+        if (n >= 0.5) {
+            return 1 - cubic((1 - n) * 2) / 2;
+        }
+        return cubic(n * 2) / 2;
+    };
+    test('Easing In', () => {
+        const easingIn = Easing.in(Easing.cubic);
+        numbersToTest.forEach((n) => expect(easingIn(n)).toBe(cubic(n)));
+    });
+    test('Easing In Out', () => {
+        const easingOut = Easing.out(Easing.cubic);
+        numbersToTest.forEach((n) => expect(easingOut(n)).toBe(out(n)));
+    });
+    test('Easing Out', () => {
+        const easingInOut = Easing.inOut(Easing.cubic);
+        numbersToTest.forEach((n) => expect(easingInOut(n)).toBe(inOut(n)));
+    });
+});
+describe('Easing Circle', () => {
+    const circle = (n) => 1 - Math.sqrt(1 - n * n);
+    const out = (n) => 1 - circle(1 - n);
+    const inOut = (n) => {
+        if (n >= 0.5) {
+            return 1 - circle((1 - n) * 2) / 2;
+        }
+        return circle(n * 2) / 2;
+    };
+    test('Easing In', () => {
+        const easingIn = Easing.in(Easing.circle);
+        numbersToTest.forEach((n) => expect(easingIn(n)).toBe(circle(n)));
+    });
+    test('Easing In Out', () => {
+        const easingOut = Easing.out(Easing.circle);
+        numbersToTest.forEach((n) => expect(easingOut(n)).toBe(out(n)));
+    });
+    test('Easing Out', () => {
+        const easingInOut = Easing.inOut(Easing.circle);
+        numbersToTest.forEach((n) => expect(easingInOut(n)).toBe(inOut(n)));
+    });
+});
+describe('Easing Exp', () => {
+    const exp = (n) => 2 ** (10 * (n - 1));
+    const out = (n) => 1 - exp(1 - n);
+    const inOut = (n) => {
+        if (n >= 0.5) {
+            return 1 - exp((1 - n) * 2) / 2;
+        }
+        return exp(n * 2) / 2;
+    };
+    test('Easing In', () => {
+        const easingIn = Easing.in(Easing.exp);
+        numbersToTest.forEach((n) => expect(easingIn(n)).toBe(exp(n)));
+    });
+    test('Easing In Out', () => {
+        const easingOut = Easing.out(Easing.exp);
+        numbersToTest.forEach((n) => expect(easingOut(n)).toBe(out(n)));
+    });
+    test('Easing Out', () => {
+        const easingInOut = Easing.inOut(Easing.exp);
+        numbersToTest.forEach((n) => expect(easingInOut(n)).toBe(inOut(n)));
+    });
+});
+describe('Easing Bounce', () => {
+    const bounce = (n) => {
+        if (n < 1 / 2.75) {
+            return 7.5625 * n * n;
+        }
+        if (n < 2 / 2.75) {
+            const t2_ = n - 1.5 / 2.75;
+            return 7.5625 * t2_ * t2_ + 0.75;
+        }
+        if (n < 2.5 / 2.75) {
+            const t2_ = n - 2.25 / 2.75;
+            return 7.5625 * t2_ * t2_ + 0.9375;
+        }
+        const t2 = n - 2.625 / 2.75;
+        return 7.5625 * t2 * t2 + 0.984375;
+    };
+    const out = (n) => 1 - bounce(1 - n);
+    const inOut = (n) => {
+        if (n >= 0.5) {
+            return 1 - bounce((1 - n) * 2) / 2;
+        }
+        return bounce(n * 2) / 2;
+    };
+    test('Easing In', () => {
+        const easingIn = Easing.in(Easing.bounce);
+        numbersToTest.forEach((n) => expect(easingIn(n)).toBe(bounce(n)));
+    });
+    test('Easing In Out', () => {
+        const easingOut = Easing.out(Easing.bounce);
+        numbersToTest.forEach((n) => expect(easingOut(n)).toBe(out(n)));
+    });
+    test('Easing Out', () => {
+        const easingInOut = Easing.inOut(Easing.bounce);
+        numbersToTest.forEach((n) => expect(easingInOut(n)).toBe(inOut(n)));
+    });
+});

package/dist/esm/test/expect-to-throw.d.ts

@@ -0,0 +1 @@
+export declare const expectToThrow: (func: Function, err: RegExp) => void;

package/dist/esm/test/expect-to-throw.js

@@ -0,0 +1,11 @@
+import { expect, vitest } from 'vitest';
+export const expectToThrow = (func, err) => {
+    // Even though the error is caught, it still gets printed to the console
+    // so we mock that out to avoid the wall of red text.
+    vitest.spyOn(console, 'error');
+    // @ts-expect-error
+    console.error.mockImplementation(() => undefined);
+    expect(func).toThrow(err);
+    // @ts-expect-error
+    console.error.mockRestore();
+};

package/dist/esm/test/freeze.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/test/freeze.test.js

@@ -0,0 +1,63 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @vitest-environment jsdom
+ */
+import { render } from '@testing-library/react';
+import { describe, expect, test } from 'vitest';
+import { CanUseRemotionHooksProvider } from '../CanUseRemotionHooks.js';
+import { Freeze } from '../freeze.js';
+import { Sequence } from '../Sequence.js';
+import { TimelineContext } from '../timeline-position-state.js';
+import { useCurrentFrame } from '../use-current-frame.js';
+import { expectToThrow } from './expect-to-throw.js';
+import { WrapSequenceContext } from './wrap-sequence-context.js';
+describe('Prop validation', () => {
+    test('It should throw if Freeze has string as frame prop value', () => {
+        expectToThrow(
+        // @ts-expect-error
+        () => render(_jsx(Freeze, { frame: '0' })), /The 'frame' prop of <Freeze \/> must be a number, but is of type string/);
+    });
+    test('It should throw if Freeze has undefined as frame prop value', () => {
+        expectToThrow(
+        // @ts-expect-error
+        () => render(_jsx(Freeze, {})), /The <Freeze \/> component requires a 'frame' prop, but none was passed./);
+    });
+});
+const timelineCtxValue = (frame) => ({
+    rootId: '',
+    frame,
+    playing: false,
+    imperativePlaying: {
+        current: false,
+    },
+    playbackRate: 1,
+    setPlaybackRate: () => {
+        throw new Error('playback rate');
+    },
+    audioAndVideoTags: { current: [] },
+});
+const renderForFrame = (frame, markup) => {
+    return render(_jsx(CanUseRemotionHooksProvider, { children: _jsx(TimelineContext.Provider, { value: timelineCtxValue(frame), children: markup }) }));
+};
+const Basic = () => {
+    return (_jsx(Freeze, { frame: 300, children: _jsx(TestComponent, {}) }));
+};
+const WithSequence = () => {
+    const SequenceFrom = 200;
+    const FreezeFrame = 100;
+    return (_jsx(WrapSequenceContext, { children: _jsx(Sequence, { from: SequenceFrom, layout: "none", children: _jsx(Freeze, { frame: FreezeFrame, children: _jsx(TestComponent, {}) }) }) }));
+};
+const TestComponent = () => {
+    const frame = useCurrentFrame();
+    return _jsx("div", { children: frame });
+};
+describe('Integration tests', () => {
+    test('Basic test', () => {
+        const { container } = renderForFrame(0, _jsx(Basic, {}));
+        expect(container.innerHTML).toBe('<div>300</div>');
+    });
+    test('Should ignore a Sequence', () => {
+        const { container } = renderForFrame(300, _jsx(WithSequence, {}));
+        expect(container.innerHTML).toBe('<div>100</div>');
+    });
+});

package/dist/esm/test/get-asset-file-name.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/test/get-asset-file-name.test.js

@@ -0,0 +1,12 @@
+import { describe, expect, test } from 'vitest';
+import { getAssetDisplayName } from '../get-asset-file-name.js';
+describe('get asset file name test', () => {
+    const testStrings = [
+        ['assets/images/sample.png', 'sample.png'],
+        ['assets\\images\\sample.png', 'sample.png'],
+        ['sample.png', 'sample.png'],
+    ];
+    testStrings.forEach((entry) => test(`test for ${entry[0]}`, () => {
+        expect(getAssetDisplayName(entry[0])).toEqual(entry[1]);
+    }));
+});

package/dist/esm/test/get-current-time.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/test/get-current-time.test.js

@@ -0,0 +1,72 @@
+import { describe, expect, test } from 'vitest';
+import { getMediaTime } from '../video/get-current-time.js';
+describe('correctly calculate media time of video element', () => {
+    const mp4Precision = 0.04;
+    const webmPrecision = 0.02;
+    describe('src mp4', () => {
+        test('mp4 - Should correctly calculate the media time of a video element', () => {
+            expect(getMediaTime({
+                fps: 30,
+                frame: 30,
+                playbackRate: 1,
+                src: 'video.mp4',
+                startFrom: 0,
+                mediaType: 'video',
+            })).toBeCloseTo(1, mp4Precision);
+        });
+        test('mp4 - Should correctly calculate the media time of a video element with faster framerate', () => {
+            expect(getMediaTime({
+                fps: 30,
+                frame: 30,
+                playbackRate: 2,
+                src: 'video.mp4',
+                startFrom: 0,
+                mediaType: 'video',
+            })).toBeCloseTo(2, mp4Precision);
+        });
+        test('mp4 - Should correctly calculate the media time of a video element with faster framerate and a startFrom', () => {
+            // If playbackrate is 2, but the video only starts after 1 second, at 2sec, the video position should be 3sec
+            expect(getMediaTime({
+                fps: 30,
+                frame: 60,
+                playbackRate: 2,
+                src: 'video.mp4',
+                startFrom: 30,
+                mediaType: 'video',
+            })).toBeCloseTo(3, mp4Precision);
+        });
+    });
+    describe('src webm', () => {
+        test('webm - Should correctly calculate the media time of a video element', () => {
+            expect(getMediaTime({
+                fps: 30,
+                frame: 30,
+                playbackRate: 1,
+                src: 'video.webm',
+                startFrom: 0,
+                mediaType: 'video',
+            })).toBeCloseTo(1, webmPrecision);
+        });
+        test('webm - Should correctly calculate the media time of a video element with faster framerate', () => {
+            expect(getMediaTime({
+                fps: 30,
+                frame: 30,
+                playbackRate: 2,
+                src: 'video.webm',
+                startFrom: 0,
+                mediaType: 'video',
+            })).toBeCloseTo(2, webmPrecision);
+        });
+        test('webm - Should correctly calculate the media time of a video element with faster framerate and a startFrom', () => {
+            // If playbackrate is 2, but the video only starts after 1 second, at 2sec, the video position should be 3sec
+            expect(getMediaTime({
+                fps: 30,
+                frame: 60,
+                playbackRate: 2,
+                src: 'video.webm',
+                startFrom: 30,
+                mediaType: 'video',
+            })).toBeCloseTo(3, webmPrecision);
+        });
+    });
+});

package/dist/esm/test/input-props.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/test/input-props.test.js

@@ -0,0 +1,29 @@
+/**
+ * @vitest-environment jsdom
+ */
+import { afterAll, beforeEach, describe, expect, test, vitest } from 'vitest';
+import { getInputProps } from '../config/input-props.js';
+describe('input props', () => {
+    const OLD_ENV = process.env;
+    beforeEach(() => {
+        vitest.resetModules(); // Most important - it clears the cache
+        process.env = { ...OLD_ENV }; // Make a copy
+    });
+    afterAll(() => {
+        process.env = OLD_ENV; // Restore old environment
+    });
+    test('input props in non production env', () => {
+        process.env.NODE_ENV = 'development';
+        const inputProps = {
+            firstProperty: 'firstProperty',
+            secondProperty: 'secondProperty',
+        };
+        window.remotion_inputProps = JSON.stringify(JSON.stringify(inputProps));
+        expect(getInputProps()).toEqual(JSON.stringify(inputProps));
+    });
+    test('input props in production env', () => {
+        process.env.NODE_ENV = 'production';
+        window.remotion_inputProps = JSON.stringify({});
+        expect(getInputProps()).toEqual({});
+    });
+});

package/dist/esm/test/interpolate.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/test/interpolate.test.js

@@ -0,0 +1,136 @@
+import { describe, expect, test } from 'vitest';
+import { Easing } from '../easing.js';
+import { interpolate } from '../interpolate.js';
+import { expectToThrow } from './expect-to-throw.js';
+describe('Basic interpolations', () => {
+    test('Input and output range strictly monotonically increasing', () => {
+        expect(interpolate(1, [0, 1], [0, 2])).toEqual(2);
+    });
+    test('Input range strictly monotonically increasing, Output range non-increasing', () => {
+        expect(interpolate(1, [0, 1], [2, 2])).toEqual(2);
+    });
+    test('Interpolate with 4 values, output non-increasing', () => {
+        expect(interpolate(Math.PI, [0, 1, 4, 9], [0, 2, 1000, -1000])).toEqual(714.4364894275378);
+    });
+    test('Interpolate Infinity: output range increasing', () => {
+        expect(interpolate(Infinity, [0, 1], [0, 2])).toEqual(Infinity);
+    });
+    test('Interpolate Infinity: output range decreasing', () => {
+        expect(interpolate(Infinity, [0, 1], [1, 0])).toEqual(-Infinity);
+    });
+});
+test('Must be the same length', () => {
+    expectToThrow(() => {
+        interpolate(1, [0, 2], [0, 1, 2]);
+    }, /inputRange \(2\) and outputRange \(3\) must have the same length/);
+});
+test('Must pass at least 2 elements for input range', () => {
+    expectToThrow(() => {
+        interpolate(1, [0], [9]);
+    }, /inputRange must have at least 2 elements/);
+});
+test('Input range must be strictly monotonically non-decreasing', () => {
+    expectToThrow(() => {
+        interpolate(1, [0, 1, 0.5], [0, 2, 0.2]);
+    }, /inputRange must be strictly monotonically non-decreasing/);
+    expectToThrow(() => {
+        interpolate(0.75, [0, 1, 1], [0, 2, 0]);
+    }, /inputRange must be strictly monotonically non-decreasing/);
+});
+test('Output range can be non-monotonic', () => {
+    expect(interpolate(0.75, [0, 0.5, 1], [0, 2, 0])).toEqual(1);
+});
+test('Output range monotonically decreasing', () => {
+    expect(interpolate(0.75, [0, 0.5, 1], [0, 2, 2])).toEqual(2);
+});
+test('Cannot have Infinity in input range', () => {
+    expectToThrow(() => {
+        interpolate(1, [-Infinity, 0], [0, 2]);
+    }, /inputRange must contain only finite numbers, but got \[-Infinity,0\]/);
+});
+test('Cannot have Infinity in output Range', () => {
+    expectToThrow(() => interpolate(1, [0, 1], [Infinity, 2]), /outputRange must contain only finite numbers, but got \[Infinity,2\]/);
+});
+test('Should throw if passing 2x infinity input range', () => {
+    expectToThrow(() => interpolate(1, [Infinity, Infinity], [0, 2]), /inputRange must contain only finite numbers, but got \[Infinity,Infinity\]/);
+});
+test('Should throw if passing 2x infinity output range', () => {
+    expectToThrow(() => interpolate(1, [0, 1], [-Infinity, Infinity]), /outputRange must contain only finite numbers, but got \[-Infinity,Infinity\]/);
+});
+test('Should throw on Infinity as third argument', () => {
+    expectToThrow(() => interpolate(1, [0, 1, Infinity], [0, 2, 3]), /inputRange must contain only finite numbers, but got \[0,1,Infinity\]/);
+});
+test('Should throw on Infinity as third argument', () => {
+    expectToThrow(() => interpolate(1, [0, 1, Infinity], [0, 2, 3]), /inputRange must contain only finite numbers, but got \[0,1,Infinity\]/);
+});
+test('Easing test', () => {
+    expect(interpolate(0.5, [0, 1], [0, 1], {
+        easing: Easing.sin,
+    })).toEqual(1 - Math.cos((0.5 * Math.PI) / 2));
+});
+test('Extrapolation left test', () => {
+    const testValues = ['extend', undefined];
+    testValues.forEach((entry) => {
+        expect(interpolate(-3, [0, 1, 2], [0, 0.5, 1], {
+            extrapolateRight: entry,
+        })).toEqual(-1.5);
+    });
+});
+test('Extrapolation right test', () => {
+    const testValues = ['extend', undefined];
+    testValues.forEach((entry) => {
+        expect(interpolate(3, [0, 1, 2], [0, 0.5, 1], {
+            extrapolateRight: entry,
+        })).toEqual(1.5);
+    });
+});
+test('Extrapolation identity', () => {
+    const testValues = [
+        [1000, { extrapolateRight: 'identity' }],
+        [-1000, { extrapolateLeft: 'identity' }],
+    ];
+    testValues.forEach((entry) => {
+        expect(interpolate(entry[0], [0, 1, 2], [0, 2, 4], entry[1])).toBe(entry[0]);
+    });
+});
+test('Clamp right test', () => {
+    expect(interpolate(2000, [0, 1, 1000], [0, 1, -1000], {
+        extrapolateRight: 'clamp',
+    })).toEqual(-1000);
+});
+test('Clamp left test', () => {
+    expect(interpolate(-2000, [0, 1, 1000], [Math.PI, 1, -1000], {
+        extrapolateLeft: 'clamp',
+    })).toEqual(Math.PI);
+});
+test('Zig-zag test', () => {
+    const testValues = [
+        [3.5, -500],
+        [4, -1000],
+        [6, 3000],
+        [-0.1, -1100],
+    ];
+    testValues.forEach((entry) => {
+        expect(interpolate(entry[0], [1, 2, 3, 4, 5], [0, 1000, 0, -1000, 1000])).toBe(entry[1]);
+    });
+});
+test('Handle bad types', () => {
+    // @ts-expect-error
+    expect(() => interpolate(undefined, [0, 1], [1, 0])).toThrowError(/input can not be undefined/);
+    // @ts-expect-error
+    expect(() => interpolate(1, undefined, [1, 0])).toThrowError(/inputRange can not be undefined/);
+    // @ts-expect-error
+    expect(() => interpolate(1, [1, 0], undefined)).toThrowError(/outputRange can not be undefined/);
+    // @ts-expect-error
+    expect(() => interpolate(1)).toThrowError(/inputRange can not be undefined/);
+    // @ts-expect-error
+    expect(() => interpolate('1', [0, 1], [1, 0])).toThrowError(/Cannot interpolate an input which is not a number/);
+    // @ts-expect-error
+    expect(() => interpolate(1, 'string', 'string')).toThrowError(/inputRange must contain only numbers/);
+    // @ts-expect-error
+    expect(() => interpolate(1, [1, 2, 3], 'str')).toThrowError(/outputRange must contain only numbers/);
+    // @ts-expect-error
+    expect(() => interpolate(1, undefined, 'string')).toThrowError(/inputRange can not be undefined/);
+    // @ts-expect-error
+    expect(() => interpolate([1, 2], undefined, 'string')).toThrowError(/inputRange can not be undefined/);
+});

package/dist/esm/test/interpolateColors.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/test/interpolateColors.test.js

@@ -0,0 +1,61 @@
+import { describe, expect, test } from 'vitest';
+import { interpolateColors } from '../interpolate-colors.js';
+import { expectToThrow } from './expect-to-throw.js';
+test('Throws if color string is not right', () => {
+    expectToThrow(() => {
+        interpolateColors(1, [0, 1], ['#fabgdf', '#ffaabb']);
+    }, /invalid color string #fabgdf provided/);
+});
+describe('Throws error for undefined parameters', () => {
+    test('Undefined input', () => {
+        expectToThrow(() => {
+            // @ts-expect-error
+            interpolateColors(undefined, ['#aaa', '#bbb'], ['#fff', '#000']);
+        }, /input can not be undefined/);
+    });
+    test('Undefined inputRange', () => {
+        expectToThrow(() => {
+            // @ts-expect-error
+            interpolateColors(1, undefined, ['#fff', '#000']);
+        }, /inputRange can not be undefined/);
+    });
+    test('Undefined outputRange', () => {
+        expectToThrow(() => {
+            // @ts-expect-error
+            interpolateColors(1, ['#fff', '#000'], undefined);
+        }, /outputRange can not be undefined/);
+    });
+});
+test('inputRange and outputRange must be of same length', () => {
+    expectToThrow(() => {
+        interpolateColors(1, [1, 2, 3], ['#ffffff', '#aaaaaa']);
+    }, /inputRange \(3 values provided\) and outputRange \(2 values provided\) must have the same length/);
+});
+test('Basic interpolate Colors', () => {
+    expect(interpolateColors(1, [0, 1], ['#ffaadd', '#fabfdf'])).toBe('rgba(250, 191, 223, 1)');
+});
+test('Clamp Right', () => {
+    expect(interpolateColors(2, [0, 1], ['#ffaadd', '#fabfdf'])).toBe('rgba(250, 191, 223, 1)');
+});
+test('Clamp Left', () => {
+    expect(interpolateColors(-1, [0, 1], ['#ffaadd', '#fabfdf'])).toBe('rgba(255, 170, 221, 1)');
+});
+test('Color shorthands', () => {
+    expect(interpolateColors(1, [0, 1], ['#fad', '#fabfdf'])).toBe('rgba(250, 191, 223, 1)');
+});
+test('Color names', () => {
+    expect(interpolateColors(1, [0, 1], ['red', 'blue'])).toBe('rgba(0, 0, 255, 1)');
+});
+test('Mix transparency', () => {
+    expect(interpolateColors(0.5, [0, 1], ['transparent', 'blue'])).toBe('rgba(0, 0, 128, 0.5)');
+});
+test('HSV', () => {
+    expect(interpolateColors(0.5, [0, 1], ['hsla(120, 100%, 25%, 0)', 'blue'])).toBe('rgba(0, 64, 128, 0.5)');
+    expect(interpolateColors(0.5, [0, 1], ['hsl(120, 50%, 50%)', 'blue'])).toBe('rgba(32, 96, 160, 1)');
+});
+describe('RGB', () => {
+    test('standard rgb interpolation', () => expect(interpolateColors(0.5, [0, 1], ['rgb(0,0,0)', 'rgb(255,255,255)'])).toBe('rgba(128, 128, 128, 1)'));
+    test('rgb clamping', () => {
+        expect(interpolateColors(0.5, [0, 1], ['rgb(-1,0,0)', 'rgb(256,255,255)'])).toBe('rgba(128, 128, 128, 1)');
+    });
+});

package/dist/esm/test/loop-validation.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/test/loop-validation.test.js

@@ -0,0 +1,68 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @vitest-environment jsdom
+ */
+import { render } from '@testing-library/react';
+import React, { useContext } from 'react';
+import { describe, expect, test } from 'vitest';
+import { CanUseRemotionHooksProvider } from '../CanUseRemotionHooks.js';
+import { CompositionManager } from '../CompositionManager.js';
+import { Loop } from '../loop';
+import { RemotionRoot } from '../RemotionRoot.js';
+import { expectToThrow } from './expect-to-throw.js';
+const Wrapper = ({ children }) => {
+    const compositions = useContext(CompositionManager);
+    return (_jsx(CanUseRemotionHooksProvider, { children: _jsx(RemotionRoot, { numberOfAudioTags: 0, children: _jsx(CompositionManager.Provider
+            // eslint-disable-next-line react/jsx-no-constructed-context-values
+            , { 
+                // eslint-disable-next-line react/jsx-no-constructed-context-values
+                value: {
+                    ...compositions,
+                    compositions: [
+                        {
+                            height: 1080,
+                            width: 1080,
+                            fps: 30,
+                            durationInFrames: 30,
+                            id: 'markup',
+                            nonce: 0,
+                            component: React.lazy(() => Promise.resolve({
+                                default: (() => null),
+                            })),
+                            defaultProps: undefined,
+                            folderName: null,
+                            parentFolderName: null,
+                        },
+                    ],
+                    currentComposition: 'markup',
+                }, children: children }) }) }));
+};
+describe('Loop-validation render should throw with invalid props', () => {
+    describe('Throw with invalid durationInFrames prop', () => {
+        test('It should throw if Loop has non-number durationInFrames', () => {
+            expectToThrow(() => render(_jsx(Wrapper, { children: _jsx(Loop, { durationInFrames: '1', children: "hi" }) })), /The "durationInFrames" prop of the <Loop \/> component must be a number, but you passed a value of type string/);
+        });
+        test('It should throw if Loop has non-integer durationInFrames', () => {
+            expectToThrow(() => render(_jsx(Wrapper, { children: _jsx(Loop, { durationInFrames: 1.1, children: "hi" }) })), /The "durationInFrames" prop of the <Loop \/> component must be an integer, but got 1.1./);
+        });
+        test('It should throw if Loop has a negative duration', () => {
+            expectToThrow(() => render(_jsx(Wrapper, { children: _jsx(Loop, { durationInFrames: -1, children: "hi" }) })), /The "durationInFrames" prop of the <Loop \/> component must be positive, but got -1./);
+        });
+    });
+    describe('Throw with invalid times prop', () => {
+        test('It should throw if Loop has non-number times', () => {
+            expectToThrow(() => render(_jsx(Wrapper, { children: _jsx(Loop, { durationInFrames: 50, times: "1", children: "hi" }) })), /You passed to "times" an argument of type string, but it must be a number./);
+        });
+        test('It should throw if Loop has non-integer times', () => {
+            expectToThrow(() => render(_jsx(Wrapper, { children: _jsx(Loop, { durationInFrames: 50, times: 1.1, children: "hi" }) })), /The "times" prop of a loop must be an integer, but got 1.1./);
+        });
+    });
+});
+describe('Should NOT throw with valid props', () => {
+    test('It should allow null as children', () => {
+        expect(() => render(_jsx(Wrapper, { children: _jsx(Loop, { durationInFrames: 50, children: null }) }))).not.toThrow();
+    });
+    test('It should allow undefined as children', () => {
+        expect(() => render(_jsx(Wrapper, { children: _jsx(Loop, { durationInFrames: 50, children: undefined }) }))).not.toThrow();
+    });
+});