Synaptic SkillsSynapticSkills
MarketplaceSkill GraphCriar SkillMCP ServerPlataformaEnterprise
v0.1.0-beta
Voltar ao Marketplace
DevelopmentMédio

React Flow

porframara·framara· v1.0.0 · atualizado em 2026-04-11
82
Score

Expert guidance for React Flow (@xyflow/react): building interactive node-based graphs, custom nodes and edges, handles, state management, layouting, TypeScript patterns, performance optimization, and theming. Use when writing React Flow code, creating custom nodes or edges, debugging flow issues, optimizing graph performance, integrating with Zustand, or building canvas-based UIs with React Flow.

reactreact-flownode-based-uigraph-editortypescriptui-development
Linguagens
TypeScriptJavaScript
0Stars
0Forks
0Usos
Fork

Documento do Skill

SKILL.mdreact-flow/workflow
Clarify the goal: new flow, custom nodes/edges, state, layout, performance, styling, or debugging.
Collect minimal facts: React Flow version, TypeScript/JavaScript, state management, node count, styling.
Identify the problem: blank canvas, missing edges, re-renders, connection issues, layout problems, type errors.
Consult the routing map to find the relevant documentation section.
Recommend specific code implementations or configuration changes.
Verify the implementation using the checklist.

Telemetria de Agentes

Execuções
0
total
Taxa de Sucesso
0%
últimos 30d
Latência Média
0.0s
p50
Alucinação
0.0%
detecção
Tokens Entrada
0
avg 0/exec
Tokens Saída
0
avg 0/exec

Uso por Plataforma

Skills Relacionados

Similar aTauri v2 JavaScript Frontend Integration
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
82
Similar a ←Tone.js Skill
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
80
Similar a ←Base UI React
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
80
Similar a ←Tailwind UI Patterns
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
79
Similar a ←Vuejs Core Vue
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
79
Similar a ←Anime.js v4 Skill
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
80
Similar a ←Electron 33+ Desktop Development
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
81
Similar a ←Pinia State Management
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
80
Similar a ←Spline 3D Integration
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
80

Árvore do Skill

React Flow
react-flow
Fases Cognitivas6
1.SENSE
2.CONTEXTUALIZE
3.HYPOTHESIZE
4.RECOMMEND
5.ACT
6.REFLECT
Triggers7
build a react flow diagramcreate a custom node in react flowdebug a react flow applicationoptimize react flow performanceintegrate react flow with zustandcreate a node-based editor with react flowimplement custom edges in react flow

Avaliar este Skill

Score Breakdown

⭐Avaliação Humana0%
🤖Sucesso de Agentes0%
🕐Atualidade100%
🔗Saúde de Dependências100%
🕸️Centralidade no Grafo0%
🛡️Segurança50%
CompositeScore = α·Humano + β·Agente + γ·Recência + δ·Deps + ε·Centralidade + ζ·Segurança

Instalação

$ synaptic mcp download react-flow
$ synaptic skills detail react-flow
$ synaptic skills live react-flow

Dependências

@xyflow/reactzustand

Links

GitHub Repository