Skip to main content

unwrapFolder()v4.0.528

Removes a <Folder> wrapper while keeping its contents in the same position.

warning

Draft API: This API is experimental and may change.

unwrap-folder.ts
import {unwrapFolder, type CodemodProject} from '@remotion/codemods';

declare const project: CodemodProject;

const result = unwrapFolder({
  project,
  compositionFile: 'src/Root.tsx',
  folder: {name: 'Social', parentName: null},
});

console.log(result);

Compositions and child folders move up one level. Their order, props, component implementations, and media files are preserved. Nested child folders remain wrapped.

Options​

project​

An in-memory CodemodProject. The input project is not mutated.

compositionFile​

The project file containing the composition registrations. Registration edits support <Composition>, <Still>, and <Folder> with their original import names and static IDs or folder names.

folder​

Identifies a folder in compositionFile.

name​

The folder name.

parentName​

The slash-separated path of the parent folder, such as Social/Published. Use null for a top-level folder.

Return value​

Returns an object with the following properties.

project​

The updated project. Unchanged files and extra project fields are preserved.

changes​

An array of {filePath, previousContents, nextContents} file changes. A null content value indicates a created or deleted file.

Example transformation​

Before
<Folder name="Social">
  <Composition id="Portrait" component={Portrait} />
  <Folder name="Archive" />
</Folder>
After
<Composition id="Portrait" component={Portrait} />
<Folder name="Archive" />

These fragments show the children of a registration root; a fragment is inserted when needed to keep the surrounding JSX valid.

Errors​

Throws when the target cannot be resolved, the requested edit is unsupported, or an option is invalid. Failed edits leave the input project unchanged.

Compatibility​

BrowsersServersEnvironments
Chrome
Firefox
Safari
Node.js
Bun
Serverless Functions

See also​