Run any Skill in Manus with one click

$pwd:

canvas

Name: Canvas
Author: phodal

// Create or update a Routa Canvas artifact for the current task. Use when the user wants a live visual or interactive canvas generated from a Routa session.

Run Skill in Manus

$ git log --oneline --stat

stars:1,607

forks:222

updated:April 27, 2026 at 00:50

SKILL.md

readonly

name	canvas
description	Create or update a Routa Canvas artifact for the current task. Use when the user wants a live visual or interactive canvas generated from a Routa session.
metadata	{"short-description":"Create a Routa Canvas artifact"}

Use Routa Canvas for this turn.

Canvas behavior:

Create or overwrite exactly one *.canvas.tsx file during the tool run.
The file content must be the TSX source itself, not markdown.
Prefer storing the file under the selected repository when appropriate.
Use a short descriptive file name ending in .canvas.tsx.
After the file is created, mention the created path briefly.

Source contract:

Create a Routa browser canvas as TSX source code.
Return only the TSX source.
Do not include markdown code fences.
Do not include explanations, notes, or prose before or after the code.
The source must export default function Canvas() or export default Canvas.
Prefer a self-contained component with inline styles.
If you import anything, you may only import from react, routa/canvas, routa/canvas/*, @canvas-sdk, or @canvas-sdk/*.
Do not use browser globals or side effects such as window, document, fetch, or localStorage.
Do not render fake shell chrome such as browser frames, global app shells, left sidebars, or chat panes unless the prompt explicitly asks for it.
Keep the composition flat, minimal, purposeful; avoid gradients, emojis, box shadows.

Canvas SDK access:

Prefer MCP tool read_canvas_sdk_resource with uri resource://routa/canvas-sdk/manifest.
If your provider supports native MCP resource reads, you may read that same URI directly instead.
That manifest is the authoritative Canvas SDK index for this session.
Then read only the defs resources you actually need from its definitionResources list, preferably through read_canvas_sdk_resource.
Import only from routa/canvas or react.
If a symbol or prop is not present in those resources, do not invent it.
Example definition resources:
resource://routa/canvas-sdk/defs/primitives
resource://routa/canvas-sdk/defs/hooks
resource://routa/canvas-sdk/defs/data-display
resource://routa/canvas-sdk/defs/containers
resource://routa/canvas-sdk/defs/controls
resource://routa/canvas-sdk/defs/charts
resource://routa/canvas-sdk/defs/diff-view
resource://routa/canvas-sdk/defs/dag-layout
If neither direct resource reads nor the helper tool are available, stay conservative and use only the symbols named in the manifest.

related-skills.json

same repository

release.md

from "phodal/routa"

Automate the Routa release preparation workflow from version sync through release note and blog generation. Use when the user wants to prepare, publish, or dry-run a Routa release.

2026-04-181.6k

issue-enricher.md

from "phodal/routa"

Transforms rough requirements into well-structured GitHub issues. Use when the user provides a vague idea, feature request, or problem description and wants to create a GitHub issue. Analyzes codebase, explores solution approaches, researches relevant libraries, and generates actionable issues using `gh` CLI.

2026-04-181.6k

docx.md

from "phodal/routa"

Use this skill for creating, editing, and reviewing DOCX files, including generation, formatting, content controls, tracked changes, comments, accessibility checks, redaction, rendering, and diff-based QA workflows.

2026-04-041.6k

pdf.md

from "phodal/routa"

Use this skill for PDF generation, conversion, inspection, extraction, editing, form filling, OCR, redaction, or render comparison. Triggers include requests to create a PDF, convert Markdown or HTML or LaTeX or DOCX or PPTX to PDF, extract text or tables or images, fill or inspect forms, OCR scans, compare revisions, or redact content.

2026-04-041.6k

slide.md

from "phodal/routa"

Use this skill as reference material when creating or editing presentation slide decks.

2026-04-041.6k

spreadsheets.md

from "phodal/routa"

Use this skill for spreadsheet creation, editing, analysis, formatting, formula modeling, charting, or workbook review. Triggers include requests to create or modify an .xlsx file, build a model or tracker, format a workbook, add formulas or charts, or prepare a shareable spreadsheet deliverable.

2026-04-041.6k

package.json

"author": "phodal"

"repository": "phodal/routa"

View GitHub Repository View Creator Repositories

$ install --global

$ download --local

Run Skill in Manus

$ useful --forSOC

Software DevelopersComputer and Mathematical Occupations15-1252L4

name	canvas
description	Create or update a Routa Canvas artifact for the current task. Use when the user wants a live visual or interactive canvas generated from a Routa session.
metadata	{"short-description":"Create a Routa Canvas artifact"}

Use Routa Canvas for this turn.

Canvas behavior:

Create or overwrite exactly one *.canvas.tsx file during the tool run.
The file content must be the TSX source itself, not markdown.
Prefer storing the file under the selected repository when appropriate.
Use a short descriptive file name ending in .canvas.tsx.
After the file is created, mention the created path briefly.

Source contract:

Create a Routa browser canvas as TSX source code.
Return only the TSX source.
Do not include markdown code fences.
Do not include explanations, notes, or prose before or after the code.
The source must export default function Canvas() or export default Canvas.
Prefer a self-contained component with inline styles.
If you import anything, you may only import from react, routa/canvas, routa/canvas/*, @canvas-sdk, or @canvas-sdk/*.
Do not use browser globals or side effects such as window, document, fetch, or localStorage.
Do not render fake shell chrome such as browser frames, global app shells, left sidebars, or chat panes unless the prompt explicitly asks for it.
Keep the composition flat, minimal, purposeful; avoid gradients, emojis, box shadows.

Canvas SDK access:

Prefer MCP tool read_canvas_sdk_resource with uri resource://routa/canvas-sdk/manifest.
If your provider supports native MCP resource reads, you may read that same URI directly instead.
That manifest is the authoritative Canvas SDK index for this session.
Then read only the defs resources you actually need from its definitionResources list, preferably through read_canvas_sdk_resource.
Import only from routa/canvas or react.
If a symbol or prop is not present in those resources, do not invent it.
Example definition resources:
resource://routa/canvas-sdk/defs/primitives
resource://routa/canvas-sdk/defs/hooks
resource://routa/canvas-sdk/defs/data-display
resource://routa/canvas-sdk/defs/containers
resource://routa/canvas-sdk/defs/controls
resource://routa/canvas-sdk/defs/charts
resource://routa/canvas-sdk/defs/diff-view
resource://routa/canvas-sdk/defs/dag-layout
If neither direct resource reads nor the helper tool are available, stay conservative and use only the symbols named in the manifest.

canvas

More from this repository

More from this repository