Back to directory

Canvas Nodecard Pattern

Agent skill
1 skill

vibe-editor の Canvas モード (@xyflow/react) に新しいカード種 (CardType) や hand-off エッジを追加するときに使う skill。src/renderer/src/stores/canvas.ts の CardType ユニオン拡張、CardData 設計、zustand persist との整合、CARDTYPES validator、addCard / removeCard の挙動 (cascadeTeam デフォルト、teamLocks, stageView)、Issue 157 (id 衝突 → crypto.randomUUID)、Issue 156 (pulseEdge TTL タイマ管理)、Canvas レンダリング側のコンポーネント追加箇所をカバー。ユーザーが「Canvas に◯◯カードを追加」「新しいノード種」「CardType を増やす」「@xyflow/react に新カスタムノード」「hand-off エッジ」「pulseEdge」「stageView」「teamLocks」「Canvas store を拡張」「ワークスペースプリセットに新カード」等を言ったとき、また stores/canvas.ts / components/canvas/ / layouts/CanvasLayout を編集しそうなときには必ずこの skill を起動すること。

Install with
Claude CodeCodexCursorGitHub CopilotGemini CLI

Supported by the Atlas install prompt. Skill-specific requirements vary.

Skill stats

Skills1CategorySecurityStars0

About this skill

vibe-editor の Canvas モード (@xyflow/react) に新しいカード種 (CardType) や hand-off エッジを追加するときに使う skill。src/renderer/src/stores/canvas.ts の CardType ユニオン拡張、CardData 設計、zustand persist との整合、CARDTYPES validator、addCard / removeCard の挙動 (cascadeTeam デフォルト、teamLocks, stageView)、Issue 157 (id 衝突 → crypto.randomUUID)、Issue 156 (pulseEdge TTL タイマ管理)、Canvas レンダリング側のコンポーネント追加箇所をカバー。ユーザーが「Canvas に◯◯カードを追加」「新しいノード種」「CardType を増やす」「@xyflow/react に新カスタムノード」「hand-off エッジ」「pulseEdge」「stageView」「teamLocks」「Canvas store を拡張」「ワークスペースプリセットに新カード」等を言ったとき、また stores/canvas.ts / components/canvas/ / layouts/CanvasLayout を編集しそうなときには必ずこの skill を起動すること。

Quick start

  1. Copy the install prompt. Use the green button above this README.
  2. Send it to your agent. Paste it into your coding agent’s chat and send.
  3. Review the setup. Your agent checks the skill’s instructions, requirements, and installation scope.
Review, license & listing details
Review the source before using this skill

This is an imported listing. We haven’t certified its safety, license, or compatibility. Skills may include executable scripts.

Automated security scan: Partial

Only SKILL.md was scanned. Supporting files and scripts were not checked. No safety grade has been assigned.

0 potential findings · Scanned 11/4/2026 · Scanner 0.2.1

Content SHA-256: f24b591fbd7369aa022e0a8861a4f872853725e2c66c17cd76a16bfe9adc0594

About scan coverage and limitations

About this listing

Category
Security
Reported license
MIT
Listing language (estimated)
Japanese
Review status
Not individually reviewed
Agent compatibility
Atlas installation supports Claude Code, Codex, and Cursor. Skill-specific dependencies and features are checked during setup.
Canvas Nodecard Pattern | Agent Skills Atlas