remotion 3.3.44 → 3.3.51

package/dist/esm/test/measure-spring.test.d.ts

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

package/dist/esm/test/measure-spring.test.js

@@ -0,0 +1,43 @@
+import { describe, expect, test } from 'vitest';
+import { measureSpring, spring } from '../spring';
+import { expectToThrow } from './expect-to-throw.js';
+describe('Measure spring should work', () => {
+    const duration = measureSpring({
+        fps: 30,
+    });
+    test('test measureSpring()', () => expect(duration).toBe(28));
+    test('spring should be close to 1', () => expect(spring({
+        fps: 30,
+        frame: duration,
+    })).toBeCloseTo(1));
+    test('spring should not be 1', () => expect(spring({
+        fps: 30,
+        frame: duration - 1,
+    })).not.toBe(1));
+});
+test('Higher threshold should lead to faster spring', () => {
+    expect(measureSpring({ fps: 30, threshold: 0.05 })).toBeLessThan(measureSpring({ fps: 30, threshold: 0.01 }));
+});
+test('Lower threshold should lead to slower spring', () => {
+    expect(measureSpring({ fps: 30, threshold: 0.001 })).toBeGreaterThan(measureSpring({ fps: 30, threshold: 0.01 }));
+});
+describe('Threshold edge cases', () => {
+    // threshold, expected
+    const validEdgeCases = [
+        [0, Infinity],
+        [1, 0],
+    ];
+    validEdgeCases.forEach((entry) => test('', () => expect(measureSpring({ fps: 30, threshold: entry[0] })).toBe(entry[1])));
+    // threshold, errMsg
+    const errorEdgeCases = [
+        [NaN, /Threshold is NaN/],
+        [Infinity, /Threshold is not finite/],
+        [null, /threshold must be a number, got null of type object/],
+    ];
+    errorEdgeCases.forEach((entry) => expectToThrow(
+    // @ts-expect-error
+    () => measureSpring({ fps: 30, threshold: entry[0] }), entry[1]));
+});
+test('Should throw on invalid FPS', () => {
+    expectToThrow(() => measureSpring({ fps: 0 }), /"fps" must be positive, but got 0./);
+});

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

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

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

@@ -0,0 +1,45 @@
+import { describe, expect, test } from 'vitest';
+import { validateMediaProps } from '../validate-media-props.js';
+import { expectToThrow } from './expect-to-throw.js';
+describe('ValidateMediaProps should throw with invalid volume inputs', () => {
+    const testComponents = ['Audio', 'Video'];
+    testComponents.forEach((component) => {
+        test(`It should not allow an ${component} element to have a negative volume `, () => {
+            expectToThrow(
+            // @ts-expect-error
+            () => validateMediaProps({ volume: -1 }, component), new RegExp(`You have passed a volume below 0 to your <${component} /> component. Volume must be between 0 and 1`));
+        });
+        test(`It should not allow an ${component} element to have an invalid type`, () => {
+            expectToThrow(
+            // @ts-expect-error
+            () => validateMediaProps({ volume: 'invalidType' }, component), new RegExp(`You have passed a volume of type string to your <${component} /> component.`));
+        });
+    });
+});
+describe('ValidateMediaProps should not throw with valid volume inputs', () => {
+    const validInputs = [
+        0,
+        1,
+        undefined,
+        () => 1,
+        (x) => x,
+    ];
+    validInputs.forEach((vol) => test(`valid volume ${vol} shold not throw`, () => {
+        // @ts-expect-error
+        expect(() => validateMediaProps({ volume: vol }, 'Video')).not.toThrow();
+    }));
+});
+describe('ValidateMediaProps should throw with invalid playbackRate', () => {
+    test(`It should not allow playbackRate of 0 or below.`, () => {
+        expectToThrow(() => validateMediaProps({ playbackRate: -1 }, 'Audio'), /You have passed a playbackRate of -1 to your <Audio \/> component. Playback rate must be a real number above 0./);
+    });
+    test(`It should not allow non-finite playbackRate.`, () => {
+        expectToThrow(() => validateMediaProps({ playbackRate: Infinity }, 'Audio'), /You have passed a playbackRate of Infinity to your <Audio \/> component. Playback rate must be a real number above 0./);
+    });
+    test(`It should not allow NaN playbackRate.`, () => {
+        expectToThrow(() => validateMediaProps({ playbackRate: NaN }, 'Audio'), /You have passed a playbackRate of NaN to your <Audio \/> component. Playback rate must be a real number above 0./);
+    });
+    test(`It should not allow regular playbackrate.`, () => {
+        expect(() => validateMediaProps({ playbackRate: 1 }, 'Audio')).not.toThrow();
+    });
+});

