remotion-dev/remotion · error

Component-owned Element initial style must be an object

Error message

Component-owned Element initial style must be an object

What it means

For component-owned Sequences, the Element's initialProps.style must be a plain object if present, since it is forwarded as React inline style. Null, arrays, or primitives are rejected so the codemod never writes invalid style values into user source files.

Solutions

1. Change initialProps.style to a plain object of CSS properties.
2. Move non-object styling to a dedicated prop of the Element component instead of style.
3. Validate the request payload before submitting the operation.

Example fix

// before
initialProps: {style: 'color: red'}
// after
initialProps: {style: {color: 'red'}}

const s = initialProps?.style;
if (s !== undefined && (s === null || typeof s !== 'object' || Array.isArray(s)))
  throw new Error('style must be a plain object');

const isStyleObject = (s: unknown): s is React.CSSProperties =>
  typeof s === 'object' && s !== null && !Array.isArray(s);

try {
  await applyOperation(request);
} catch (e) {
  if (String(e).includes('initial style')) sanitizeStyle(request);
}

When it happens

Trigger: A browser-studio install request where request.element.initialProps.style is null, an array, or a non-object (string/number) while the target Sequence is component-owned.

Common situations: Tooling serializing CSS style strings into initialProps; agents emitting style: [...] or style: null placeholders.

Understand the failure class

Background: "Must be a positive integer", "Invalid value", "Unsupported": the invalid-argument-value error family, when a library rejects the value you pass — this error's family across 35 libraries.

Related errors

• assetPath must be a non-empty public-folder path, or an…
• Cannot paste effects: invalid insertion indices
• Component-owned Element initial props must not override…
• Component-owned Element initial style must be an object
• Composition not found.

AI-assisted analysis of remotion-dev/remotion@46a3a6bf13 (2026-09-18). Data as JSON: /api/errors/dec954e0bd06dcdc. Report an issue: GitHub.

Appendix: source

Thrown at packages/browser-studio/src/browser-studio-operations.ts:2036

					componentOwnsSequence &&
					request.element.initialProps !== null &&
					['from', 'durationInFrames', 'name'].some((prop) =>
						Object.hasOwn(request.element.initialProps ?? {}, prop),
					)
				) {
					throw new Error(
						'Component-owned Element initial props must not override from, durationInFrames, or name',
					);
				}

				if (
					componentOwnsSequence &&
					request.element.initialProps?.style !== undefined &&
					(request.element.initialProps.style === null ||
						typeof request.element.initialProps.style !== 'object' ||
						Array.isArray(request.element.initialProps.style))
				) {
					throw new Error(
						'Component-owned Element initial style must be an object',
					);
				}

				const originalProject = getProject();
				let project = originalProject;
				if (request.newComposition !== null) {
					if (request.newComposition.codemod.newId !== request.compositionId) {
						throw new Error(
							'New composition ID does not match installation target',
						);
					}

					const absolutePath = resolveCodemodTargetFile({
						codemod: request.newComposition.codemod,
						project,
						symbolicatedStack: request.newComposition.symbolicatedStack,
					});

View on GitHub (pinned to 46a3a6bf13)