{"record":{"id":"07e2a0f0039b96e8","repo":"remotion-dev/remotion","slug":"if-layout-none-you-may-not-pass-a-style-passed","errorCode":null,"errorMessage":"If layout=\"none\", you may not pass a style. Passed: ${JSON.stringify(other.style)}","messagePattern":"If layout=\"none\", you may not pass a style\\. Passed: (.+?)","errorType":"exception","errorClass":"TypeError","httpStatus":null,"severity":"error","filePath":"packages/core/src/Sequence.tsx","lineNumber":199,"sourceCode":"\t\t(value) => value !== undefined,\n\t);\n\n\tif (layout === 'none' && hasCropProp) {\n\t\tthrow new TypeError(\n\t\t\t'The cropLeft, cropRight, cropTop and cropBottom props of <Sequence /> are only supported with layout=\"absolute-fill\".',\n\t\t);\n\t}\n\n\tvalidateSequenceCrop(cropProps);\n\tconst {\n\t\tleft: resolvedCropLeft,\n\t\tright: resolvedCropRight,\n\t\ttop: resolvedCropTop,\n\t\tbottom: resolvedCropBottom,\n\t} = resolveSequenceCrop(cropProps);\n\t// @ts-expect-error\n\tif (layout === 'none' && typeof other.style !== 'undefined') {\n\t\tthrow new TypeError(\n\t\t\t'If layout=\"none\", you may not pass a style. Passed: ' +\n\t\t\t\t// @ts-expect-error\n\t\t\t\tJSON.stringify(other.style),\n\t\t);\n\t}\n\n\tif (typeof durationInFrames !== 'number') {\n\t\tthrow new TypeError(\n\t\t\t`You passed to durationInFrames an argument of type ${typeof durationInFrames}, but it must be a number.`,\n\t\t);\n\t}\n\n\tif (durationInFrames <= 0) {\n\t\tthrow new TypeError(\n\t\t\t`durationInFrames must be positive, but got ${durationInFrames}`,\n\t\t);\n\t}\n","sourceCodeStart":181,"sourceCodeEnd":217,"githubUrl":"https://github.com/remotion-dev/remotion/blob/78fe4bb3fdb5a2cd68724393d63cb223db333fa7/packages/core/src/Sequence.tsx#L181-L217","documentation":"Thrown by <Sequence> when `layout=\"none\"` is set and a `style` prop is provided. With layout=\"none\", <Sequence> does not render its own positioning wrapper (the parent owns layout), so any style passed would have no element to attach to and would be silently dropped. The error makes that silent drop visible.","triggerScenarios":"Passing `layout=\"none\"` plus `style={{...}}`; spreading a shared props object that includes style into a layout=\"none\" Sequence; copying a styled Sequence and changing its layout to 'none'.","commonSituations":"Reusing Sequence wrappers that always carry style; refactoring to embed a Sequence in a custom layout but leaving the style prop in place.","solutions":["Remove the `style` prop when using `layout=\"none\"`.","If you need styling, switch to `layout=\"absolute-fill\"` and pass style on the Sequence, or wrap the layout=\"none\" Sequence in your own styled element.","Filter style out of shared props before forwarding to a layout=\"none\" Sequence.","Type-check with a discriminated union so style is only allowed with the absolute-fill layout."],"exampleFix":"// before\n<Sequence layout=\"none\" style={{backgroundColor: 'red'}} durationInFrames={30} />\n// after\n<Sequence layout=\"none\" durationInFrames={30} />","handlingStrategy":"validation","validationCode":"if (layout === 'none' && typeof style !== 'undefined') {\n  throw new TypeError('Cannot pass style with layout=\"none\"');\n}","typeGuard":"const isStyleFree = (style: unknown): boolean => typeof style === 'undefined';","tryCatchPattern":null,"preventionTips":["Never pass style to a layout=\"none\" Sequence.","Wrap the layout=\"none\" Sequence in your own styled element if you need styling.","Use a discriminated-union prop type so style is only allowed with absolute-fill.","Filter style from shared props before forwarding."],"tags":["sequence","layout","style","props","validation"],"backgroundTag":null,"analyzedSha":"78fe4bb3fdb5a2cd68724393d63cb223db333fa7","analyzedAt":"2026-08-12T17:18:50.444Z","schemaVersion":2},"datasetVersion":"2026-08-12T18:17:37.767Z"}