feat: Add YAML import when creating a Canvas

[harxhist]

Summary

Closes #1725

Adds the ability to create a Canvas by importing from a YAML file on the Create Canvas page (/canvases/new).

• New YAML parsing utility (parseCanvasYaml.ts) that accepts both:
  • The UI export format
  • The CLI resource format (apiVersion / kind: "Canvas")
• Tabbed UI ("Create manually" / "Import from YAML") with:
  • Paste support
  • File upload
  • Inline validation
  • Editable name/description after parsing
• No backend changes required — the existing CreateCanvas API already supports a full canvas spec with nodes and edges.

Video Demo: Loom

How it works

The user selects the "Import from YAML" tab, then either:

• Pastes YAML content, or
• Uploads a .yaml / .yml file

Clicking "Parse YAML" (or uploading a file):

1. Validates the structure
2. On success:
   • Pre-fills the name and description fields
   • Stores the parsed nodes and edges

These are passed through the existing useCreateCanvas mutation on submit.

The YAML format matches:

• The CLI output (superplane get canvas)
• The dev-mode YAML export in the UI

---

What changed

File	Change
web_src/src/utils/parseCanvasYaml.ts	New — shared YAML parser and file reader utility
web_src/src/components/CreateCanvasModal/index.tsx	Added "Import from YAML" tab, extracted CanvasFormFields subcomponent, extended submit data type with optional nodes/edges
web_src/src/pages/home/useCreateCanvasModalState.tsx	Extended onSubmit to pass through YAML-imported nodes/edges, falling back to template lookup
web_src/src/pages/canvas/CreateCanvasPage.tsx	Added same tabbed YAML import flow to the standalone create page

---

Tests

• Import valid YAML from UI
• Validate error handling for malformed YAML
• Validate error handling for invalid Canvas schema
• Confirm name/description pre-fill correctly
• Confirm nodes/edges are correctly passed to CreateCanvas API
• Confirm manual creation flow remains unaffected

[cursor]

You have run out of free Bugbot PR reviews for this billing cycle. This will reset on February 12.

To receive reviews on all of your PRs, visit the Cursor dashboard to activate Pro and start your 14-day free trial.

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{Bugbot Autofix is OFF. To automatically fix reported issues with Cloud Agents, enable Autofix in the Cursor dashboard.}

[harxhist]

@shiroyasha
Can you please assign this to me & review the PR?
I am working on other issue meanwhile.