@remotion/lottie 3.2.28 → 3.2.30

package/dist/Lottie.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 import type { LottieProps } from './types';
-export declare const Lottie: ({ animationData, className, direction, loop, playbackRate, style, }: LottieProps) => JSX.Element;
+export declare const Lottie: ({ animationData, className, direction, loop, playbackRate, style, onAnimationLoaded, }: LottieProps) => JSX.Element;

package/dist/Lottie.js

@@ -11,7 +11,7 @@ const remotion_1 = require("remotion");
 const utils_1 = require("./utils");
 const validate_loop_1 = require("./validate-loop");
 const validate_playbackrate_1 = require("./validate-playbackrate");
-const Lottie = ({ animationData, className, direction, loop, playbackRate, style, }) => {
+const Lottie = ({ animationData, className, direction, loop, playbackRate, style, onAnimationLoaded, }) => {
     if (typeof animationData !== 'object') {
         throw new Error('animationData should be provided as an object. If you only have the path to the JSON file, load it and pass it as animationData. See https://remotion.dev/docs/lottie/lottie#example for more information.');
     }
@@ -20,9 +20,12 @@ const Lottie = ({ animationData, className, direction, loop, playbackRate, style
     const animationRef = (0, react_1.useRef)();
     const lastFrameRef = (0, react_1.useRef)(null);
     const containerRef = (0, react_1.useRef)(null);
+    const onAnimationLoadedRef = (0, react_1.useRef)();
+    onAnimationLoadedRef.current = onAnimationLoaded;
     const [handle] = (0, react_1.useState)(() => (0, remotion_1.delayRender)('Waiting for Lottie animation to load'));
     const frame = (0, remotion_1.useCurrentFrame)();
     (0, react_1.useEffect)(() => {
+        var _a;
         if (!containerRef.current) {
             return;
         }
@@ -39,6 +42,7 @@ const Lottie = ({ animationData, className, direction, loop, playbackRate, style
             (0, remotion_1.continueRender)(handle);
         };
         animation.addEventListener('DOMLoaded', onComplete);
+        (_a = onAnimationLoadedRef.current) === null || _a === void 0 ? void 0 : _a.call(onAnimationLoadedRef, animation);
         return () => {
             lastFrameRef.current = animation.currentFrame;
             animation.removeEventListener('DOMLoaded', onComplete);

package/dist/types.d.ts

@@ -1,3 +1,4 @@
+import type { AnimationItem } from 'lottie-web';
 import type { CSSProperties } from 'react';
 export declare type LottieAnimationData = {
     fr: number;
@@ -30,4 +31,8 @@ export declare type LottieProps = {
      * CSS properties to apply to the container of the animation.
      */
     style?: CSSProperties;
+    /**
+     * Callback that gets invoked when new animation data has been initialized
+     */
+    onAnimationLoaded?: (animation: AnimationItem) => void;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/lottie",
-	"version": "3.2.28",
+	"version": "3.2.30",
 	"description": "Remotion Lottie",
 	"main": "dist/index.js",
 	"sideEffects": false,
@@ -27,7 +27,7 @@
 	],
 	"license": "SEE LICENSE IN LICENSE.md",
 	"dependencies": {
-		"remotion": "3.2.28"
+		"remotion": "3.2.30"
 	},
 	"peerDependencies": {
 		"lottie-web": "^5",
@@ -58,5 +58,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "49bb70afa503bfb0c89ee51d8bf3386ad1b91ac4"
+	"gitHead": "5dc5f4c010c47186c7911b575998296d6a65f7cb"
 }