Community影像github.com

existential-birds/react-flow

用於工作流程可視化的 React Flow (@xyflow/react),支援自訂節點與邊緣。在建立圖形可視化、建立自訂工作流程節點、實作邊緣標籤或控制視口時使用。觸發詞為 ReactFlow、@xyflow/react、Handle、NodeProps、EdgeProps、useReactFlow、fitView。

react-flow 是什麼?

這個 AI 代理技能基於 React Flow(@xyflow/react)函式庫,用於在開發者工具或 AI 編碼環境中建立工作流程可視化。它允許使用者定義自訂節點和邊緣,實現圖形化的使用者介面,適合建置流程圖、網路圖、或節點編輯器。此技能支援處理節點屬性(NodeProps)、邊緣屬性(EdgeProps)、連接點(Handle),並提供視口控制(useReactFlow、fitView)等功能。主要應用於需要視覺化工作流程或圖形互動的場景,並可與 React 應用程式無縫整合,提升開發效率。

相容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/existential-birds/beagle/tree/main/skills/react-flow

Installed? Explore more 影像 skills: steipete/songsee, affaan-m/frontend-design, mattpocock/improve-codebase-architecture · View all 6 →

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

react-flow 是做什麼的?

React Flow (@xyflow/react) 用於工作流程可視化,支援自訂節點與邊緣。在建立圖形可視化、建立自訂工作流程節點、實作邊緣標籤或控制視口時使用。觸發詞為 ReactFlow、@xyflow/react、Handle、NodeProps、EdgeProps、useReactFlow、fitView。

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

相關技能