@burdenoff/fluidgrids-fe-sdk

中文文档
2026.1108.5发布于 2026/11/08ProprietaryTypeScriptES Module近 30 天下载 2.8万

FluidGrids工作流Builder SDK -可嵌入可视化工作流自动化

中文使用文档
文档目录23 节
  1. 循环兼容性
  2. 安装
  3. 快速启动
  4. 独立的工作流程构建器
  5. 全工作流程模块
  6. 核心构建器( BYO 阿波罗客户端)
  7. 映射输入数据
  8. 可选布尔输入
  9. API 参考
  10. 工作流程构建道具
  11. 流体GridsRoot 道具
  12. JSON 边缘绘图
  13. 助理页面控制(可选)
  14. 只读工作流程预览( 可选)
  15. 样式
  16. 嵌入:主题、符号更新和事件(BOFF-9961)
  17. 标记
  18. 结构化节点参数
  19. 安全说明
  20. 环线
  21. 发展
  22. 许可证
  23. 阿波罗4号宣言迁移(BOFF-9420)

@ buffleoff/ fluidgrids- fe- sdk

使用若干证书适配器的操作会为每个设备制作一个单独的连接拾取器 适配器角色. 选择、替换、创建或删除一个角色的连接保留 其他作用 args.connections,包括两个角色共用一个提供者或账户. 选择加入的消费者 multiple 可以在不丢弃的情况下选择每个角色的多个账户 ; 建设者的违约情况仍然是每个角色一个账户. 提供者匹配使用已声明的提供者密钥(或遗留适配器身份),而不是子字符串 或类别匹配。 建造者并不认为每个已宣布的适配器都是强制性的: 一些操作宣布替代后端. 认证和连接创建仍然存在 共享 @burdenoff/fe-libs/connections 每种支持方法的对话框 .

明确选择的操作对每个节点卡和被保存的工作流程具有权威性 状态。 遗留的图形位置默认只初始化了没有操作的节点; 移动 或连接已配置的节点不会改变其操作。 专用财产面板 声明它们支持哪些行动;其他行动使用其显示驱动的形式.

FluidGrids Workflow Builder SDK - 为React应用程序嵌入可视化工作流程自动化.

循环兼容性

循环重置接受布尔或布尔表达式 。 已安装新节点 更新登记册持续存在 batchSize: 1 财务报告和审定财务报表 reset: false; 保存显性值 并且遗留的定义省略了批量大小,保持了现有的行为(10). 共享参数编辑器区分缺失的返回路径和可能路径 有条件退出而不拒绝有意退出. 重置清除当前 批量/结果,但不包括安全预算。 现有的输出信封不变. BOFF-7415的循环授权/连续固定对于一般循环体是必要的; 2; 这些重置控制不能取代该修正。 未提供项目级别分系.

安装

npm install @burdenoff/fluidgrids-fe-sdk
# or
bun add @burdenoff/fluidgrids-fe-sdk

快速启动

独立的工作流程构建器

使用 WorkflowBuilder 当你需要一个自成一体的工作流程构建器,并拥有自己的阿波罗客户端时:

import { WorkflowBuilder } from '@burdenoff/fluidgrids-fe-sdk';
import '@burdenoff/fluidgrids-fe-sdk/styles.css';

function App() {
  return (
    <WorkflowBuilder
      apiGatewayUrl={process.env.NEXT_PUBLIC_FLUIDGRIDS_API_URL!}
      authToken="your-auth-token"
      workspaceId="your-workspace-id"
      onSave={(workflow) => {
        console.log('Workflow saved:', workflow);
      }}
      onExecute={(runId) => {
        console.log('Execution started:', runId);
      }}
    />
  );
}

全工作流程模块

使用 FluidGridsRoot 用于完整的工作流程管理,包括列表、构建器、运行和证书:

import { FluidGridsRoot } from '@burdenoff/fluidgrids-fe-sdk';
import '@burdenoff/fluidgrids-fe-sdk/styles.css';
import { useNavigate } from 'react-router-dom';

