{"record":{"id":"1ea5e9235e55fb0f","repo":"remotion-dev/remotion","slug":"input-input-does-not-end-with-a-valid-unit-val","errorCode":null,"errorMessage":"input ${input} does not end with a valid unit. Valid units are: ${units.join(', ')}","messagePattern":"input (.+?) does not end with a valid unit\\. Valid units are: (.+?)","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/animation-utils/src/transformation-helpers/make-transform/is-unit-with-string.ts","lineNumber":9,"sourceCode":"import {lengthUnits} from '../../type';\n\nexport const isUnitWithString = (input: unknown, units: readonly string[]) => {\n\tif (typeof input !== 'string') {\n\t\treturn false;\n\t}\n\n\tif (!units.find((u) => input.endsWith(u))) {\n\t\tthrow new Error(\n\t\t\t`input ${input} does not end with a valid unit. Valid units are: ${units.join(\n\t\t\t\t', ',\n\t\t\t)}`,\n\t\t);\n\t}\n\n\tconst match = input.match(/([0-9.]+)([a-z%]+)/);\n\tif (!match) {\n\t\tthrow new Error(\n\t\t\t`input ${input} is not a valid transform. Must be a number or a string ending in one of the following units: ${lengthUnits.join(\n\t\t\t\t', ',\n\t\t\t)}`,\n\t\t);\n\t}\n\n\treturn true;\n};\n","sourceCodeStart":1,"sourceCodeEnd":27,"githubUrl":"https://github.com/remotion-dev/remotion/blob/78fe4bb3fdb5a2cd68724393d63cb223db333fa7/packages/animation-utils/src/transformation-helpers/make-transform/is-unit-with-string.ts#L1-L27","documentation":"Thrown by isUnitWithString (used by the transform helpers translate, translateX/Y/Z, translate3d, rotate, scale, skew, etc.) when a string argument does not end with one of the allowed units for that function. The helper validates the suffix before parsing the number, so an unrecognized suffix is rejected up front with the list of valid units.","triggerScenarios":"Calling translate('100') (no unit), rotate('0.5') (no deg/rad/grad/turn), translate('10vw') when vw is not in the function's allowed unit list, or a typo like '10pxx'.","commonSituations":"Forgetting the unit on angle transforms (rotate needs deg/rad/grad/turn); using a unit not allowed for that function; passing a raw number-as-string instead of a number.","solutions":["Append a valid unit from the message's list ('10' -> '10px' for lengths, '0.5' -> '0.5turn' for angles).","Pass a plain number instead of a string so the helper appends its default unit (e.g. translate(100) -> 'translate(100px)').","Use the template-literal types (LengthUnitString, AngleUnitString, LengthPercentageUnitString) for compile-time validation."],"exampleFix":"// before\ntranslate('100');     // no unit\nrotate('0.25');       // no angle unit\n\n// after\ntranslate('100px');\nrotate('0.25turn');\n// or pass numbers and let the helper append the default unit:\ntranslate(100);\nrotate(0.25);","handlingStrategy":"type-guard","validationCode":"import {lengthUnits, angleUnits, lengthPercentageUnits} from '@remotion/animation-utils/type';\nconst endsWithValidUnit = (s: string, units: readonly string[]): boolean =>\n  units.some((u) => s.endsWith(u));\n// usage: endsWithValidUnit('100', lengthPercentageUnits)","typeGuard":"import type {LengthUnitString, AngleUnitString, LengthPercentageUnitString} from '@remotion/animation-utils/type';\n// The template-literal types enforce a number prefix + valid unit at compile time:\nconst translate = (x: LengthPercentageUnitString | number) => x;\ntranslate('100px'); // ok\ntranslate('100');    // type error","tryCatchPattern":null,"preventionTips":["Prefer passing numbers to transform helpers so the default unit is applied automatically.","Use the exported template-literal types (LengthUnitString, AngleUnitString) for compile-time safety.","Remember angle functions (rotate, skew) require deg/rad/grad/turn, not length units."],"tags":["transform","units","validation","css"],"backgroundTag":null,"analyzedSha":"78fe4bb3fdb5a2cd68724393d63cb223db333fa7","analyzedAt":"2026-08-12T17:18:50.444Z","schemaVersion":2},"datasetVersion":"2026-08-12T18:17:37.767Z"}