[pull] main from remotion-dev:main

package.json

@@ -132,14 +132,14 @@
 			"@types/node": "20.12.14",
 			"@types/web": "0.0.166",
 			"@types/bun": "1.3.3",
-			"mediabunny": "1.55.4",
-			"@mediabunny/server": "1.55.4",
-			"@mediabunny/mp3-encoder": "1.55.4",
-			"@mediabunny/aac-encoder": "1.55.4",
-			"@mediabunny/flac-encoder": "1.55.4",
-			"@mediabunny/prores": "1.55.4",
-			"@mediabunny/ac3": "1.55.4",
-			"@mediabunny/dts": "1.55.4",
+			"mediabunny": "1.55.5",
+			"@mediabunny/server": "1.55.5",
+			"@mediabunny/mp3-encoder": "1.55.5",
+			"@mediabunny/aac-encoder": "1.55.5",
+			"@mediabunny/flac-encoder": "1.55.5",
+			"@mediabunny/prores": "1.55.5",
+			"@mediabunny/ac3": "1.55.5",
+			"@mediabunny/dts": "1.55.5",
 			"next": "16.2.11",
 			"three": "0.178.0",
 			"sharp": "0.34.5",

packages/codex-plugin/.codex-plugin/plugin.json → packages/agent-plugin/.codex-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
 	"name": "remotion",
