@remotion/rive 4.0.535 → 4.0.536

package/dist/cjs/RemotionRiveCanvas.d.ts

@@ -1,6 +1,6 @@
 import type { Artboard, CanvasRenderer, File, FileAsset, LinearAnimationInstance, RiveCanvas } from '@rive-app/canvas-advanced';
 import React from 'react';
-import type { EffectsProp, InteractiveBaseProps, InteractivePremountProps, InteractiveCropProps, InteractivitySchema } from 'remotion';
+import type { EffectsProp, EffectsOutputSize, InteractiveBaseProps, InteractivePremountProps, InteractiveCropProps, InteractivitySchema } from 'remotion';
 import type { RemotionRiveCanvasAlignment, RemotionRiveCanvasFit } from './map-enums.js';
 type assetLoadCallback = (asset: FileAsset, bytes: Uint8Array) => boolean;
 type onLoadCallback = (file: File) => void;
@@ -16,6 +16,7 @@ type RemotionRiveCanvasOwnProps = {
     readonly className?: string;
     readonly style?: React.CSSProperties;
     readonly effects?: EffectsProp;
+    readonly effectsOutputSize?: EffectsOutputSize;
 };
 export type RemotionRiveCanvasProps = RemotionRiveCanvasOwnProps & InteractiveBaseProps & InteractivePremountProps & InteractiveCropProps;
 export type RiveCanvasRef = {

package/dist/cjs/RemotionRiveCanvas.js

@@ -51,7 +51,7 @@ exports.riveCanvasSchema = {
     ...remotion_1.Interactive.borderRadiusSchema,
     ...remotion_1.Interactive.cropSchema,
 };
-const RemotionRiveCanvasContentForwardRefFunction = ({ src, fit, alignment, artboard: artboardName, animation: animationIndex, onLoad = null, assetLoader, enableRiveAssetCdn, className, style, effects, controls, canvasRef, }, ref) => {
+const RemotionRiveCanvasContentForwardRefFunction = ({ src, fit, alignment, artboard: artboardName, animation: animationIndex, onLoad = null, assetLoader, enableRiveAssetCdn, className, style, effects, effectsOutputSize, controls, canvasRef, }, ref) => {
     var _a, _b, _c;
     const { width, fps, height } = (0, remotion_1.useVideoConfig)();
     const frame = (0, remotion_1.useCurrentFrame)();
@@ -68,7 +68,7 @@ const RemotionRiveCanvasContentForwardRefFunction = ({ src, fit, alignment, artb
         }
         return document.createElement('canvas');
     }, []);
-    const chainState = useEffectChainState();
+    const chainState = useEffectChainState(effectsOutputSize);
     const memoizedEffects = useMemoizedEffects({
         effects,
         overrideId: (_b = controls === null || controls === void 0 ? void 0 : controls.overrideId) !== null && _b !== void 0 ? _b : null,
@@ -286,7 +286,7 @@ const RemotionRiveCanvasContentForwardRefFunction = ({ src, fit, alignment, artb
     return (jsx_runtime_1.jsx("canvas", { ref: canvasRef, width: width, height: height, className: className, style: canvasStyle }));
 };
 const RemotionRiveCanvasContent = (0, react_1.forwardRef)(RemotionRiveCanvasContentForwardRefFunction);
-const RemotionRiveCanvasInnerForwardRefFunction = ({ src, fit = 'contain', alignment = 'center', artboard, animation, onLoad = null, assetLoader, enableRiveAssetCdn = true, className, style, effects = [], controls, durationInFrames, name, from, premountFor, postmountFor, styleWhilePremounted, styleWhilePostmounted, trimBefore, playbackRate, loop, freeze, showInTimeline, hidden, cropLeft, cropRight, cropTop, cropBottom, ...props }, ref) => {
+const RemotionRiveCanvasInnerForwardRefFunction = ({ src, fit = 'contain', alignment = 'center', artboard, animation, onLoad = null, assetLoader, enableRiveAssetCdn = true, className, style, effects = [], effectsOutputSize, controls, durationInFrames, name, from, premountFor, postmountFor, styleWhilePremounted, styleWhilePostmounted, trimBefore, playbackRate, loop, freeze, showInTimeline, hidden, cropLeft, cropRight, cropTop, cropBottom, ...props }, ref) => {
     props;
     const memoizedEffectDefinitions = useMemoizedEffectDefinitions(effects);
     const canvasRef = (0, react_1.useRef)(null);
@@ -312,7 +312,7 @@ const RemotionRiveCanvasInnerForwardRefFunction = ({ src, fit = 'contain', align
         style: premountingStyle,
         componentName: '<RemotionRiveCanvas />',
     });
-    return (jsx_runtime_1.jsx(remotion_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, children: jsx_runtime_1.jsx(remotion_1.Sequence, { layout: "none", from: from, trimBefore: trimBefore, playbackRate: playbackRate, loop: loop, freeze: freeze, hidden: hidden, showInTimeline: showInTimeline, name: name !== null && name !== void 0 ? name : '<RemotionRiveCanvas>', _remotionInternalDocumentationLink: "https://www.remotion.dev/docs/rive/remotionrivecanvas", durationInFrames: durationInFrames, controls: controls, _remotionInternalEffects: memoizedEffectDefinitions, ...props, _remotionInternalPremountDisplay: effectivePremountFor || null, _remotionInternalPostmountDisplay: effectivePostmountFor || null, _remotionInternalIsPremounting: premountingActive, _remotionInternalIsPostmounting: postmountingActive, children: jsx_runtime_1.jsx(RemotionRiveCanvasContent, { ref: ref, src: src, fit: fit, alignment: alignment, artboard: artboard, animation: animation, onLoad: onLoad, assetLoader: assetLoader, enableRiveAssetCdn: enableRiveAssetCdn, className: className, style: croppedStyle !== null && croppedStyle !== void 0 ? croppedStyle : undefined, effects: effects, controls: controls, canvasRef: canvasRef }) }) }));
+    return (jsx_runtime_1.jsx(remotion_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, children: jsx_runtime_1.jsx(remotion_1.Sequence, { layout: "none", from: from, trimBefore: trimBefore, playbackRate: playbackRate, loop: loop, freeze: freeze, hidden: hidden, showInTimeline: showInTimeline, name: name !== null && name !== void 0 ? name : '<RemotionRiveCanvas>', _remotionInternalDocumentationLink: "https://www.remotion.dev/docs/rive/remotionrivecanvas", durationInFrames: durationInFrames, controls: controls, _remotionInternalEffects: memoizedEffectDefinitions, ...props, _remotionInternalPremountDisplay: effectivePremountFor || null, _remotionInternalPostmountDisplay: effectivePostmountFor || null, _remotionInternalIsPremounting: premountingActive, _remotionInternalIsPostmounting: postmountingActive, children: jsx_runtime_1.jsx(RemotionRiveCanvasContent, { ref: ref, src: src, fit: fit, alignment: alignment, artboard: artboard, animation: animation, onLoad: onLoad, assetLoader: assetLoader, enableRiveAssetCdn: enableRiveAssetCdn, className: className, style: croppedStyle !== null && croppedStyle !== void 0 ? croppedStyle : undefined, effects: effects, effectsOutputSize: effectsOutputSize !== null && effectsOutputSize !== void 0 ? effectsOutputSize : null, controls: controls, canvasRef: canvasRef }) }) }));
 };
 const RemotionRiveCanvasInner = (0, react_1.forwardRef)(RemotionRiveCanvasInnerForwardRefFunction);
 exports.RemotionRiveCanvas = remotion_1.Interactive.withSchema({

package/dist/esm/index.mjs

@@ -136,6 +136,7 @@ var RemotionRiveCanvasContentForwardRefFunction = ({
   className,
   style,
   effects,
+  effectsOutputSize,
   controls,
   canvasRef
 }, ref) => {
@@ -152,7 +153,7 @@ var RemotionRiveCanvasContentForwardRefFunction = ({
     }
     return document.createElement("canvas");
   }, []);
-  const chainState = useEffectChainState();
+  const chainState = useEffectChainState(effectsOutputSize);
   const memoizedEffects = useMemoizedEffects({
     effects,
     overrideId: controls?.overrideId ?? null,
@@ -357,6 +358,7 @@ var RemotionRiveCanvasInnerForwardRefFunction = ({
   className,
   style,
   effects = [],
+  effectsOutputSize,
   controls,
   durationInFrames,
   name,
@@ -444,6 +446,7 @@ var RemotionRiveCanvasInnerForwardRefFunction = ({
         className,
         style: croppedStyle ?? undefined,
         effects,
+        effectsOutputSize: effectsOutputSize ?? null,
         controls,
         canvasRef
       })

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/rive"
 	},
 	"name": "@remotion/rive",
-	"version": "4.0.535",
+	"version": "4.0.536",
 	"description": "Embed Rive animations in a Remotion video",
 	"main": "dist/cjs/index.js",
 	"types": "dist/cjs/index.d.ts",
@@ -23,7 +23,7 @@
 	"license": "See LICENSE.md",
 	"dependencies": {
 		"@rive-app/canvas-advanced": "2.31.5",
-		"remotion": "4.0.535"
+		"remotion": "4.0.536"
 	},
 	"peerDependencies": {
 		"react": ">=18.2.0",
@@ -32,7 +32,7 @@
 	"devDependencies": {
 		"react": "19.2.3",
 		"react-dom": "19.2.3",
-		"@remotion/eslint-config-internal": "4.0.535",
+		"@remotion/eslint-config-internal": "4.0.536",
 		"eslint": "9.19.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},