Louis Young 19ff04abc7
feat(free-demo): support create nodes group (#185)
* feat(demo): create group tool

* feat(demo): create group shortcut

* refactor(core): split group service, controller, utils files

* feat(history): free history add group operations

* feat(demo): group node render

* feat(demo): group node registry

* refactor(stack): remove layer computing config

* feat(stack): line stackIndex cannot be recalculated by default

* feat(demo): group title & color palette acess form

* feat(demo): ungroup button & shortcut

* feat(demo): create group & ungroup operation register to free history service

* refactor(group): group shortcuts move to group-plugin

* refactor(group): group node render move to group-plugin

* fix(group): undo/redo of create node or ungroup not work

* perf(history): free history remove async operation

* feat(group): trigger select box inside group

* fix(group): container inside group

* fix(group): auto layout should not be affected by group node

* feat(container): support multi-layer nested containers

* fix(group): group css variables overwrite each other

* fix(container): node move in or out group shouldn't clear lines

* feat(demo): node should follow mouse after move out container button clicked

* feat(container): disable group move to non-group container node

* fix(container): cross-level node moving causing coord offset

* feat(demo): comment node support more button

* fix(demo): comment in container fromJSON

* feat(container): node into container show move out tips

* feat(group): node into group show move out tips

* feat(group): delete group when blocks is empty

* refactor(group): createFreeGroupPlugin move to container-plugin

* refactor(demo): replace disablePorts with defaultPorts

* fix(demo): react warning

* refactor(group): group plugin built-in GroupNodeRegistry

* refactor(group): create free-group-plugin

* fix(ci): lock & ts-check & test errors
2025-05-07 13:21:34 +00:00
2025-02-21 16:26:12 +08:00
2025-03-20 09:32:52 +00:00
2025-02-27 18:12:04 +08:00
2025-02-27 17:31:02 +08:00
2025-02-21 16:26:12 +08:00

FlowGram.AI

FlowGram is a node-based flow building engine that helps developers quickly create workflows in either fixed layout or free connection layout modes. It provides a set of interaction best practices and is particularly suitable for visual workflows with clear inputs and outputs.

In the current AI boom, we are also focusing on how to empower workflows with AI capabilities, hence the AI suffix in our name.

License @flowgram.ai/editor

📖 Documentation

📦 Packages

Package Description Version
@flowgram.ai/create-app App Creator npm
@flowgram.ai/fixed-layout-editor Fixed Layout Editor npm
@flowgram.ai/free-layout-editor Free Layout Editor npm

🎮 Examples

Fixed Layout

Fixed layout where nodes can be dragged to specified positions, with support for compound nodes like branches and loops.

Free Layout

Free layout where nodes can be placed anywhere and connected using free-form lines.

🚀 Getting Started

# create demo
npx @flowgram.ai/create-app@latest

# in PowerShell
npx "@flowgram.ai/create-app@latest"

# select demo
- fixed-layout # full-feature overview
- free-layout # full-feature overview
- fixed-layout-simple # basic usage
- free-layout-simple # basic usage

🔨 Development

  1. Install Node.js 18+
nvm install lts/hydrogen
nvm alias default lts/hydrogen # set default node version
nvm use lts/hydrogen
  1. Clone the repository
git clone git@github.com:bytedance/flowgram.ai.git
  1. Install required global dependencies
npm i -g pnpm@9.12.0 @microsoft/rush@5.140.0
  1. Install project dependencies
rush update
  1. Build the project
rush build
  1. Run docs or demo
rush dev:docs # docs
rush dev:demo-fixed-layout
rush dev:demo-free-layout

After that, you can start to develop projects inside this repository.

Enjoy it!

Stats

Repo Stats

🌟 Contributors

FlowGram.AI Contributors

Description
FlowGram是一个基于节点的流程构建引擎,帮助开发者快速创建固定布局或自由连接布局的 workflows。
Readme MIT 77 MiB
Languages
TypeScript 79.9%
MDX 10.9%
JSON-with-Comments 5.3%
JavaScript 2.7%
CSS 0.8%
Other 0.2%