function App() {
  const navigate = useNavigate();

  return (
    <FluidGridsRoot
      basePath="/workflows"
      apiGatewayUrl={process.env.NEXT_PUBLIC_FLUIDGRIDS_API_URL!}
      authToken="your-auth-token"
      workspaceId="your-workspace-id"
      navigate={(path) => navigate(path)}
      onWorkflowSave={(workflow) => {
        console.log('Workflow saved:', workflow);
      }}
    />
  );
}

核心构建器( BYO 阿波罗客户端)

使用 WorkflowBuilderCore 当你想要提供自己的阿波罗客户端时:

import { WorkflowBuilderCore, FluidGridsProvider } from '@burdenoff/fluidgrids-fe-sdk';
import { ApolloProvider } from '@apollo/client';
import { yourApolloClient } from './apollo';

function App() {
  return (
    <FluidGridsProvider
      apiGatewayUrl={process.env.NEXT_PUBLIC_FLUIDGRIDS_API_URL!}
      authToken="your-auth-token"
      workspaceId="your-workspace-id"
      trustedOrigins={[window.location.origin]}
      apolloClient={yourApolloClient}
    >
      <WorkflowBuilderCore
        workflow={yourWorkflowData}
        onSave={(workflow) => console.log('Saved:', workflow)}
      />
    </FluidGridsProvider>
  );
}

映射输入数据

节点细节视图和快速配置映射器使用选定的上游节点 从已装入的运行输出, 返回到未装入时的已声明输出计划 可提供产出。 存储/GraphQL 操作名包装器仍然是绘图的一部分 路径; internal:* 产出保持不变。 切换来源也切换数据 由映射器使用。 节点细节视图保留目标后映射值 下级 已执行参数( 只读)这些价值不是上游路径.

已宣布字段为 oneOf 或者说 anyOf 将每个支持的形状显示为可扩展 分支,包括嵌入对象和阵列项目。 形状标签只显示 : 拖曳一个孩子保留其实际操作被包装的路径, 没有可变标签 插入到表达式中。 一旦运行输出,树反映 实际值。 这是计划可视化,而不是JSON Schema验证; 目录字段更新仍需发布并重新安装节点.

可选布尔输入

两个财产小组提供 未设置 除了可选的布尔复选框. 选择它从节点的固定状态中去除这个字段;操作的 然后适用已存在的省略输入行为。 检查或取消检查 明确存储 true 或者说 false。渲染、打开和保存不重置 已存在的值或默认值。 和其他固定编辑一样,取消设置 也澄清了字段的沉积入地图,而不改变其他字段' 测绘. 需要的布尔、表达式控制和动态选项控制 保持他们现有的行为。 键盘焦点在未设置后仍保留在动作上.

API 参考

工作流程构建道具

Prop类型需求说明
apiGatewayUrlstring对工作空间 API 网关 URL
authTokenstring没有认证符
workspaceIdstring对当前工作空间ID
tenantIdstring没有目前租户身份证
workflowIdstring没有要装入的工作流程 ID
workflowVersionstring没有要装入的工作流程版本
initialWorkflowWorkflowData没有初始工作流程数据
readonlyboolean没有禁用编辑
hideHeaderboolean没有隐藏页眉工具栏
hideSidebarboolean没有隐藏侧边栏
hideLogsPanelboolean没有隐藏日志面板
onSave(workflow) => void没有保存回调
onExecute(runId) => void没有执行召回
onNodeClick(node) => void没有节点点击回调
onBack() => void没有后键回调
classNamestring没有自定义 CSS 类

流体GridsRoot 道具

Prop类型需求说明
basePathstring没有路由的基础路径
apiGatewayUrlstring对工作空间 API 网关 URL
authTokenstring没有认证符
workspaceIdstring对当前工作空间ID
tenantIdstring没有目前租户身份证
currentUserUser没有当前用户信息
navigate(path) => void没有导航函数
readonlyboolean没有全局只读模式
onWorkflowSave(workflow) => void没有保存回调
onWorkflowExecute(runId, workflowId) => void没有执行召回
classNamestring没有自定义 CSS 类

