工作流编辑器

🌐 Workflow Editor

工作流编辑器模板是一个基于 Next.js 的应用，旨在帮助你快速创建、管理和可视化工作流。它使用 React Flow UI 构建，并采用 Tailwind CSS 和 shadcn/ui 进行样式设计，该项目为构建和扩展工作流编辑器提供了高度可定制的基础。

🌐 The Workflow Editor template is a Next.js-based application designed to help you quickly create, manage, and visualize workflows. Built with React Flow UI and styled using Tailwind CSS and shadcn/ui , this project provides a highly customizable foundation for building and extending workflow editors.

This is a Pro template. Get all pro examples, templates, 1:1 support from the xyflow team and prioritized Github issues with a React Flow Pro subscription.

See Pricing Plans Sign In

技术堆栈

🌐 Tech Stack

React Flow UI：该项目使用 React Flow UI 来构建节点。这些组件旨在帮助你快速熟悉项目。
shadcn CLI：该项目使用 shadcn CLI 来管理 UI 组件。该工具基于 Tailwind CSS 和 shadcn/ui 组件构建，使添加和自定义 UI 元素变得容易。
使用 Zustand 进行状态管理：该应用使用 Zustand 进行状态管理，提供了一种管理节点、边及其他工作流相关数据状态的简单高效的方式。

功能

🌐 Features

自动布局：使用 ELKjs 布局引擎自动排列节点和连线。
拖放侧边栏：使用拖放机制添加和排列节点。
可自定义组件：使用 React Flow UI 和 shadcn 库来创建高度可自定义的节点和边。
暗黑模式：在亮色和暗色主题之间切换，通过 Zustand 存储管理。
运行器功能：使用工作流运行器按顺序执行和监控节点。