{"repo":"framara/react-flow-skill","free":true,"listed":false,"github":"https://github.com/framara/react-flow-skill","clone":"git clone https://github.com/framara/react-flow-skill.git","description":"Claude Code skill for building interactive node-based UIs with React Flow (@xyflow/react v12+)","language":null,"stars":45,"topics":["claude-code","interactive","node-graph","react","react-flow","skill"],"license":"MIT","category":"mcp-servers","readme_excerpt":"react-flow-skill A Claude Code skill for building interactive node-based UIs with React Flow ( @xyflow/react v12+). What's included The skill provides expert guidance across 14 reference topics: - Migration - Upgrading from reactflow / react-flow-renderer to @xyflow/react v12 - Fundamentals - Installation, setup, first flow, node/edge objects - Custom Nodes - Custom node components, Handle, multiple handles, drag handles - Custom Edges - Custom edge components, path utilities, edge labels, markers - Interactivity - Event handlers, callbacks, connection validation, selection, keyboard - State Management - Controlled vs uncontrolled, Zustand integration, state update patterns - TypeScript - Node/Edge types, generics, union types, type guards - Layouting - External layout libraries (dagre, elkjs, d3), sub-flows, parent-child - Components & Hooks - Background, Controls, MiniMap, Panel, NodeToolbar, NodeResizer, hooks - Performance & Styling - Memoization, render optimization, theming, CSS variables, Tailwind - Troubleshooting - Common errors, debugging, edge display issues, Zustand warnings - E2E Testing - Playwright setup, React Flow selectors, node/edge/viewport/connection test patterns - Advanced Patterns - Undo/redo, copy/paste, computed flows, dynamic handles, save/restore, collaboration - Common Recipes - Context menu node creation, drag-and-drop sidebar, detail panels, export as image It also includes a 12-rule agent behavior contract covering the most critical React Flow ","default_branch":null,"files":null,"tree":[],"storefront":"/r/framara","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/framara/react-flow-skill/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}