package/dist/esm/test/nested-sequences.test.d.ts

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

package/dist/esm/test/nested-sequences.test.js

@@ -0,0 +1,130 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @vitest-environment jsdom
+ */
+/* eslint-disable react/jsx-no-constructed-context-values */
+import { render } from '@testing-library/react';
+import { expect, test } from 'vitest';
+import { CanUseRemotionHooksProvider } from '../CanUseRemotionHooks.js';
+import { Sequence } from '../Sequence.js';
+import { TimelineContext } from '../timeline-position-state.js';
+import { useCurrentFrame } from '../use-current-frame.js';
+import { WrapSequenceContext } from './wrap-sequence-context.js';
+test('It should calculate the correct offset in nested sequences', () => {
+    const NestedChild = () => {
+        const frame = useCurrentFrame();
+        return _jsx("div", { children: 'frame' + frame });
+    };
+    const Child = () => {
+        return (_jsx(Sequence, { from: 10, durationInFrames: 50, children: _jsx(Child2, {}) }));
+    };
+    const Child2 = () => {
+        return (_jsx(Sequence, { from: 1, durationInFrames: 50, children: _jsx(NestedChild, {}) }));
+    };
+    const { queryByText } = render(_jsx(WrapSequenceContext, { children: _jsx(TimelineContext.Provider, { value: {
+                rootId: 'hi',
+                frame: 40,
+                playing: false,
+                imperativePlaying: {
+                    current: false,
+                },
+                playbackRate: 1,
+                setPlaybackRate: () => {
+                    throw new Error('playback rate');
+                },
+                audioAndVideoTags: {
+                    current: [],
+                },
+            }, children: _jsx(Sequence, { from: 20, durationInFrames: 100, children: _jsx(Child, {}) }) }) }));
+    expect(queryByText(/^frame9$/i)).not.toBe(null);
+});
+test('Negative offset test', () => {
+    const NestedChild = () => {
+        const frame = useCurrentFrame();
+        return _jsx("div", { children: 'frame' + frame });
+    };
+    const { queryByText } = render(_jsx(WrapSequenceContext, { children: _jsx(TimelineContext.Provider, { value: {
+                frame: 40,
+                playing: false,
+                rootId: 'hi',
+                imperativePlaying: {
+                    current: false,
+                },
+                playbackRate: 1,
+                setPlaybackRate: () => {
+                    throw new Error('playback rate');
+                },
+                audioAndVideoTags: {
+                    current: [],
+                },
+            }, children: _jsx(Sequence, { from: -200, durationInFrames: 300, children: _jsx(Sequence, { from: 10, durationInFrames: 300, children: _jsx(Sequence, { from: 10, durationInFrames: 300, children: _jsx(NestedChild, {}) }) }) }) }) }));
+    const result = queryByText(/^frame220/i);
+    expect(result).not.toBe(null);
+});
+test('Nested negative offset test', () => {
+    const NestedChild = () => {
+        const frame = useCurrentFrame();
+        return _jsx("div", { children: 'frame' + frame });
+    };
+    const startFrom = 40;
+    const endAt = 90;
+    const content = (_jsx(WrapSequenceContext, { children: _jsx(Sequence, { from: 0 - startFrom, durationInFrames: endAt, children: _jsx(NestedChild, {}) }) }));
+    const getForFrame = (frame) => {
+        const { queryByText } = render(_jsx(WrapSequenceContext, { children: _jsx(TimelineContext.Provider, { value: {
+                    frame,
+                    playing: false,
+                    rootId: 'hi',
+                    imperativePlaying: {
+                        current: false,
+                    },
+                    playbackRate: 1,
+                    setPlaybackRate: () => {
+                        throw new Error('playback rate');
+                    },
+                    audioAndVideoTags: {
+                        current: [],
+                    },
+                }, children: content }) }));
+        return queryByText;
+    };
+    const frame0 = getForFrame(0);
+    expect(frame0(/^frame40$/i)).not.toBe(null);
+    const frame39 = getForFrame(39);
+    expect(frame39(/^frame79$/i)).not.toBe(null);
+    const frame50 = getForFrame(50);
+    expect(frame50(/^frame90$/i)).toBe(null);
+});
+test.skip('Negative offset edge case', () => {
+    const NestedChild = () => {
+        const frame = useCurrentFrame();
+        return _jsx("div", { children: 'frame' + frame });
+    };
+    const startFrom = 40;
+    const endAt = 90;
+    const content = (_jsx(WrapSequenceContext, { children: _jsx(Sequence, { from: 40, children: _jsx(Sequence, { from: 0 - startFrom, durationInFrames: endAt, children: _jsx(NestedChild, {}) }) }) }));
+    const getForFrame = (frame) => {
+        const { queryByText } = render(_jsx(CanUseRemotionHooksProvider, { children: _jsx(TimelineContext.Provider, { value: {
+                    frame,
+                    playing: false,
+                    rootId: 'hi',
+                    imperativePlaying: {
+                        current: false,
+                    },
+                    playbackRate: 1,
+                    setPlaybackRate: () => {
+                        throw new Error('playback rate');
+                    },
+                    audioAndVideoTags: {
+                        current: [],
+                    },
+                }, children: content }) }));
+        return queryByText;
+    };
+    expect(getForFrame(0)(/^frame0/i)).toBe(null);
+    expect(getForFrame(10)(/^frame10/i)).toBe(null);
+    expect(getForFrame(40)(/^frame40$/i)).not.toBe(null);
+    const atFrame80 = getForFrame(80)(/^frame80$/i);
+    expect(atFrame80).not.toBe(null);
+    const atFrame90 = getForFrame(90)(/^frame90$/i);
+    expect(atFrame90).toBe(null);
+});

