> ## Documentation Index
> Fetch the complete documentation index at: https://docs.compyle.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Editor

The **Editor** is a **secure, isolated workspace** where your project runs. All changes made by you or the agent stay inside this environment, never affecting your local machine.

<Callout icon="sparkles" iconType="duotone" color="#3CB878">
  <strong>How the Agent Uses the Editor</strong><br />
  You give instructions in the **chat**, and the agent updates or creates files directly in the **Editor**.
</Callout>

<Frame caption="Editor Overview">
  <iframe src="https://www.youtube.com/embed/cN6BY11CrlU?si=kEOOt6fiWsY9LmfD" title="Editor Overview" className="w-full aspect-video rounded-xl" />
</Frame>

***

## Using the Compile Editor

The Editor supports **collaborative work**. You may:

* Build features through chat.
* Review or modify files at any time.
* Experiment safely in an isolated workspace.
* Allow the agent to run code and apply updates consistently.

***

## Behind the Scenes

The Editor works as a small **virtual machine** holding your project.\
All changes stay within this workspace, keeping your main codebase untouched.

<Callout icon="users" iconType="duotone" color="#3CB878">
  <strong>Collaborative Agent Workflow</strong><br />
  The agent works alongside you: it may ask for clarification, suggest improvements, and updates files only with your approval.
</Callout>

***

## Example

```ts theme={null}
// User instruction
"Refactor the data processing function for clarity."

// Existing code
function processData(input: string[]) {
  return input
    .filter(item => item.length > 0)
    .map(item => item.trim());
}
```