-	"version": "4.0.519",
+	"version": "4.0.520",
 	"description": "Remotion video creation skills — best practices, animations, audio, captions, 3D, and more for building programmatic videos with React.",
 	"author": {
 		"name": "Remotion",

packages/agent-plugin/README.cursor.md

@@ -0,0 +1,28 @@
+# Remotion Agent Plugin
+
+The official portable [Remotion](https://www.remotion.dev/) Agent Plugin. It
+teaches compatible coding agents how to create videos with React, including
+animations, audio, captions, 3D, transitions, charts, text effects, and
+rendering.
+
+## Install
+
+Install Remotion from a compatible Agent Plugins marketplace. This portable
+package is intended for clients such as GitHub Copilot and Cursor. For local
+Cursor development, clone this repository:
+
+```bash
+git clone https://github.com/remotion-dev/cursor-plugin.git ~/.cursor/plugins/local/remotion
+```
+
+Restart Cursor after installing the local plugin.
+
+## Development
+
+This repository is generated from the
+[`packages/agent-plugin`](https://github.com/remotion-dev/remotion/tree/main/packages/agent-plugin)
+package in the Remotion monorepo. Changes made directly in this repository will
+be overwritten by the release pipeline.
+
+Please report issues and contribute changes in the
+[`remotion-dev/remotion`](https://github.com/remotion-dev/remotion) repository.

packages/codex-plugin/README.md → packages/agent-plugin/README.md

@@ -1,4 +1,4 @@
-# @remotion/codex-plugin
+# @remotion/agent-plugin
 
 ## Usage
 

packages/codex-plugin/package.json → packages/agent-plugin/package.json

@@ -1,10 +1,10 @@
 {
-	"name": "@remotion/codex-plugin",
-	"version": "4.0.519",
+	"name": "@remotion/agent-plugin",
+	"version": "4.0.520",
 	"private": true,
 	"type": "module",
 	"repository": {
-		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/codex-plugin"
+		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/agent-plugin"
 	},
 	"scripts": {
 		"formatting": "oxfmt . --check",
@@ -19,13 +19,16 @@
 		"url": "https://github.com/remotion-dev/remotion/issues"
 	},
 	"devDependencies": {
+		"@microsoft/vally": "0.12.0",
 		"@remotion/eslint-config-internal": "workspace:*",
-		"eslint": "catalog:",
-		"@typescript/native-preview": "catalog:"
+		"@typescript/native-preview": "catalog:",
+		"eslint": "catalog:"
 	},
 	"keywords": [
 		"remotion",
+		"agent-plugin",
 		"codex",
+		"cursor",
 		"plugin",
 		"skills"
 	]

packages/codex-plugin/plugin.json → packages/agent-plugin/plugin.json

@@ -1,7 +1,7 @@
 {
 	"$schema": "https://agent-plugins.org/schemas/1.0.0/plugin.schema.json",
 	"name": "remotion",
-	"version": "4.0.519",
+	"version": "4.0.520",
 	"description": "Remotion video creation skills — best practices, animations, audio, captions, 3D, and more for building programmatic videos with React.",
 	"author": {
 		"name": "Remotion",

packages/codex-plugin/test/plugin.test.ts → packages/agent-plugin/test/plugin.test.ts

@@ -9,6 +9,7 @@ import {
 } from 'node:fs';
 import {tmpdir} from 'node:os';
 import path from 'node:path';
+import {LintConsoleReporter, runLint} from '@microsoft/vally';
 
 const packageRoot = path.resolve(import.meta.dir, '..');
 const generatedSkillsRoot = path.join(packageRoot, 'skills');
@@ -72,6 +73,23 @@ const getMarkdownFiles = (directory: string): string[] => {
 	});
 };
 
+const expectVallyLintToPass = async (
+	rootPath: string,
+	expectedSkillsRoot: string,
+) => {
+	const result = await runLint({rootPath});
+	await new LintConsoleReporter({verbose: true}).report(result);
+
+	expect(result.skillResults.map(({skill}) => skill.name).sort()).toEqual(
+		getDirectories(expectedSkillsRoot),
+	);
+	expect(result.passed).toBe(true);
+};
+
+test('generated Agent Plugin passes Vally lint', async () => {
+	await expectVallyLintToPass(packageRoot, generatedSkillsRoot);
+});
+
 test('only top-level skills use the discovery filename', () => {
 	const topLevelSkillNames = getDirectories(generatedSkillsRoot);
 	for (const skillName of topLevelSkillNames) {
@@ -115,6 +133,30 @@ test('links to embedded skills use the renamed file', () => {
 	}
 });
 
+test('file links stay within each skill directory', () => {
+	for (const skillName of getDirectories(generatedSkillsRoot)) {
+		const skillRoot = path.join(generatedSkillsRoot, skillName);
+		for (const file of getMarkdownFiles(skillRoot)) {
+			const contents = readFileSync(file, 'utf-8');
+			for (const match of contents.matchAll(/!?\[[^\]]+]\(([^)]+)\)/g)) {
+				const target = match[1];
+				if (!target.startsWith('./') && !target.startsWith('../')) {
+					continue;
+				}
+
+				const targetWithoutFragment = target.split('#')[0];
+				const relativeTarget = path.relative(
+					skillRoot,
+					path.resolve(path.dirname(file), targetWithoutFragment),
+				);
+				expect(relativeTarget).not.toBe('..');
+				expect(relativeTarget.startsWith(`..${path.sep}`)).toBe(false);
+				expect(path.isAbsolute(relativeTarget)).toBe(false);
+			}
+		}
+	}
+});
+
 test('maps is available from either standalone parent skill', () => {
 	for (const parentSkill of ['remotion-best-practices', 'remotion-markup']) {
 		const parentRoot = path.join(generatedSkillsRoot, parentSkill);
@@ -156,7 +198,7 @@ test('Codex troubleshooting does not open the system browser', () => {
 	expect(remotionSkill).not.toMatch(/^npx remotion studio$/m);
 });
 
-test('Cursor build omits Codex troubleshooting', () => {
+test('portable build passes Vally lint and omits Codex troubleshooting', async () => {
 	const cursorSkillsRoot = mkdtempSync(
 		path.join(tmpdir(), 'remotion-cursor-plugin-skills-'),
 	);
@@ -187,6 +229,7 @@ test('Cursor build omits Codex troubleshooting', () => {
 		);
 		expect(remotionSkill).not.toContain('## Codex troubleshooting');
 		expect(remotionSkill).not.toContain('## Agent client troubleshooting');
+		await expectVallyLintToPass(cursorSkillsRoot, cursorSkillsRoot);
 	} finally {
 		rmSync(cursorSkillsRoot, {recursive: true});
 	}

packages/animated-emoji/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/animated-emoji",
-	"version": "4.0.519",
+	"version": "4.0.520",
 	"main": "dist/cjs/index.js",
 	"types": "dist/cjs/index.d.ts",
 	"module": "dist/esm/index.mjs",

packages/animation-utils/package.json

@@ -7,7 +7,7 @@
 		"name": "Chetan Karwa",
 		"email": "cbkarwa@gmail.com"
 	},
-	"version": "4.0.519",
+	"version": "4.0.520",
 	"description": "Helpers for animating CSS properties",
 	"main": "./dist/index.js",
 	"module": "./dist/index.mjs",

packages/astro-example/package.json

@@ -5,7 +5,7 @@
 	"name": "@remotion/astro-example",
 	"private": true,
 	"type": "module",
-	"version": "4.0.519",
+	"version": "4.0.520",
 	"scripts": {
 		"dev": "astro dev",
 		"start": "astro dev",

packages/babel-loader/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/babel-loader"
 	},
 	"name": "@remotion/babel-loader",
-	"version": "4.0.519",
+	"version": "4.0.520",
 	"description": "Babel loader for Remotion",
 	"main": "dist/index.js",
 	"scripts": {

packages/brand/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/brand"
 	},
 	"name": "@remotion/brand",
-	"version": "4.0.519",
+	"version": "4.0.520",
 	"private": true,
 	"sideEffects": [
 		"*.css"

packages/browser-studio/e2e/browser-studio.test.ts

@@ -13,7 +13,7 @@ import {
 import {strFromU8, unzipSync} from 'fflate';
 
 const localImagePath = fileURLToPath(
-	new URL('../../codex-plugin/assets/logo.png', import.meta.url),
+	new URL('../../agent-plugin/assets/logo.png', import.meta.url),
 );
 const localVideoPath = fileURLToPath(
 	new URL('../../example/public/framer.webm', import.meta.url),

packages/browser-studio/package.json

@@ -4,7 +4,7 @@
 	},
 	"name": "@remotion/browser-studio",
 	"private": true,
-	"version": "4.0.519",
+	"version": "4.0.520",
 	"description": "Run Remotion Studio in the browser",
 	"main": "dist/esm/index.mjs",
 	"types": "dist/index.d.ts",

packages/browser-studio/src/browser-studio-operations.ts

@@ -319,7 +319,6 @@ const getElementInstallPlanForProject = async ({
 					compositionFile: destination.compositionFile,
 					compositionId: destination.compositionId,
 					environment: makeInMemoryInsertJsxElementCodemodEnvironment({
-						formatFile: formatCodemodFile,
 						project,
 						svgMarkupToJsx,
 					}),
@@ -1368,7 +1367,6 @@ export const createBrowserStudioOperations = ({
 				nodePath,
 				sequenceKeys,
 				splitFrame,
-				formatFile: formatCodemodFile,
 			});
 			const nodePathMutation = controller.applyMutation({
 				fileName: absolutePath,
@@ -1904,7 +1902,6 @@ export const createBrowserStudioOperations = ({
 				project: getProject(),
 			});
 			const result = await insertJsxElementIntoProjectWithNodePathRemappings({
-				formatFile: formatCodemodFile,
 				project,
 				request,
 				svgMarkupToJsx,
@@ -2048,7 +2045,6 @@ export const createBrowserStudioOperations = ({
 				const durationInFrames = request.element.durationInFrames ?? null;
 				const insertion =
 					await insertJsxElementIntoProjectWithNodePathRemappings({
-						formatFile: formatCodemodFile,
 						project,
 						request: {
 							compositionFile: request.compositionFile,

packages/bugs/package.json

@@ -4,5 +4,5 @@
 	},
 	"name": "bugs",
 	"private": true,
-	"version": "4.0.519"
+	"version": "4.0.520"
 }

packages/bundler/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/bundler"
 	},
 	"name": "@remotion/bundler",
-	"version": "4.0.519",
+	"version": "4.0.520",
 	"description": "Bundle Remotion compositions using Webpack",
 	"main": "dist/index.js",
 	"bugs": {

packages/canvas-capture-extension/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@remotion/canvas-capture-extension",
-	"version": "4.0.519",
+	"version": "4.0.520",
 	"private": true,
 	"type": "module",
 	"scripts": {

packages/canvas/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/canvas"
 	},
 	"name": "@remotion/canvas",
-	"version": "4.0.519",
+	"version": "4.0.520",
 	"description": "Headless primitives for Remotion authoring interfaces",
 	"main": "dist/index.cjs",
 	"types": "dist/index.d.ts",

packages/canvas/src/calculate-timeline.ts

@@ -17,7 +17,7 @@ import type {
 	TimelineTrackWithOriginalTimings,
 } from './get-timeline-sequence-sort-key';
 import {getTimelineSequenceSortKey} from './get-timeline-sequence-sort-key';
-import {sortItemsByNonceHistory} from './sort-by-nonce-history';
+import {sortItemsByCommitOrder} from './sort-by-commit-order';
 import {timelineSequenceNodePathToKey} from './timeline-sequence-node-path-to-key';
 
 const getInheritedLoopDisplay = (
@@ -49,7 +49,10 @@ export const calculateTimeline = ({
 	overrideIdsToNodePaths: OverrideIdToNodePaths;
 	compositions?: readonly _InternalTypes['AnyComposition'][];
 }): TimelineTrackData[] => {
-	const sortedSequences = sortItemsByNonceHistory(sequences);
+	const sortedSequences = sortItemsByCommitOrder(
+		sequences,
+		(sequence) => sequence.timelineOrder,
+	);
 	const tracks: TimelineTrackWithOriginalTimings[] = [];
 
 	if (sortedSequences.length === 0) {
@@ -142,15 +145,15 @@ export const calculateTimeline = ({
 		});
 	}
 
-	const nonceRanks = new Map<string, number>();
+	const sequenceRanks = new Map<string, number>();
 	for (let i = 0; i < tracks.length; i++) {
-		nonceRanks.set(tracks[i].sequence.id, i);
+		sequenceRanks.set(tracks[i].sequence.id, i);
 	}
 
 	const sortedTracks: TimelineTrackData[] = tracks
 		.sort((a, b) => {
-			const sortKeyA = getTimelineSequenceSortKey(a, tracks, nonceRanks);
-			const sortKeyB = getTimelineSequenceSortKey(b, tracks, nonceRanks);
+			const sortKeyA = getTimelineSequenceSortKey(a, tracks, sequenceRanks);
+			const sortKeyB = getTimelineSequenceSortKey(b, tracks, sequenceRanks);
 			return sortKeyA.localeCompare(sortKeyB);
 		})
 		.map((track) => {

packages/canvas/src/get-timeline-sequence-sort-key.ts

@@ -30,9 +30,9 @@ export type TimelineTrackWithOriginalTimings = TimelineTrackData & {
 export const getTimelineSequenceSortKey = (
 	track: TimelineTrackData,
 	tracks: TimelineTrackData[],
-	nonceRanks: Map<string, number>,
+	sequenceRanks: Map<string, number>,
 ): string => {
-	const rank = nonceRanks.get(track.sequence.id) ?? 0;
+	const rank = sequenceRanks.get(track.sequence.id) ?? 0;
 	const id = String(rank).padStart(6, '0');
 	if (!track.sequence.parent) {
 		return id;
@@ -45,5 +45,5 @@ export const getTimelineSequenceSortKey = (
 		return id;
 	}
 
-	return `${getTimelineSequenceSortKey(parent, tracks, nonceRanks)}-${id}`;
+	return `${getTimelineSequenceSortKey(parent, tracks, sequenceRanks)}-${id}`;
 };

packages/canvas/src/index.ts

@@ -32,8 +32,5 @@ export type {
 	CanvasSelectionInteraction,
 	CanvasSelectionSnapshot,
 } from './selection';
-export {
-	compareNonceHistories,
-	sortItemsByNonceHistory,
-} from './sort-by-nonce-history';
+export {sortItemsByCommitOrder} from './sort-by-commit-order';
 export {timelineSequenceNodePathToKey} from './timeline-sequence-node-path-to-key';