package/dist/esm/test/not-all-props-in-media-tags.test.d.ts

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

package/dist/esm/test/not-all-props-in-media-tags.test.js

@@ -0,0 +1,28 @@
+import fs from 'fs';
+import path from 'path';
+import { expect, test } from 'vitest';
+// Test for https://github.com/remotion-dev/remotion/issues/1243
+test('Should not have disableRemotePlayback props in the <VideoForDevelopment> component type definition', () => {
+    const file = path.resolve(process.cwd(), 'dist', 'esm', 'video', 'VideoForDevelopment.d.ts');
+    const read = fs.readFileSync(file, 'utf-8');
+    expect(read).not.toContain('disableRemotePlayback');
+    expect(read).toContain('volume-prop');
+});
+test('Should not have disableRemotePlayback props in the <VideoForRendering> component type definition', () => {
+    const file = path.resolve(process.cwd(), 'dist', 'esm', 'video', 'VideoForRendering.d.ts');
+    const read = fs.readFileSync(file, 'utf-8');
+    expect(read).not.toContain('disableRemotePlayback');
+    expect(read).toContain('volume-prop');
+});
+test('Should not have disableRemotePlayback props in the <AudioForDevelopment> component type definition', () => {
+    const file = path.resolve(process.cwd(), 'dist', 'esm', 'audio', 'AudioForDevelopment.d.ts');
+    const read = fs.readFileSync(file, 'utf-8');
+    expect(read).not.toContain('aria-disabled');
+    expect(read).toContain('volume-prop');
+});
+test('Should not have disableRemotePlayback props in the <AudioForRendering> component type definition', () => {
+    const file = path.resolve(process.cwd(), 'dist', 'esm', 'audio', 'AudioForRendering.d.ts');
+    const read = fs.readFileSync(file, 'utf-8');
+    expect(read).not.toContain('aria-disabled');
+    expect(read).toContain('volume-prop');
+});

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

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

package/dist/esm/test/random.test.js

