# Canvas

## Get project canvas

`client.projects.canvas.retrieve(stringprojectID, RequestOptionsoptions?): CanvasRetrieveResponse`

**get** `/projects/{projectId}/canvas`

Returns the current project canvas topology as a Mermaid flowchart using the same serializer as the Fauna agent.

### Parameters

- `projectID: string`

  Project identifier

### Returns

- `CanvasRetrieveResponse`

  - `canvas_url: string`

    Project canvas URL

  - `diagram: string`

    Mermaid flowchart diagram

  - `project_id: string`

    Project identifier

  - `summary: Summary`

    - `edge_count: number`

    - `group_count: number`

    - `isolated_node_count: number`

    - `node_count: number`

    - `workflow_count: number`

### Example

```typescript
import FLORA from '@flora-ai/flora';

const client = new FLORA({
  apiKey: process.env['FLORA_API_KEY'], // This is the default and can be omitted
});

const canvas = await client.projects.canvas.retrieve('prj_abc123');

console.log(canvas.project_id);
```

#### Response

```json
{
  "canvas_url": "https://example.com",
  "diagram": "graph LR\n  n1[\"Prompt (text)\"]\n  n2[\"Result (image)\"]\n  n1 -->|text| n2",
  "project_id": "prj_abc123",
  "summary": {
    "edge_count": 0,
    "group_count": 0,
    "isolated_node_count": 0,
    "node_count": 0,
    "workflow_count": 0
  }
}
```

## Patch project canvas

`client.projects.canvas.update(stringprojectID, CanvasUpdateParamsbody, RequestOptionsoptions?): CanvasUpdateResponse`

**patch** `/projects/{projectId}/canvas`

Applies a Mermaid flowchart patch to the project canvas using the same create_workflow path as the Fauna agent. The diagram may add nodes, connect nodes, and reference existing canvas nodes by their Mermaid short IDs in edges (e.g. `n1 --> out`). This endpoint is add-only: re-declaring an existing node id with a label (e.g. `n3["..."]`) creates a NEW node instead of updating the existing one, and returns a warning. To attach to an existing node, reference its id in an edge without re-declaring its label. Subgraph grouping is not applied (nodes inside a `subgraph` are added ungrouped) and returns a warning. To place an existing image/video/audio as a static node, set `node_params` — which is keyed by Mermaid node id, e.g. `{ "img1": { "content_url": "https://…" } }`, NOT a bare `{ content_url }` object. `prompt` and `content_url` are mutually exclusive for a node: use `prompt` (or a label that doubles as the prompt) for generation, or `content_url` for existing media. When using `content_url`, give the node a content-free type-only label such as `img1["(Image)"]` so no prompt is inferred from the label.

### Parameters

- `projectID: string`

  Project identifier

- `body: CanvasUpdateParams`

  - `diagram: string`

    Mermaid flowchart diagram to apply

  - `node_params?: Record<string, NodeParams>`

    Optional per-node parameters, keyed by Mermaid node id (a Record<nodeId, NodeParams>), e.g. { "img1": { "content_url": "https://…" } }. Pass a map keyed by node id, NOT a bare { content_url } object.

    - `aspect_ratio?: string | null`

    - `content_url?: string | null`

      HTTPS URL of existing media to place as a static node. Mutually exclusive with prompt: give the node a content-free type-only label such as `(Image)` so no prompt is inferred from the label. Only supported for Image, Video, and Audio nodes.

    - `model?: string | null`

    - `model_parameters?: Record<string, unknown> | null`

    - `prompt?: string | null`

      Generation prompt for this node. Mutually exclusive with content_url. If omitted, the node's Mermaid label is used as the prompt.

    - `resolution?: string | null`

### Returns

- `CanvasUpdateResponse`

  - `canvas_url: string`

    Project canvas URL

  - `created_edge_count: number`

  - `created_node_count: number`

  - `diagram: string`

    Applied Mermaid flowchart diagram

  - `project_id: string`

    Project identifier

  - `warnings?: Array<string>`

### Example

```typescript
import FLORA from '@flora-ai/flora';

const client = new FLORA({
  apiKey: process.env['FLORA_API_KEY'], // This is the default and can be omitted
});

const canvas = await client.projects.canvas.update('prj_abc123', {
  diagram:
    'graph LR\n  source["Product photo (Image)"]\n  output["Editorial campaign image (Image)"]\n  source --> output',
});

console.log(canvas.project_id);
```

#### Response

```json
{
  "canvas_url": "https://example.com",
  "created_edge_count": 0,
  "created_node_count": 0,
  "diagram": "graph LR\n  n1[\"Prompt (text)\"]\n  n2[\"Result (image)\"]\n  n1 --> n2",
  "project_id": "prj_abc123",
  "warnings": [
    "string"
  ]
}
```

## Domain Types

### Canvas Retrieve Response

- `CanvasRetrieveResponse`

  - `canvas_url: string`

    Project canvas URL

  - `diagram: string`

    Mermaid flowchart diagram

  - `project_id: string`

    Project identifier

  - `summary: Summary`

    - `edge_count: number`

    - `group_count: number`

    - `isolated_node_count: number`

    - `node_count: number`

    - `workflow_count: number`

### Canvas Update Response

- `CanvasUpdateResponse`

  - `canvas_url: string`

    Project canvas URL

  - `created_edge_count: number`

  - `created_node_count: number`

  - `diagram: string`

    Applied Mermaid flowchart diagram

  - `project_id: string`

    Project identifier

  - `warnings?: Array<string>`
