{"record":{"id":"8fa85c70ef7f4046","repo":"remotion-dev/remotion","slug":"outputstyles-must-have-at-least-2-elements","errorCode":null,"errorMessage":"outputStyles must have at least 2 elements","messagePattern":"outputStyles must have at least 2 elements","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/animation-utils/src/transformation-helpers/interpolate-styles/index.tsx","lineNumber":261,"sourceCode":"\t\t\t\t`inputRange must contain only finite numbers, but got [${arr.join(\n\t\t\t\t\t',',\n\t\t\t\t)}]`,\n\t\t\t);\n\t\t}\n\n\t\tif (index > 0 && !(arr[index] > arr[index - 1])) {\n\t\t\tthrow new Error(\n\t\t\t\t`inputRange must be strictly monotonically non-decreasing but got [${arr.join(\n\t\t\t\t\t',',\n\t\t\t\t)}]`,\n\t\t\t);\n\t\t}\n\t}\n}\n\nfunction checkStylesRange(arr: readonly Style[]) {\n\tif (arr.length < 2) {\n\t\tthrow new Error('outputStyles must have at least 2 elements');\n\t}\n\n\tfor (const index in arr) {\n\t\tif (typeof arr[index] !== 'object') {\n\t\t\tthrow new Error('outputStyles must contain only objects');\n\t\t}\n\t}\n}\n\n/*\n * @description A function that interpolates between two styles based on an input range.\n * @see [Documentation](https://remotion.dev/docs/animation-utils/interpolate-styles)\n */\nexport const interpolateStyles = (\n\tinput: number,\n\tinputRange: number[],\n\toutputStylesRange: Style[],\n\toptions?: InterpolateOptions,","sourceCodeStart":243,"sourceCodeEnd":279,"githubUrl":"https://github.com/remotion-dev/remotion/blob/78fe4bb3fdb5a2cd68724393d63cb223db333fa7/packages/animation-utils/src/transformation-helpers/interpolate-styles/index.tsx#L243-L279","documentation":"Thrown by checkStylesRange when outputStylesRange has fewer than 2 elements. Like inputRange, at least two style snapshots are needed to define an interpolation segment, so a 0- or 1-element styles list is rejected.","triggerScenarios":"Calling interpolateStyles(frame, [0, 30], [{opacity: 1}]) with only one style; passing an empty styles array [] while the inputRange has multiple entries.","commonSituations":"Building the styles array dynamically and ending with one entry; a styles list whose length drifted from the inputRange length.","solutions":["Provide at least 2 style objects whose count matches inputRange.length.","Validate outputStylesRange.length >= 2 before calling interpolateStyles.","If you only need one style, return it directly instead of interpolating."],"exampleFix":"// before\ninterpolateStyles(frame, [0, 30], [{opacity: 1}]);\n\n// after\ninterpolateStyles(frame, [0, 30], [{opacity: 1}, {opacity: 0}]);","handlingStrategy":"validation","validationCode":"if (!Array.isArray(outputStylesRange) || outputStylesRange.length < 2) {\n  throw new Error('outputStyles must have at least 2 elements');\n}","typeGuard":"const hasMinTwoStyles = (arr: unknown): boolean =>\n  Array.isArray(arr) && arr.length >= 2;","tryCatchPattern":null,"preventionTips":["Always pair at least two style snapshots with your inputRange.","Return a static style directly when only one target is needed.","Validate outputStylesRange.length >= 2 for dynamic style arrays."],"tags":["interpolate-styles","output-styles","validation"],"backgroundTag":null,"analyzedSha":"78fe4bb3fdb5a2cd68724393d63cb223db333fa7","analyzedAt":"2026-08-12T17:18:50.444Z","schemaVersion":2},"datasetVersion":"2026-08-12T23:17:12.415Z"}