@@ -0,0 +1,58 @@
+import { describe, expect, test } from 'vitest';
+import { random } from '../random.js';
+describe('Should support negative random numbers', () => {
+    test('test with -1', () => expect(random(-1)).toBe(random(-1)));
+    test('test with -2', () => expect(random(-2)).toBe(random(-2)));
+    test('different seeds should be different randoms', () => expect(random(-2)).not.toBe(random(-1)));
+});
+test('Random should be deterministic', () => {
+    expect(random(1)).toBe(random(1));
+    expect(random(2)).toBe(random(2));
+    expect(random(2)).not.toBe(random(1));
+    expect(random(null)).not.toBe(random(null));
+});
+describe('Random should be uniform', () => {
+    const ITEM_COUNT = 100000;
+    const mapped = new Array(ITEM_COUNT).fill(true).map((_a, i) => {
+        return random(i);
+    });
+    const average = mapped.reduce((a, b) => a + b, 0) / mapped.length;
+    test('test if average is around 0.5', () => {
+        expect(average).toBeLessThan(0.51);
+        expect(average).toBeGreaterThan(0.49);
+    });
+    const tenPercentSections = [];
+    const stepInterval = 0.1;
+    let currentStep = 0;
+    while (currentStep < 0.999999) {
+        const items = mapped.filter((m) => m >= currentStep && m <= currentStep + stepInterval);
+        tenPercentSections.push(items);
+        currentStep += stepInterval;
+    }
+    const ACCURACY = 0.005;
+    tenPercentSections.forEach((entries, index) => test(`section ${index} should contain around ${ITEM_COUNT * stepInterval} entries`, () => {
+        expect(entries.length).toBeLessThan(ITEM_COUNT * (stepInterval + ACCURACY));
+        expect(entries.length).toBeGreaterThan(ITEM_COUNT * (stepInterval - ACCURACY));
+    }));
+    test('test for average distance', () => {
+        const distances = mapped
+            .map((_a, i) => {
+            if (i === 0) {
+                return null;
+            }
+            return Math.abs(mapped[i] - mapped[i - 1]);
+        })
+            .filter((f) => f !== null);
+        const averageDistance = distances.reduce((a, b) => a + b, 0) / distances.length;
+        expect(averageDistance).toBeGreaterThan(0.3);
+    });
+});
+test('Random string should be uniform', () => {
+    const alphabet = 'abcdefghijlkmnopqrstuvwxyz0123456789';
+    const array = new Array(alphabet.length)
+        .fill(true)
+        .map((_, i) => random(alphabet[i]));
+    const average = array.reduce((a, b) => a + b, 0) / array.length;
+    expect(average).toBeLessThan(0.55);
+    expect(average).toBeGreaterThan(0.45);
+});

package/dist/esm/test/ready-manager.test.d.ts

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

package/dist/esm/test/ready-manager.test.js

@@ -0,0 +1,27 @@
+/**
+ * @vitest-environment jsdom
+ */
+import { describe, expect, test } from 'vitest';
+import { continueRender, delayRender } from '../delay-render.js';
+describe('Ready Manager tests', () => {
+    let handle;
+    test('delayRender sets window.ready to false', () => {
+        window.ready = true;
+        handle = delayRender();
+        expect(typeof handle).toBe('number');
+        expect(window.ready).toBe(false);
+    });
+    test('continueRender sets window.ready to true', () => {
+        continueRender(handle);
+        expect(window.ready).toBe(true);
+    });
+    test('Render is only continued if all handles have been finished', () => {
+        handle = delayRender();
+        const handle2 = delayRender();
+        expect(window.ready).toBe(false);
+        continueRender(handle);
+        expect(window.ready).toBe(false);
+        continueRender(handle2);
+        expect(window.ready).toBe(true);
+    });
+});

package/dist/esm/test/render-hook.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+interface RenderHookOptions<Props> {
+    /**
+     * The argument passed to the renderHook callback. Can be useful if you plan
+     * to use the rerender utility to change the values passed to your hook.
+     */
+    initialProps?: Props;
+    /**
+     * Pass a React Component as the wrapper option to have it rendered around the inner element. This is most useful for creating
+     *  reusable custom render functions for common data providers. See setup for examples.
+     *
+     *  @see https://testing-library.com/docs/react-testing-library/api/#wrapper
+     */
+    wrapper?: React.JSXElementConstructor<{
+        children: React.ReactElement;
+    }>;
+}
+export declare function renderHook<Result, Props>(renderCallback: (initialProps: Props) => Result, options?: RenderHookOptions<Props>): {
+    result: React.RefObject<unknown>;
+    rerender: (rerenderCallbackProps: Props) => void;
+    unmount: () => void;
+};
+export {};

package/dist/esm/test/render-hook.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render } from '@testing-library/react';
+import React from 'react';
+export function renderHook(renderCallback, options = {}) {
+    const { initialProps, wrapper } = options;
+    const result = React.createRef();
+    const TestComponent = ({ renderCallbackProps, }) => {
+        const pendingResult = renderCallback(renderCallbackProps);
+        React.useEffect(() => {
+            // @ts-expect-error
+            result.current = pendingResult;
+        });
+        return null;
+    };
+    const { rerender: baseRerender, unmount } = render(_jsx(TestComponent, { renderCallbackProps: initialProps }), { wrapper });
+    function rerender(rerenderCallbackProps) {
+        return baseRerender(_jsx(TestComponent, { renderCallbackProps: rerenderCallbackProps }));
+    }
+    return { result, rerender, unmount };
+}