JSON 边缘绘图

即将到来的边缘绘图支持JSON值,包括嵌入式阵列/对象和 字义 false, (中文(简体) ), 0,以及 null。快速配置和节点详细视图保存 这些类型和嵌入式表达式。 字符串映射保留表达式编辑器 . 用于 JSON 映射 应用映射 在保存工作流程之前; 重设 放弃草稿。 无效或未应用的草稿不会取代已保存的映射 . 切换到固定模式会从所有接入的边缘中移除该字段的映射.

助理页面控制(可选)

运行AI助手的主机可以让人们说"显示失败运行"或"搜索" 开具发票的工作流程",并让页面自己做点什么 控制确实如此。 SDK会的 没有 导入任何 fe-libs 助手代码( 无新代码) fe-libs版本地层:主机挂起一个小桥并映射页面 描述到自己的助手.

import { FluidGridsAssistantBridge, type FgPageControlsSpec } from "@burdenoff/fluidgrids-fe-sdk/assistant";

// Stable identity (module constant or useCallback). Map the spec onto your
// assistant; return the function that removes exactly this registration.
const register = (spec: FgPageControlsSpec) => registerWithMyAssistant(spec);

<FluidGridsAssistantBridge register={register}>
  <FluidGridsRoot ... />
</FluidGridsAssistantBridge>
  • 从 /assistant 子路径: 这是一个很小的条目,所以一个主机的主 捆绑不会为上下文提供者调取整个 SDK 。 页面共享 它的块(每个应用程序一通桥).
  • 没有 FluidGridsAssistantBridge 上面,什么都没有发生 和网页工作 和以前一样.
  • 描述其控件的页: 工作流程列表(搜索, 当更多时状态) 存在一个状态,标签),执行(搜索,状态,工作流程), 模板(来自 Store/我的模板标签、搜索、我的模板上的类别), 历史 (搜索, 工作流). 一个页面只记录它现在显示的 取出后取出无相.
  • 光谱只包含标签、单选择过滤器和搜索设置器,每个 setter是页面自己的状态设置. 没有创建,保存,删除,运行, 重试、复制或批准.
  • FgEnumFilterSpec 编号 : FgTabsSpec 结构是 fe-libs EnumFilterSpec 编号 : TabsSpec (fe-libs >= 2026.1004.6) (中文(简体) ) appControls),所以一个宿主可以通过它们 直达 enumFilter 编号 : tabsOf。 。 。 .

只读工作流程预览( 可选)

WorkflowPreviewCanvas 用构建者自己绘制存储的工作流程定义 节点卡片,只读取,动画作为工作流程构建为活性(AI) 助理的现场预览). 它需要没有 FluidGridsProvider, 配置, 阿波罗客户端 或节点登记,不提出自己的要求.

import { WorkflowPreviewCanvas, previewCanvasFromDefinition, previewRevealOrder } from "@burdenoff/fluidgrids-fe-sdk/workflow-preview";

<div style={{ height: 520 }}>
  <WorkflowPreviewCanvas
    definition={workflow.definitionJson} // object or JSON string
    visibleNodeIds={shown}               // omit to show every node
    freshNodeIds={justAdded}             // highlighted with a ring
    running={assistantIsWriting}         // flow along edges, newest node pulses
  />
</div>
  • 主办方推动披露: previewRevealOrder(previewCanvasFromDefinition(def).nodes) 给出串流顺序。 一个节点,变成可见的弹出,一个边缘 一旦两端都可见,镜头就容易保持每端 视图中的可见节点(最大缩放1.5).
  • resolveNodeMeta(nodeType) (可选,保持稳定) 供应登记名称 和图标;没有它,卡片会使用节点保存的列表,然后名称和 图标来源于其类型.
  • 边缘遵循构建者的规则:其源或目标处理 该节点的构建者卡没有(从节点存储的数据读取, 由于构建者读取它)没有被绘制,所以预览从不显示 连接构建者滴入.
  • 节点不能被拖曳,连接,选择或删除;平板和缩放工作.
  • prefers-reduced-motion: reduce 关掉所有动画.

