@remotion/transitions - npm Package Compare versions

Comparing version 4.0.85 to 4.0.86

dist/flatten-children.js

@@ -1,7 +0,13 @@
-import React from 'react';
-export const flattenChildren = (children) => {
-    const childrenArray = React.Children.toArray(children);
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.flattenChildren = void 0;
+const react_1 = __importDefault(require("react"));
+const flattenChildren = (children) => {
+    const childrenArray = react_1.default.Children.toArray(children);
     return childrenArray.reduce((flatChildren, child) => {
-        if (child.type === React.Fragment) {
-            return flatChildren.concat(flattenChildren(child.props
+        if (child.type === react_1.default.Fragment) {
+            return flatChildren.concat((0, exports.flattenChildren)(child.props
                 .children));
@@ -13,1 +19,2 @@ }
 };
+exports.flattenChildren = flattenChildren;

dist/index.js

@@ -0,5 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TransitionSeries = exports.springTiming = exports.linearTiming = void 0;
 // Timings
-export { linearTiming } from './timings/linear-timing.js';
-export { springTiming } from './timings/spring-timing.js';
+var linear_timing_js_1 = require("./timings/linear-timing.js");
+Object.defineProperty(exports, "linearTiming", { enumerable: true, get: function () { return linear_timing_js_1.linearTiming; } });
+var spring_timing_js_1 = require("./timings/spring-timing.js");
+Object.defineProperty(exports, "springTiming", { enumerable: true, get: function () { return spring_timing_js_1.springTiming; } });
 // Component
-export { TransitionSeries } from './TransitionSeries.js';
+var TransitionSeries_js_1 = require("./TransitionSeries.js");
+Object.defineProperty(exports, "TransitionSeries", { enumerable: true, get: function () { return TransitionSeries_js_1.TransitionSeries; } });

dist/presentations/clock-wipe.js

@@ -1,15 +0,18 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { translatePath } from '@remotion/paths';
-import { makePie } from '@remotion/shapes';
-import { useMemo, useState } from 'react';
-import { AbsoluteFill, random } from 'remotion';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.clockWipe = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const paths_1 = require("@remotion/paths");
+const shapes_1 = require("@remotion/shapes");
+const react_1 = require("react");
+const remotion_1 = require("remotion");
 const ClockWipePresentation = ({ children, presentationDirection, presentationProgress, passedProps }) => {
     const finishedRadius = Math.sqrt(passedProps.width ** 2 + passedProps.height ** 2) / 2;
-    const { path } = makePie({
+    const { path } = (0, shapes_1.makePie)({
         radius: finishedRadius,
         progress: presentationProgress,
     });
-    const translatedPath = translatePath(path, -(finishedRadius * 2 - passedProps.width) / 2, -(finishedRadius * 2 - passedProps.height) / 2);
-    const [clipId] = useState(() => String(random(null)));
-    const style = useMemo(() => {
+    const translatedPath = (0, paths_1.translatePath)(path, -(finishedRadius * 2 - passedProps.width) / 2, -(finishedRadius * 2 - passedProps.height) / 2);
+    const [clipId] = (0, react_1.useState)(() => String((0, remotion_1.random)(null)));
+    const style = (0, react_1.useMemo)(() => {
         return {
@@ -29,3 +32,3 @@ width: '100%',
     ]);
-    const outerStyle = useMemo(() => {
+    const outerStyle = (0, react_1.useMemo)(() => {
         return presentationDirection === 'entering'
@@ -39,6 +42,7 @@ ? passedProps.outerEnterStyle
     ]);
-    return (_jsxs(AbsoluteFill, { style: outerStyle, children: [_jsx(AbsoluteFill, { style: style, children: children }), presentationDirection === 'exiting' ? null : (_jsx(AbsoluteFill, { children: _jsx("svg", { children: _jsx("defs", { children: _jsx("clipPath", { id: clipId, children: _jsx("path", { d: translatedPath, fill: "black" }) }) }) }) }))] }));
+    return ((0, jsx_runtime_1.jsxs)(remotion_1.AbsoluteFill, { style: outerStyle, children: [(0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { style: style, children: children }), presentationDirection === 'exiting' ? null : ((0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { children: (0, jsx_runtime_1.jsx)("svg", { children: (0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsx)("clipPath", { id: clipId, children: (0, jsx_runtime_1.jsx)("path", { d: translatedPath, fill: "black" }) }) }) }) }))] }));
 };
-export const clockWipe = (props) => {
+const clockWipe = (props) => {
     return { component: ClockWipePresentation, props: props !== null && props !== void 0 ? props : {} };
 };
+exports.clockWipe = clockWipe;

dist/presentations/fade.js

@@ -1,7 +0,10 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import { AbsoluteFill } from 'remotion';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fade = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const remotion_1 = require("remotion");
 const FadePresentation = ({ children, presentationDirection, presentationProgress, passedProps }) => {
     const isEntering = presentationDirection === 'entering';
-    const style = useMemo(() => {
+    const style = (0, react_1.useMemo)(() => {
         return {
@@ -20,5 +23,5 @@ opacity: isEntering ? presentationProgress : 1,
     ]);
-    return _jsx(AbsoluteFill, { style: style, children: children });
+    return (0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { style: style, children: children });
 };
-export const fade = (props) => {
+const fade = (props) => {
     return {
@@ -29,1 +32,2 @@ component: FadePresentation,
 };
+exports.fade = fade;

dist/presentations/flip.js

@@ -1,11 +0,14 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import { AbsoluteFill, interpolate } from 'remotion';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.flip = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const remotion_1 = require("remotion");
 const Flip = ({ children, presentationDirection, presentationProgress, passedProps: { direction = 'from-left', perspective = 1000, innerEnterStyle, innerExitStyle, outerEnterStyle, outerExitStyle, }, }) => {
-    const style = useMemo(() => {
+    const style = (0, react_1.useMemo)(() => {
         const startRotationEntering = direction === 'from-right' || direction === 'from-top' ? 180 : -180;
         const endRotationEntering = direction === 'from-right' || direction === 'from-top' ? -180 : 180;
         const rotation = presentationDirection === 'entering'
-            ? interpolate(presentationProgress, [0, 1], [startRotationEntering, 0])
-            : interpolate(presentationProgress, [0, 1], [0, endRotationEntering]);
+            ? (0, remotion_1.interpolate)(presentationProgress, [0, 1], [startRotationEntering, 0])
+            : (0, remotion_1.interpolate)(presentationProgress, [0, 1], [0, endRotationEntering]);
         const rotateProperty = direction === 'from-top' || direction === 'from-bottom'
@@ -31,3 +34,3 @@ ? 'rotateX'
     ]);
-    const outer = useMemo(() => {
+    const outer = (0, react_1.useMemo)(() => {
         return {
@@ -42,6 +45,7 @@ perspective,
     }, [outerEnterStyle, outerExitStyle, perspective, presentationDirection]);
-    return (_jsx(AbsoluteFill, { style: outer, children: _jsx(AbsoluteFill, { style: style, children: children }) }));
+    return ((0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { style: outer, children: (0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { style: style, children: children }) }));
 };
-export const flip = (props) => {
+const flip = (props) => {
     return { component: Flip, props: props !== null && props !== void 0 ? props : {} };
 };
+exports.flip = flip;

dist/presentations/slide.js

@@ -1,6 +0,9 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import { AbsoluteFill } from 'remotion';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.slide = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const remotion_1 = require("remotion");
 const SlidePresentation = ({ children, presentationProgress, presentationDirection, passedProps: { direction = 'from-left', enterStyle, exitStyle }, }) => {
-    const directionStyle = useMemo(() => {
+    const directionStyle = (0, react_1.useMemo)(() => {
         if (presentationDirection === 'exiting') {
@@ -49,3 +52,3 @@ switch (direction) {
     }, [presentationDirection, presentationProgress, direction]);
-    const style = useMemo(() => {
+    const style = (0, react_1.useMemo)(() => {
         return {
@@ -60,5 +63,5 @@ width: '100%',
     }, [directionStyle, enterStyle, exitStyle, presentationDirection]);
-    return _jsx(AbsoluteFill, { style: style, children: children });
+    return (0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { style: style, children: children });
 };
-export const slide = (props) => {
+const slide = (props) => {
     return {
@@ -69,1 +72,2 @@ component: SlidePresentation,
 };
+exports.slide = slide;

dist/presentations/wipe.js

@@ -1,4 +0,7 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo, useState } from 'react';
-import { AbsoluteFill, random } from 'remotion';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.wipe = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const remotion_1 = require("remotion");
 const makePathIn = (progress, direction) => {
@@ -121,3 +124,3 @@ switch (direction) {
 const WipePresentation = ({ children, presentationProgress, presentationDirection, passedProps: { direction = 'from-left', innerEnterStyle, innerExitStyle, outerEnterStyle, outerExitStyle, }, }) => {
-    const [clipId] = useState(() => String(random(null)));
+    const [clipId] = (0, react_1.useState)(() => String((0, remotion_1.random)(null)));
     const progressInDirection = presentationDirection === 'entering'
@@ -129,3 +132,3 @@ ? presentationProgress
         : makePathOut(progressInDirection, direction);
-    const style = useMemo(() => {
+    const style = (0, react_1.useMemo)(() => {
         return {
@@ -142,3 +145,3 @@ width: '100%',
     }, [clipId, innerEnterStyle, innerExitStyle, presentationDirection]);
-    const outerStyle = useMemo(() => {
+    const outerStyle = (0, react_1.useMemo)(() => {
         return presentationDirection === 'entering'
@@ -148,3 +151,3 @@ ? outerEnterStyle
     }, [outerEnterStyle, outerExitStyle, presentationDirection]);
-    const svgStyle = useMemo(() => {
+    const svgStyle = (0, react_1.useMemo)(() => {
         return {
@@ -156,5 +159,5 @@ width: '100%',
     }, []);
-    return (_jsxs(AbsoluteFill, { style: outerStyle, children: [_jsx(AbsoluteFill, { style: style, children: children }), _jsx(AbsoluteFill, { children: _jsx("svg", { viewBox: "0 0 1 1", style: svgStyle, children: _jsx("defs", { children: _jsx("clipPath", { id: clipId, clipPathUnits: "objectBoundingBox", children: _jsx("path", { d: path, fill: "black" }) }) }) }) })] }));
+    return ((0, jsx_runtime_1.jsxs)(remotion_1.AbsoluteFill, { style: outerStyle, children: [(0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { style: style, children: children }), (0, jsx_runtime_1.jsx)(remotion_1.AbsoluteFill, { children: (0, jsx_runtime_1.jsx)("svg", { viewBox: "0 0 1 1", style: svgStyle, children: (0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsx)("clipPath", { id: clipId, clipPathUnits: "objectBoundingBox", children: (0, jsx_runtime_1.jsx)("path", { d: path, fill: "black" }) }) }) }) })] }));
 };
-export const wipe = (props) => {
+const wipe = (props) => {
     return {
@@ -165,1 +168,2 @@ component: WipePresentation,
 };
+exports.wipe = wipe;

dist/timings/linear-timing.js

@@ -1,3 +0,6 @@
-import { interpolate } from 'remotion';
-export const linearTiming = (options) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.linearTiming = void 0;
+const remotion_1 = require("remotion");
+const linearTiming = (options) => {
     return {
@@ -8,3 +11,3 @@ getDurationInFrames: () => {
         getProgress: ({ frame }) => {
-            return interpolate(frame, [0, options.durationInFrames], [0, 1], {
+            return (0, remotion_1.interpolate)(frame, [0, options.durationInFrames], [0, 1], {
                 easing: options.easing,
@@ -17,1 +20,2 @@ extrapolateLeft: 'clamp',
 };
+exports.linearTiming = linearTiming;

dist/timings/spring-timing.js

@@ -1,2 +0,5 @@
-import { measureSpring, spring } from 'remotion';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.springTiming = void 0;
+const remotion_1 = require("remotion");
 const springWithInvalidArgumentRejection = (args) => {
@@ -6,5 +9,5 @@ if (args.to || args.from) {
     }
-    return spring(args);
+    return (0, remotion_1.spring)(args);
 };
-export const springTiming = (options = {}) => {
+const springTiming = (options = {}) => {
     return {
@@ -15,3 +18,3 @@ getDurationInFrames: ({ fps }) => {
             }
-            return measureSpring({
+            return (0, remotion_1.measureSpring)({
                 config: options.config,
@@ -33,1 +36,2 @@ threshold: options.durationRestThreshold,
 };
+exports.springTiming = springTiming;

dist/TransitionSeries.js

@@ -1,7 +0,10 @@
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-import { Children, useMemo } from 'react';
-import { Internals, Sequence, useCurrentFrame, useVideoConfig } from 'remotion';
-import { flattenChildren } from './flatten-children.js';
-import { slide } from './presentations/slide.js';
-import { validateDurationInFrames } from './validate.js';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TransitionSeries = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const remotion_1 = require("remotion");
+const flatten_children_js_1 = require("./flatten-children.js");
+const slide_js_1 = require("./presentations/slide.js");
+const validate_js_1 = require("./validate.js");
 // eslint-disable-next-line react/function-component-definition
@@ -15,12 +18,12 @@ const TransitionSeriesTransition = function (
     // eslint-disable-next-line react/jsx-no-useless-fragment
-    return _jsx(_Fragment, { children: children });
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
 };
 const TransitionSeriesChildren = ({ children, }) => {
-    const { fps } = useVideoConfig();
-    const frame = useCurrentFrame();
-    const childrenValue = useMemo(() => {
+    const { fps } = (0, remotion_1.useVideoConfig)();
+    const frame = (0, remotion_1.useCurrentFrame)();
+    const childrenValue = (0, react_1.useMemo)(() => {
         let transitionOffsets = 0;
         let startFrame = 0;
-        const flattedChildren = flattenChildren(children);
-        return Children.map(flattedChildren, (child, i) => {
+        const flattedChildren = (0, flatten_children_js_1.flattenChildren)(children);
+        return react_1.Children.map(flattedChildren, (child, i) => {
             var _a, _b, _c, _d, _e, _f, _g, _h, _j;
@@ -66,3 +69,3 @@ const current = child;
             const { durationInFrames, children: _children, ...passedProps } = castedChildAgain.props;
-            validateDurationInFrames(durationInFramesProp, {
+            (0, validate_js_1.validateDurationInFrames)(durationInFramesProp, {
                 component: `of a <TransitionSeries.Sequence /> component`,
@@ -120,32 +123,32 @@ allowFloats: true,
             if (next && prev && nextProgress !== null && prevProgress !== null) {
-                const nextPresentation = (_b = next.props.presentation) !== null && _b !== void 0 ? _b : slide();
-                const prevPresentation = (_c = prev.props.presentation) !== null && _c !== void 0 ? _c : slide();
+                const nextPresentation = (_b = next.props.presentation) !== null && _b !== void 0 ? _b : (0, slide_js_1.slide)();
+                const prevPresentation = (_c = prev.props.presentation) !== null && _c !== void 0 ? _c : (0, slide_js_1.slide)();
                 const UppercaseNextPresentation = nextPresentation.component;
                 const UppercasePrevPresentation = prevPresentation.component;
-                return (_jsx(Sequence, { name: "<TS.Sequence>", from: Math.floor(actualStartFrame), durationInFrames: durationInFramesProp, layout: "none", stack: passedProps.stack, children: _jsx(UppercaseNextPresentation, { passedProps: (_d = nextPresentation.props) !== null && _d !== void 0 ? _d : {}, presentationDirection: "exiting", presentationProgress: nextProgress, children: _jsx(UppercasePrevPresentation, { passedProps: (_e = prevPresentation.props) !== null && _e !== void 0 ? _e : {}, presentationDirection: "entering", presentationProgress: prevProgress, children: _jsx(Sequence, { showInTimeline: false, ...passedProps, children: child }) }) }) }));
+                return ((0, jsx_runtime_1.jsx)(remotion_1.Sequence, { name: "<TS.Sequence>", from: Math.floor(actualStartFrame), durationInFrames: durationInFramesProp, layout: "none", stack: passedProps.stack, children: (0, jsx_runtime_1.jsx)(UppercaseNextPresentation, { passedProps: (_d = nextPresentation.props) !== null && _d !== void 0 ? _d : {}, presentationDirection: "exiting", presentationProgress: nextProgress, children: (0, jsx_runtime_1.jsx)(UppercasePrevPresentation, { passedProps: (_e = prevPresentation.props) !== null && _e !== void 0 ? _e : {}, presentationDirection: "entering", presentationProgress: prevProgress, children: (0, jsx_runtime_1.jsx)(remotion_1.Sequence, { showInTimeline: false, ...passedProps, children: child }) }) }) }));
             }
             if (prevProgress !== null && prev) {
-                const prevPresentation = (_f = prev.props.presentation) !== null && _f !== void 0 ? _f : slide();
+                const prevPresentation = (_f = prev.props.presentation) !== null && _f !== void 0 ? _f : (0, slide_js_1.slide)();
                 const UppercasePrevPresentation = prevPresentation.component;
-                return (_jsx(Sequence, { name: "<TS.Sequence>", from: Math.floor(actualStartFrame), durationInFrames: durationInFramesProp, layout: "none", stack: passedProps.stack, children: _jsx(UppercasePrevPresentation, { passedProps: (_g = prevPresentation.props) !== null && _g !== void 0 ? _g : {}, presentationDirection: "entering", presentationProgress: prevProgress, children: _jsx(Sequence, { showInTimeline: false, ...passedProps, children: child }) }) }));
+                return ((0, jsx_runtime_1.jsx)(remotion_1.Sequence, { name: "<TS.Sequence>", from: Math.floor(actualStartFrame), durationInFrames: durationInFramesProp, layout: "none", stack: passedProps.stack, children: (0, jsx_runtime_1.jsx)(UppercasePrevPresentation, { passedProps: (_g = prevPresentation.props) !== null && _g !== void 0 ? _g : {}, presentationDirection: "entering", presentationProgress: prevProgress, children: (0, jsx_runtime_1.jsx)(remotion_1.Sequence, { showInTimeline: false, ...passedProps, children: child }) }) }));
             }
             if (nextProgress !== null && next) {
-                const nextPresentation = (_h = next.props.presentation) !== null && _h !== void 0 ? _h : slide();
+                const nextPresentation = (_h = next.props.presentation) !== null && _h !== void 0 ? _h : (0, slide_js_1.slide)();
                 const UppercaseNextPresentation = nextPresentation.component;
-                return (_jsx(Sequence, { name: "<TS.Sequence>", from: Math.floor(actualStartFrame), durationInFrames: durationInFramesProp, layout: "none", stack: passedProps.stack, children: _jsx(UppercaseNextPresentation, { passedProps: (_j = nextPresentation.props) !== null && _j !== void 0 ? _j : {}, presentationDirection: "exiting", presentationProgress: nextProgress, children: _jsx(Sequence, { showInTimeline: false, ...passedProps, children: child }) }) }));
+                return ((0, jsx_runtime_1.jsx)(remotion_1.Sequence, { name: "<TS.Sequence>", from: Math.floor(actualStartFrame), durationInFrames: durationInFramesProp, layout: "none", stack: passedProps.stack, children: (0, jsx_runtime_1.jsx)(UppercaseNextPresentation, { passedProps: (_j = nextPresentation.props) !== null && _j !== void 0 ? _j : {}, presentationDirection: "exiting", presentationProgress: nextProgress, children: (0, jsx_runtime_1.jsx)(remotion_1.Sequence, { showInTimeline: false, ...passedProps, children: child }) }) }));
             }
-            return (_jsx(Sequence, { name: "<TS.Sequence>", from: Math.floor(actualStartFrame), durationInFrames: durationInFramesProp, ...passedProps, children: child }));
+            return ((0, jsx_runtime_1.jsx)(remotion_1.Sequence, { name: "<TS.Sequence>", from: Math.floor(actualStartFrame), durationInFrames: durationInFramesProp, ...passedProps, children: child }));
         });
     }, [children, fps, frame]);
     // eslint-disable-next-line react/jsx-no-useless-fragment
-    return _jsx(_Fragment, { children: childrenValue });
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: childrenValue });
 };
 const TransitionSeries = ({ children, name, ...otherProps }) => {
     const displayName = name !== null && name !== void 0 ? name : '<TransitionSeries>';
-    return (_jsx(Sequence, { name: displayName, ...otherProps, children: _jsx(TransitionSeriesChildren, { children: children }) }));
+    return ((0, jsx_runtime_1.jsx)(remotion_1.Sequence, { name: displayName, ...otherProps, children: (0, jsx_runtime_1.jsx)(TransitionSeriesChildren, { children: children }) }));
 };
+exports.TransitionSeries = TransitionSeries;
 TransitionSeries.Sequence = SeriesSequence;
 TransitionSeries.Transition = TransitionSeriesTransition;
-export { TransitionSeries };
-Internals.addSequenceStackTraces(TransitionSeries);
-Internals.addSequenceStackTraces(SeriesSequence);
+remotion_1.Internals.addSequenceStackTraces(TransitionSeries);
+remotion_1.Internals.addSequenceStackTraces(SeriesSequence);

dist/types.js

@@ -1,1 +0,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

dist/validate.js

@@ -0,3 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validateDurationInFrames = void 0;
 /* eslint-disable prefer-destructuring */
-import { NoReactInternals } from 'remotion/no-react';
-export const validateDurationInFrames = NoReactInternals.validateDurationInFrames;
+const no_react_1 = require("remotion/no-react");
+exports.validateDurationInFrames = no_react_1.NoReactInternals.validateDurationInFrames;

package.json

 {
   "name": "@remotion/transitions",
-  "version": "4.0.85",
+  "version": "4.0.86",
   "description": "Transition presets for Remotion",
   "sideEffects": false,
-  "main": "dist/cjs/index.js",
-  "module": "dist/index.js",
+  "main": "dist/esm/index.mjs",
+  "module": "dist/esm/index.js",
   "types": "dist/index.d.ts",
   "author": "Jonny Burger",
   "contributors": [],
-  "license": "MIT",
+  "license": "UNLICENSED",
   "repository": {
@@ -19,5 +19,5 @@ "url": "https://github.com/remotion-dev/remotion"
   "dependencies": {
-    "remotion": "4.0.85",
-    "@remotion/paths": "4.0.85",
-    "@remotion/shapes": "4.0.85"
+    "@remotion/paths": "4.0.86",
+    "remotion": "4.0.86",
+    "@remotion/shapes": "4.0.86"
   },
@@ -37,4 +37,4 @@ "devDependencies": {
     "@rollup/plugin-typescript": "^8.2.0",
-    "remotion": "4.0.85",
-    "@remotion/test-utils": "4.0.85"
+    "@remotion/test-utils": "4.0.86",
+    "remotion": "4.0.86"
   },
@@ -54,35 +54,35 @@ "peerDependencies": {
     ".": {
-      "module": "./dist/index.js",
-      "import": "./dist/index.js",
+      "module": "./dist/esm/index.mjs",
+      "import": "./dist/esm/index.mjs",
       "types": "./dist/index.d.ts",
-      "require": "./dist/cjs/index.js"
+      "require": "./dist/index.js"
     },
     "./fade": {
-      "module": "./dist/presentations/fade.js",
-      "import": "./dist/presentations/fade.js",
-      "require": "./dist/cjs/presentations/fade.js",
+      "module": "./dist/esm/fade.mjs",
+      "import": "./dist/esm/fade.mjs",
+      "require": "./dist/presentations/fade.js",
       "types": "./dist/presentations/fade.d.ts"
     },
     "./slide": {
-      "module": "./dist/presentations/slide.js",
-      "import": "./dist/presentations/slide.js",
-      "require": "./dist/cjs/presentations/slide.js",
+      "module": "./dist/esm/slide.mjs",
+      "import": "./dist/esm/slide.mjs",
+      "require": "./dist/presentations/slide.js",
       "types": "./dist/presentations/slide.d.ts"
     },
     "./wipe": {
-      "module": "./dist/presentations/wipe.js",
-      "import": "./dist/presentations/wipe.js",
-      "require": "./dist/cjs/presentations/wipe.js",
+      "module": "./dist/esm/wipe.mjs",
+      "import": "./dist/esm/wipe.mjs",
+      "require": "./dist/presentations/wipe.js",
       "types": "./dist/presentations/wipe.d.ts"
     },
     "./flip": {
-      "module": "./dist/presentations/flip.js",
-      "import": "./dist/presentations/flip.js",
-      "require": "./dist/cjs/presentations/flip.js",
+      "module": "./dist/esm/flip.mjs",
+      "import": "./dist/esm/flip.mjs",
+      "require": "./dist/presentations/flip.js",
       "types": "./dist/presentations/flip.d.ts"
     },
     "./clock-wipe": {
-      "module": "./dist/presentations/clock-wipe.js",
-      "import": "./dist/presentations/clock-wipe.js",
-      "require": "./dist/cjs/presentations/clock-wipe.js",
+      "module": "./dist/esm/clock-wipe.mjs",
+      "import": "./dist/esm/clock-wipe.mjs",
+      "require": "./dist/presentations/clock-wipe.js",
       "types": "./dist/presentations/clock-wipe.d.ts"
@@ -115,4 +115,4 @@ },
     "watch": "tsc -w",
-    "build": "rollup --config rollup.config.js && tsc -d"
+    "build": "tsc -d && rollup --config rollup.config.js"
   }
 }

rollup.config.js

@@ -11,4 +11,4 @@ // rollup.config.js
 			{
-				file: 'dist/cjs/index.js',
-				format: 'cjs',
+				file: 'dist/esm/index.mjs',
+				format: 'es',
 				sourcemap: false,
@@ -20,3 +20,3 @@ },
 			typescript({
-				tsconfig: 'tsconfig-cjs.json',
+				tsconfig: 'tsconfig.json',
 				sourceMap: false,
@@ -32,4 +32,4 @@ outputToFilesystem: true,
 				{
-					file: `dist/cjs/${p}.js`,
-					format: 'cjs',
+					file: `dist/esm/${p}.mjs`,
+					format: 'es',
 					sourcemap: false,
@@ -48,3 +48,3 @@ },
 				typescript({
-					tsconfig: 'tsconfig-cjs.json',
+					tsconfig: 'tsconfig.json',
 					sourceMap: false,
@@ -51,0 +51,0 @@ outputToFilesystem: true,

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Misc. License Issues

License

(Experimental) A package's licensing information has fine-grained problems.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

71639

decreased by-0.09%

Number of package files

52

decreased by-1.89%

Number of medium license alerts

1

increased byInfinity%

Lines of code

1533

decreased by-0.52%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@remotion/paths@4.0.86(transitive)

• + Added@remotion/shapes@4.0.86(transitive)

• + Addedremotion@4.0.86(transitive)

• - Removed@remotion/paths@4.0.85(transitive)

• - Removed@remotion/shapes@4.0.85(transitive)

• - Removedremotion@4.0.85(transitive)

• Updated@remotion/paths@4.0.86

• Updated@remotion/shapes@4.0.86

• Updatedremotion@4.0.86