package/dist/esm/test/sequence-from-initial-offset.test.d.ts

@@ -0,0 +1,4 @@
+/**
+ * @vitest-environment jsdom
+ */
+export {};

package/dist/esm/test/sequence-from-initial-offset.test.js

@@ -0,0 +1,33 @@
+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 { Internals } from '../internals.js';
+import { Sequence } from '../Sequence.js';
+import { useVideoConfig } from '../use-video-config.js';
+import { WrapSequenceContext } from './wrap-sequence-context.js';
+const Inner = () => {
+    const config = useVideoConfig();
+    return _jsx("div", { children: config.durationInFrames });
+};
+const context = {
+    audioAndVideoTags: { current: [] },
+    frame: 10000,
+    imperativePlaying: {
+        current: false,
+    },
+    playbackRate: 0,
+    playing: false,
+    rootId: 'hither',
+    setPlaybackRate: () => undefined,
+};
+describe('Composition-validation render should NOT throw with valid props', () => {
+    test('It should allow undefined as children', () => {
+        const { queryByText } = render(_jsx(CanUseRemotionHooksProvider, { children: _jsx(WrapSequenceContext, { children: _jsx(Internals.Timeline.TimelineContext.Provider, { value: context, children: _jsx(Freeze, { frame: 10000, children: _jsx(Sequence, { durationInFrames: 2424, from: 9265, children: _jsx(Inner, {}) }) }) }) }) }));
+        expect(queryByText(/^0$/)).not.toBe(null);
+    });
+});

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

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

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

@@ -0,0 +1,45 @@
+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 { Sequence } from '../Sequence.js';
+import { expectToThrow } from './expect-to-throw.js';
+import { WrapSequenceContext } from './wrap-sequence-context.js';
+describe('Composition-validation render should throw with invalid props', () => {
+    describe('Throw with invalid duration props', () => {
+        test('It should throw if Sequence has non-integer durationInFrames', () => {
+            expectToThrow(() => render(_jsx(Sequence, { from: 0, durationInFrames: 1.1, children: "hi" })), /The "durationInFrames" of a sequence must be an integer, but got 1.1./);
+        });
+        test('It should throw if Sequence has negative duration', () => {
+            expectToThrow(
+            // @ts-expect-error
+            () => render(_jsx(Sequence, { from: 0, durationInFrames: -1 })), /durationInFrames must be positive, but got -1/);
+        });
+    });
+    describe('Throw with invalid from props', () => {
+        test('It should throw if "from" props is not a number', () => {
+            expectToThrow(
+            // @ts-expect-error
+            () => render(_jsx(Sequence, { from: '0', durationInFrames: 30 })), /You passed to the "from" props of your <Sequence> an argument of type string, but it must be a number./);
+        });
+        test('It should throw if Sequence has non-integer from', () => {
+            expectToThrow(() => render(_jsx(Sequence, { from: 0.1, durationInFrames: 1, children: "hi" })), /The "from" prop of a sequence must be an integer, but got 0.1./);
+        });
+    });
+    test('It should throw for invalid layout value', () => {
+        expectToThrow(() => render(
+        // @ts-expect-error
+        _jsx(Sequence, { from: 0, durationInFrames: 100, layout: 'invalid-value' })), /The layout prop of <Sequence \/> expects either "absolute-fill" or "none", but you passed: invalid-value/);
+    });
+});
+describe('Composition-validation render should NOT throw with valid props', () => {
+    test('It should allow null as children', () => {
+        expect(() => render(_jsx(CanUseRemotionHooksProvider, { children: _jsx(WrapSequenceContext, { children: _jsx(Sequence, { durationInFrames: 100, from: 0, children: null }) }) }))).not.toThrow();
+    });
+    test('It should allow undefined as children', () => {
+        expect(() => render(_jsx(CanUseRemotionHooksProvider, { children: _jsx(WrapSequenceContext, { children: _jsx(Sequence, { durationInFrames: 100, from: 0, children: undefined }) }) }))).not.toThrow();
+    });
+});

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

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

package/dist/esm/test/series.test.js