样式

SDK使用"Tailwind CSS"来进行造型. 确保您在工程中配置了 Tailwind, 或者导入预建的样式 :

import '@burdenoff/fluidgrids-fe-sdk/styles.css';

嵌入:主题、符号更新和事件(BOFF-9961)

FluidGridsProvider, (中文(简体) ), FluidGridsRoot 财务报告和审定财务报表 WorkflowBuilder 3个 嵌入道具( 也可以设置为 setFluidGridsConfig:

<FluidGridsProvider
  workspaceId={workspaceId}
  apiGatewayUrl={workspaceGraphqlUrl}
  authToken={token}
  theme={{ mode: 'light', colors: { primary: '#2563eb' }, radius: { base: '10px' } }}
  auth={{ onTokenExpired: () => session.refresh() }}
  onEvent={(name, payload) => {
    if (name === 'run:completed') console.log(payload.runId, payload.status);
  }}
>
  {children}
</FluidGridsProvider>
  • theme —— 说 "light", (中文(简体) ), "dark" 或者说 { mode?, colors?, radius?, font? }。 。 。 . 每个符号映射到fe-libs语义CSS变量(FLUIDGRIDS_THEME_TOKEN_MAP(三); 数值被验证( e)themeToCssVariables)并在整个文档中应用为: 内嵌属性于 <html>,在卸载上恢复(applyFluidGridsTheme, (中文(简体) ), useFluidGridsTheme) (中文(简体) ). 公众嵌入式浏览器也读到 accent, (中文(简体) ), radius 财务报告和审定财务报表 font 查询参数旁边 theme; 其单 radius 套装 radius.base, (中文(简体) ), radius.card, (中文(简体) ), radius.button 财务报告和审定财务报表 radius.input (建设节点) 跟着牌 --radius-card) (中文(简体) ).
  • auth.onTokenExpired ——每次过期会话故障一次(401次), UNAUTHENTICATED,过期/撤销证书);同时发生的故障共用一个 调用; 请求用新符号重审一次; 拒绝 SDK 发射 auth:failed 并显示原始错误。 一个失败的刷新是 报告一次 : 已在执行中的请求已过期 它们在没有第二次呼叫或事件的情况下自己出错; 请求在 失败可能再次刷新 。 主机注入阿波罗 客户端添加 createFluidGridsTokenRefreshLink() 在他们的认证链接之前.
  • onEvent — 已输入 FluidGridsEventMap数字 : workflow:saved, (中文(简体) ), workflow:activated, (中文(简体) ), run:started, (中文(简体) ), run:completed, (中文(简体) ), node:selected, (中文(简体) ), error, (中文(简体) ), auth:failed合同版本 FLUIDGRIDS_EVENTS_VERSION (样本: 添加剂=小,有效载荷断裂=主要。 独立 WorkflowBuilder 编号 : WorkflowBuilderCore 画布保存和本地运行( n)onSave 编号 : onExecute, (中文(简体) ), 所以它只发出 node:selected。 。 。 .
  • FluidGridsRoot, (中文(简体) ), WorkflowBuilder 财务报告和审定财务报表 WorkflowBuilderCore 无工作 东道主 ThemeProvider;它们重复宿主的当有一个.

全向导 : 文件:fluidgrids.ai/开发者/嵌入。 。 。 .

标记

SDK的每个工作流程 WorkflowBuilder, (中文(简体) ), WorkflowBuilderCore, (中文(简体) ), 页:1 FluidGridsRoot 构建者和模板审查路线以及公众 WorkflowEmbedPage 查看器 — 显示一个小 由流水鬼提供动力 标记 右上角,链接到 流线网.ai编辑 以上铬道具(hideHeader, (中文(简体) ), hideSidebar, (中文(简体) ), hideLogsPanel, (中文(简体) ), readonly(中文(简体) ) 只隐藏工具栏和面板.

FluidGrids不作为白标签产品提供:没有道具,上下文,主题 选项或 URL 参数隐藏或替换标记。 嵌入式取景器已经老了 badge=false 参数被忽略。 翻译可以重写"Powered by" 语句,但流体Grids名称总是保留.

结构化节点参数

快速配置和全节点编辑器使用所选操作的 input_fields 数组和对象值的计划。 输入数组和对象为 JSON; 字符串数组 还接受逗号分隔的值。 空白输入清除字段,同时 [] 财务报告和审定财务报表 {} 仍然是明确的空值。 申报的项目/财产类型审定.

已启用节点上无效的草稿保持可见, 无法保存或 执行。 已禁用节点保存草稿; 重新启用还原 审定。 保存 还使遗留的JSON字符串与使用同一种图案的适应性卡表正常化. 表达式映射仍与固定值相分离:切换字段为 如全值模板的表达模式 {{ $vars.LIST }} 或者说 ${output.items}。固定 JSON 字符串项目仍为文字;存储节点运行时间 一般不评价固定模板 args.state 数值. 之前保存工作流程 执行以运行更新的配置;这不会改变现有的配置 保存版本执行行为或操作名输出包. 空出字段仍未被设置,因此引擎可以提供上游输入或默认.

安全说明

  • 代码的中转 @graphql-tools/utils 被钉入 12.0.3 页:1 (一) GHSA-7mx3-vvmw-hjmv; source-map-js 被钉入 1.2.2 页:1 GHSA-68fv-2mgg-jv7q. (原始内容存档于2019-10-12). 使用器覆盖了旧插件范围, 因为 即使是目前的阿波罗钩插件也保留了受影响的帮助者依赖性. 保留现有的编码合同测试,并比较所有四个生成的文件 更改此指针时; 不使用其 GraphQL 17 执行帮助更改 由此寄存器的 GraphQL 16 代码路径. 使用干净的冷冻锁文件安装验证: 增量 Bun 安装可以 留下旧的嵌入式复制件 node_modules 超过更改分辨率后.
  • 通过环境变量通过运行时间URL,而不是硬码本地主机默认.
  • 使用 trustedOrigins 当将 SDK 嵌入已知的主机应用程序时.
  • 避免伐木或持续伐木 authToken 应用远程测量或错误报告中的值.

环线

连接循环 循环正文 输出到正文节点,然后将上个正文节点连接回环形输入. 连接 完成 接下来的一步 Canvas 拖动并点击到连接接受这个控制循环,不管哪个边是最后一个;普通循环和通过 Done 的循环仍然是拒绝的. SDK 强制连接,导入和复制/粘贴保存同一图.

回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回回 校验器使用工作流程条目和Done路径来区分控制器的正文,并拒绝将绕过已接线控制器的外部连接.

循环体分类遵循配置 loopHandle 优先执行: data, (中文(简体) ), config, (中文(简体) ), data.args.state,则 args.state自定义和互换的控件名称保留了可控返回的验证,并防止损坏一个活动控制器,包括保存/输入的图表。 默认保留 loop; 配置匹配输出元数据和边缘手柄。 这不会给任意导入的图表添加新的验证或更改运行时间执行.

控制器控制循环时不能禁用:先断开循环. 共享切换动作返回 false 不更改图表或取消历史,节点工具栏解释原因。 机身节点切换和取消允许的更改仍然可用。 这不会修复已经无效的导入图表 .

当搭配的 BOFF-7415 工人变更部署时,机体节点可以取代其输出: 续作是在执行上下文中运输的,而不是商业领域. 没有回放边的工作流程不要求再批次. BOFF-9042和BOFF-9041分别跟踪了重置/默认等同和多接地绘图.

发展

  • bun run sanity: 代码、 线条、 格式、 类型检查、 包件套件、 库建设, npm 沥青球检查( )scripts/verify-package-contents.sh和 故事书建设.
  • bun run storybook 编号 : bun run build-storybook给建设者画布的故事, 节点卡、工作流程列表卡和运行列表src/stories/固定线 数据,无后端). 故事从不包罗万象.
  • bun run test:e2e: 只读列表、 构建者和运行的 Playwright 规格 页面通过流体网-应用外壳,对接α(Cloudflare Access)或 pro. 见 e2e/README.md。 。 。 .
  • bun run schema:pull 刷新点 graphql/{wspace,global}.graphql 从 图QL 蜂巢CDN; bun run schema:check 不写漂移检查。 网关 从未被回顾(参见 docs/owned-codegen.md) (中文(简体) ).

许可证

专有-版权Algoshred Technologies Pvt有限公司.

阿波罗4号宣言迁移(BOFF-9420)

BOFF-9420迁移保留了命名的操作/挂起表面 并使用所支持的打字文档修正包装的公开声明 拥有阿波罗4号外观. 需要查询变量, 跳过悬念结果, 懒惰 执行选项和配置的变异变量现在跟随实际的阿波罗 4份合同,要求阿波罗客户端 4.2.0 或更新在主 4. 这个 明确类型迁移,而非透明相容性 对无效的早期签名提出索赔; 现有已公布的版本保持不变.

见 移民合同 更正表和核查限额。 软件包的可用性取决于 并核实了释放证据。 收养和居住 工作流程接受需要单独核查.

版本与发布记录

@burdenoff/fluidgrids-fe-sdk 共发布 283 个版本,首次发布于 2026/05/11;过去 12 个月发布了 283 个版本。

版本发布日期距今
2026.1108.5latest2026/11/08今天
2026.1108.42026/11/08今天
2026.1108.32026/11/08今天
2026.1108.22026/11/08今天
2026.1108.12026/11/08今天
2026.1107.12026/11/071 天前

关于 @burdenoff/fluidgrids-fe-sdk 的常见问题

@burdenoff/fluidgrids-fe-sdk 是什么?

FluidGrids工作流Builder SDK -可嵌入可视化工作流自动化

如何安装 @burdenoff/fluidgrids-fe-sdk?

在项目目录运行 npm install @burdenoff/fluidgrids-fe-sdk,或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖:react(^18.0.0 || ^19.0.0)、react-dom(^18.0.0 || ^19.0.0)。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖,Yarn 需要手动安装。

@burdenoff/fluidgrids-fe-sdk 支持 TypeScript 吗?

支持。包内自带 TypeScript 类型声明(package.json 声明了 types 入口),安装后即可获得类型提示,无需再安装 @types 包。

@burdenoff/fluidgrids-fe-sdk 支持 ESM 还是 CommonJS?

以 ES Module 形式发布,推荐使用 import 引入。在 CommonJS 项目中,Node.js 20.19+ / 22.12+ 可以直接 require() 不含顶层 await 的 ES Module,更早的版本需要改用动态 import()。

@burdenoff/fluidgrids-fe-sdk 可以商用吗?

@burdenoff/fluidgrids-fe-sdk 使用 Proprietary 许可。声明的许可为 Proprietary,请阅读许可原文确认使用条件。以上为概括,不构成法律意见,请以许可原文为准。

@burdenoff/fluidgrids-fe-sdk 的下载量有多少?

根据 npm 官方下载统计,@burdenoff/fluidgrids-fe-sdk 在 2026/10/09 – 2026/11/07 这 30 天内被下载 27,999 次,日均约 933 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入,适合横向比较热度,不能直接等同于使用人数。

@burdenoff/fluidgrids-fe-sdk 还在维护吗?

最新版本 2026.1108.5 发布于 2026/11/08(今天);至今共发布 283 个版本,其中过去 12 个月发布了 283 个;首次发布于 2026/05/11。发布频率只是参考信号:功能稳定的工具可能很少需要更新,建议结合源码仓库的 issue 和提交记录判断。