@@ -0,0 +1,108 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * @vitest-environment jsdom
+ */
+/* eslint-disable react/jsx-no-constructed-context-values */
+import { render } from '@testing-library/react';
+import { expect, test } from 'vitest';
+import { CanUseRemotionHooksProvider } from '../CanUseRemotionHooks.js';
+import { Series } from '../series';
+import { TimelineContext } from '../timeline-position-state.js';
+import { useCurrentFrame } from '../use-current-frame.js';
+import { WrapSequenceContext } from './wrap-sequence-context.js';
+const First = () => {
+    const frame = useCurrentFrame();
+    return _jsx("div", { children: 'first ' + frame });
+};
+const Second = () => {
+    const frame = useCurrentFrame();
+    return _jsx("div", { children: 'second ' + frame });
+};
+const Third = () => {
+    const frame = useCurrentFrame();
+    return _jsx("div", { children: 'third ' + frame });
+};
+const renderForFrame = (frame, markup) => {
+    return render(_jsx(CanUseRemotionHooksProvider, { children: _jsx(TimelineContext.Provider, { value: {
+                rootId: '',
+                frame,
+                playing: false,
+                imperativePlaying: {
+                    current: false,
+                },
+                playbackRate: 1,
+                setPlaybackRate: () => {
+                    throw new Error('playback rate');
+                },
+                audioAndVideoTags: { current: [] },
+            }, children: markup }) }));
+};
+test('Basic series test', () => {
+    const { queryByText } = renderForFrame(10, _jsxs(WrapSequenceContext, { children: [_jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(First, {}) }), _jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(Second, {}) }), _jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(Third, {}) })] }), ' '] }));
+    expect(queryByText(/^third\s0$/)).not.toBe(null);
+});
+test('Should support fragments', () => {
+    const { container } = renderForFrame(10, _jsxs(WrapSequenceContext, { children: [_jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(First, {}) }), _jsxs(_Fragment, { children: [_jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(Second, {}) }, "0"), _jsx(Series.Sequence, { durationInFrames: 5, children: _jsx(Third, {}) }, "1")] })] }), ' '] }));
+    expect(container.outerHTML).not.toBe(null);
+});
+test('Should not allow foreign elements', () => {
+    expect(() => {
+        render(_jsx(WrapSequenceContext, { children: _jsx(Series, { children: _jsx(First, {}) }) }));
+    }).toThrow(/only accepts a/);
+});
+test('Should allow layout prop', () => {
+    const { container } = renderForFrame(0, _jsx(WrapSequenceContext, { children: _jsx(Series, { children: _jsx(Series.Sequence, { durationInFrames: 1, children: _jsx(First, {}) }) }) }));
+    expect(container.outerHTML).toBe('<div><div style="position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; width: 100%; height: 100%; display: flex;"><div>first 0</div></div></div>');
+    const { container: withoutLayoutContainer } = renderForFrame(0, _jsx(WrapSequenceContext, { children: _jsx(Series, { children: _jsx(Series.Sequence, { durationInFrames: 1, layout: "none", children: _jsx(First, {}) }) }) }));
+    expect(withoutLayoutContainer.outerHTML).toBe('<div><div>first 0</div></div>');
+});
+test('Should render nothing after the end', () => {
+    const { container } = renderForFrame(10, _jsx(WrapSequenceContext, { children: _jsx(Series, { children: _jsx(Series.Sequence, { durationInFrames: 1, children: _jsx(First, {}) }) }) }));
+    expect(container.outerHTML).toBe('<div></div>');
+});
+test('Should throw if invalid or no duration provided', () => {
+    expect(() => {
+        renderForFrame(10, _jsx(Series, { children: _jsx(Series.Sequence, { durationInFrames: NaN, children: _jsx(First, {}) }) }));
+    }).toThrow(/The "durationInFrames" prop of a <Series.Sequence \/> component must be an integer, but got NaN./);
+    expect(() => {
+        renderForFrame(10, _jsx(Series, { children: _jsx(Series.Sequence, { children: _jsx(First, {}) }) }));
+    }).toThrow(/The "durationInFrames" prop of a <Series.Sequence \/> component must be a number, but you passed a value of type undefined/);
+});
+test('Should allow whitespace', () => {
+    const { queryByText } = renderForFrame(11, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 10, children: _jsx(First, {}) }), ' ', _jsx(Series.Sequence, { durationInFrames: 10, children: _jsx(Second, {}) })] }) }));
+    expect(queryByText(/^second\s1$/g)).not.toBe(null);
+});
+test('Handle empty Series.Sequence', () => {
+    expect(() => renderForFrame(11, _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 10, children: _jsx(First, {}) }), _jsx(Series.Sequence, { durationInFrames: 10 })] }))).toThrow(/A <Series.Sequence \/> component \(index = 1, duration = 10\) was detected to not have any children\. Delete it to fix this error\./);
+});
+test('Should allow negative overlap prop', () => {
+    const { container } = renderForFrame(4, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, layout: "none", children: _jsx(First, {}) }), _jsx(Series.Sequence, { offset: -1, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) })] }) }));
+    expect(container.outerHTML).toBe('<div><div>first 4</div><div>second 0</div></div>');
+});
+test('Should allow positive overlap prop', () => {
+    const { container } = renderForFrame(5, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, layout: "none", children: _jsx(First, {}) }), _jsx(Series.Sequence, { offset: 1, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) })] }) }));
+    expect(container.outerHTML).toBe('<div></div>');
+});
+test('Should disallow NaN as offset prop', () => {
+    expect(() => {
+        renderForFrame(9, _jsx(Series, { children: _jsx(Series.Sequence, { offset: NaN, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) }) }));
+    }).toThrow(/The "offset" property of a <Series.Sequence \/> must not be NaN, but got NaN \(index = 0, duration = 5\)\./);
+});
+test('Should disallow Infinity as offset prop', () => {
+    expect(() => {
+        renderForFrame(9, _jsx(Series, { children: _jsx(Series.Sequence, { offset: Infinity, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) }) }));
+    }).toThrow(/The "offset" property of a <Series.Sequence \/> must be finite, but got Infinity \(index = 0, duration = 5\)\./);
+});
+test('Should disallow non-integer numbers as offset prop', () => {
+    expect(() => {
+        renderForFrame(9, _jsx(Series, { children: _jsx(Series.Sequence, { offset: Math.PI, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) }) }));
+    }).toThrow(/The "offset" property of a <Series.Sequence \/> must be finite, but got 3.141592653589793 \(index = 0, duration = 5\)\./);
+});
+test('Should cascade negative offset props', () => {
+    const { container } = renderForFrame(9, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, layout: "none", children: _jsx(First, {}) }), _jsx(Series.Sequence, { offset: -1, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) }), _jsx(Series.Sequence, { layout: "none", durationInFrames: 5, children: _jsx(Third, {}) })] }) }));
+    expect(container.outerHTML).toBe('<div><div>third 0</div></div>');
+});
+test('Should cascade positive offset props', () => {
+    const { container } = renderForFrame(11, _jsx(WrapSequenceContext, { children: _jsxs(Series, { children: [_jsx(Series.Sequence, { durationInFrames: 5, layout: "none", children: _jsx(First, {}) }), _jsx(Series.Sequence, { offset: 1, layout: "none", durationInFrames: 5, children: _jsx(Second, {}) }), _jsx(Series.Sequence, { layout: "none", durationInFrames: 5, children: _jsx(Third, {}) })] }) }));
+    expect(container.outerHTML).toBe('<div><div>third 0</div></div>');
+});

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

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

package/dist/esm/test/spring.test.js

@@ -0,0 +1,36 @@
+import { expect, test } from 'vitest';
+import { isApproximatelyTheSame } from '../is-approximately-the-same.js';
+import { spring } from '../spring';
+test('Basic spring to equal 0', () => {
+    expect(spring({
+        fps: 30,
+        frame: 0,
+    })).toEqual(0);
+});
+test('Basic spring to equal 1', () => {
+    expect(spring({
+        fps: 30,
+        frame: 0,
+        from: 1,
+        to: 0,
+    })).toEqual(1);
+});
+test('Should be approxmiately the same', () => {
+    expect(isApproximatelyTheSame(spring({
+        fps: 30,
+        frame: 1,
+    }), 0.04941510804510185)).toBe(true);
+});
+test('Should be close to 1', () => {
+    expect(spring({
+        fps: 30,
+        frame: 100,
+    })).toBeCloseTo(1);
+});
+test('Should be able to set duration for spring', () => {
+    expect(spring({
+        fps: 30,
+        frame: 5,
+        durationInFrames: 5,
+    })).toBeCloseTo(1);
+});

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

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