@nocobase/flow-engine 2.0.0-alpha.2

package/lib/components/settings/wrappers/contextual/StepSettingsDialog.js

@@ -0,0 +1,206 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var StepSettingsDialog_exports = {};
+__export(StepSettingsDialog_exports, {
+  openStepSettingsDialog: () => openStepSettingsDialog
+});
+module.exports = __toCommonJS(StepSettingsDialog_exports);
+var import_core = require("@formily/core");
+var import_react = require("@formily/react");
+var import_reactive = require("@formily/reactive");
+var import_antd = require("antd");
+var import_react2 = __toESM(require("react"));
+var import_useFlowSettingsContext = require("../../../../hooks/useFlowSettingsContext");
+var import_utils = require("../../../../utils");
+const SchemaField = (0, import_react.createSchemaField)();
+const openStepSettingsDialog = /* @__PURE__ */ __name(async ({
+  model,
+  flowKey,
+  stepKey,
+  dialogWidth = 600,
+  dialogTitle,
+  mode = "dialog",
+  ctx,
+  uiModeProps,
+  cleanup
+}) => {
+  var _a, _b, _c, _d;
+  const t = (0, import_utils.getT)(model);
+  const message = model.context.message;
+  if (!model) {
+    message.error(t("Invalid model provided"));
+    throw new Error(t("Invalid model provided"));
+  }
+  const flow = model.getFlow(flowKey);
+  const step = (_a = flow == null ? void 0 : flow.steps) == null ? void 0 : _a[stepKey];
+  if (!flow) {
+    message.error(t("Flow with key {{flowKey}} not found", { flowKey }));
+    throw new Error(t("Flow with key {{flowKey}} not found", { flowKey }));
+  }
+  if (!step) {
+    message.error(t("Step with key {{stepKey}} not found", { stepKey }));
+    throw new Error(t("Step with key {{stepKey}} not found", { stepKey }));
+  }
+  let title = step.title;
+  let beforeParamsSave = step.beforeParamsSave;
+  let afterParamsSave = step.afterParamsSave;
+  let actionDefaultParams = {};
+  if (step.use) {
+    const action = (_c = (_b = model.flowEngine) == null ? void 0 : _b.getAction) == null ? void 0 : _c.call(_b, step.use);
+    if (action) {
+      actionDefaultParams = action.defaultParams || {};
+      title = title || action.title;
+      beforeParamsSave = beforeParamsSave || action.beforeParamsSave;
+      afterParamsSave = afterParamsSave || action.afterParamsSave;
+    }
+  }
+  const flowDefinition = model.getFlow(flowKey);
+  const mergedUiSchema = await (0, import_utils.resolveStepUiSchema)(model, flowDefinition, step);
+  if (!mergedUiSchema) {
+    message.info(t("This step has no configurable parameters"));
+    return {};
+  }
+  const flowRuntimeContext = ctx;
+  if (!flowRuntimeContext.currentStep || flowRuntimeContext.currentStep !== step) {
+    flowRuntimeContext.defineProperty("currentStep", { value: step });
+  }
+  const flowEngine = model.flowEngine;
+  const scopes = {
+    useFlowSettingsContext: import_useFlowSettingsContext.useFlowSettingsContext,
+    ...(_d = flowEngine.flowSettings) == null ? void 0 : _d.scopes
+  };
+  const stepParams = model.getStepParams(flowKey, stepKey) || {};
+  const resolvedDefaultParams = await (0, import_utils.resolveDefaultParams)(step.defaultParams, flowRuntimeContext);
+  const resolveActionDefaultParams = await (0, import_utils.resolveDefaultParams)(actionDefaultParams, flowRuntimeContext);
+  const initialValues = { ...(0, import_reactive.toJS)(resolveActionDefaultParams), ...(0, import_reactive.toJS)(resolvedDefaultParams), ...(0, import_reactive.toJS)(stepParams) };
+  const previousParams = { ...(0, import_reactive.toJS)(stepParams) };
+  const formSchema = {
+    type: "object",
+    properties: {
+      layout: {
+        type: "void",
+        "x-component": "FormLayout",
+        "x-component-props": {
+          layout: "vertical"
+          // 垂直布局
+        },
+        properties: mergedUiSchema
+      }
+    }
+  };
+  const openView = model.context.viewer[mode].bind(model.context.viewer);
+  const form = (0, import_core.createForm)({
+    initialValues: (0, import_utils.compileUiSchema)(scopes, initialValues)
+  });
+  openView({
+    title: dialogTitle || t(title),
+    width: dialogWidth,
+    destroyOnClose: true,
+    ...(0, import_reactive.toJS)(uiModeProps),
+    onClose: /* @__PURE__ */ __name(() => {
+      if (cleanup) {
+        cleanup();
+      }
+    }, "onClose"),
+    content: /* @__PURE__ */ __name((currentDialog) => {
+      const FlowStepSettings = (0, import_react.observer)(() => {
+        var _a2;
+        (0, import_react2.useEffect)(() => {
+          return (0, import_reactive.autorun)(() => {
+            const dynamicProps = (0, import_reactive.toJS)(uiModeProps);
+            currentDialog.update(dynamicProps);
+          });
+        }, []);
+        const compiledFormSchema = (0, import_utils.compileUiSchema)(scopes, formSchema);
+        return /* @__PURE__ */ import_react2.default.createElement(import_react.FormProvider, { form }, /* @__PURE__ */ import_react2.default.createElement(import_useFlowSettingsContext.FlowSettingsContextProvider, { value: flowRuntimeContext }, /* @__PURE__ */ import_react2.default.createElement(
+          SchemaField,
+          {
+            schema: compiledFormSchema,
+            components: {
+              ...(_a2 = flowEngine.flowSettings) == null ? void 0 : _a2.components
+            },
+            scope: scopes
+          }
+        ), /* @__PURE__ */ import_react2.default.createElement(currentDialog.Footer, null, /* @__PURE__ */ import_react2.default.createElement(import_antd.Space, { align: "end" }, /* @__PURE__ */ import_react2.default.createElement(
+          import_antd.Button,
+          {
+            type: "default",
+            onClick: () => {
+              currentDialog.close();
+            }
+          },
+          t("Cancel")
+        ), /* @__PURE__ */ import_react2.default.createElement(
+          import_antd.Button,
+          {
+            type: "primary",
+            onClick: async () => {
+              try {
+                await form.submit();
+                const currentValues = form.values;
+                model.setStepParams(flowKey, stepKey, currentValues);
+                if (beforeParamsSave) {
+                  await beforeParamsSave(flowRuntimeContext, currentValues, previousParams);
+                }
+                currentDialog.close();
+                await model.saveStepParams();
+                message.success(t("Configuration saved"));
+                if (afterParamsSave) {
+                  await afterParamsSave(flowRuntimeContext, currentValues, previousParams);
+                }
+              } catch (error) {
+                if (error instanceof import_utils.FlowExitException) {
+                  currentDialog.close();
+                  return;
+                }
+                console.error(t("Error saving configuration"), ":", error);
+                message.error(t("Error saving configuration, please check console"));
+              }
+            }
+          },
+          t("OK")
+        )))));
+      });
+      return /* @__PURE__ */ import_react2.default.createElement(FlowStepSettings, null);
+    }, "content")
+  });
+}, "openStepSettingsDialog");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  openStepSettingsDialog
+});

package/lib/components/settings/wrappers/contextual/StepSettingsDrawer.d.ts

@@ -0,0 +1,20 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+import { StepSettingsDrawerProps } from '../../../../types';
+/**
+ * StepSettingsDrawer组件 - 使用自定义 Drawer 显示单个步骤的配置界面
+ * @param props.model 模型实例
+ * @param props.flowKey 流程Key
+ * @param props.stepKey 步骤Key
+ * @param props.drawerWidth 抽屉宽度，默认为600
+ * @param props.drawerTitle 自定义抽屉标题，默认使用step的title
+ * @returns Promise<any> 返回表单提交的值
+ */
+declare const openStepSettingsDrawer: (options: StepSettingsDrawerProps) => Promise<any>;
+export { openStepSettingsDrawer };

package/lib/components/settings/wrappers/contextual/StepSettingsDrawer.js

@@ -0,0 +1,47 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var StepSettingsDrawer_exports = {};
+__export(StepSettingsDrawer_exports, {
+  openStepSettingsDrawer: () => openStepSettingsDrawer
+});
+module.exports = __toCommonJS(StepSettingsDrawer_exports);
+var import_StepSettingsDialog = require("./StepSettingsDialog");
+const openStepSettingsDrawer = /* @__PURE__ */ __name(async (options) => {
+  const { drawerWidth, drawerTitle, cleanup, ...restOptions } = options;
+  return (0, import_StepSettingsDialog.openStepSettingsDialog)({
+    ...restOptions,
+    mode: "drawer",
+    dialogWidth: drawerWidth,
+    dialogTitle: drawerTitle,
+    cleanup
+  });
+}, "openStepSettingsDrawer");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  openStepSettingsDrawer
+});

package/lib/components/settings/wrappers/contextual/index.d.ts

@@ -0,0 +1,14 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+export * from './FlowsContextMenu';
+export * from './FlowsFloatContextMenu';
+export * from './StepSettingsDialog';
+export * from './StepSettingsDrawer';
+export * from './StepSettings';
+export * from './StepRequiredSettingsDialog';

package/lib/components/settings/wrappers/contextual/index.js

@@ -0,0 +1,40 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var contextual_exports = {};
+module.exports = __toCommonJS(contextual_exports);
+__reExport(contextual_exports, require("./FlowsContextMenu"), module.exports);
+__reExport(contextual_exports, require("./FlowsFloatContextMenu"), module.exports);
+__reExport(contextual_exports, require("./StepSettingsDialog"), module.exports);
+__reExport(contextual_exports, require("./StepSettingsDrawer"), module.exports);
+__reExport(contextual_exports, require("./StepSettings"), module.exports);
+__reExport(contextual_exports, require("./StepRequiredSettingsDialog"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("./FlowsContextMenu"),
+  ...require("./FlowsFloatContextMenu"),
+  ...require("./StepSettingsDialog"),
+  ...require("./StepSettingsDrawer"),
+  ...require("./StepSettings"),
+  ...require("./StepRequiredSettingsDialog")
+});

package/lib/components/settings/wrappers/embedded/FlowSettings.d.ts

@@ -0,0 +1,33 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+import React from 'react';
+import { FlowModel } from '../../../../models';
+interface ModelProvidedProps {
+    model: FlowModel;
+    flowKey: string;
+}
+interface ModelByIdProps {
+    uid: string;
+    flowKey: string;
+    modelClassName: string;
+}
+type FlowSettingsProps = ModelProvidedProps | ModelByIdProps;
+/**
+ * FlowSettings组件 - 单个流程的详细配置表单（embedded版本）
+ *
+ * 特点：
+ * - 实时保存到model
+ * - 适用于嵌入式配置界面
+ *
+ * 支持两种使用方式：
+ * 1. 直接提供model: <FlowSettings model={myModel} flowKey="workflow1" />
+ * 2. 通过uid和modelClassName获取model: <FlowSettings uid="model1" modelClassName="MyModel" flowKey="workflow1" />
+ */
+declare const FlowSettings: React.FC<FlowSettingsProps>;
+export { FlowSettings };

package/lib/components/settings/wrappers/embedded/FlowSettings.js

@@ -0,0 +1,207 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var FlowSettings_exports = {};
+__export(FlowSettings_exports, {
+  FlowSettings: () => FlowSettings
+});
+module.exports = __toCommonJS(FlowSettings_exports);
+var import_antd = require("antd");
+var import_react = __toESM(require("react"));
+var import_react2 = require("@formily/react");
+var import_flowContext = require("../../../../flowContext");
+var import_hooks = require("../../../../hooks");
+var import_utils = require("../../../../utils");
+const { Item: FormItem } = import_antd.Form;
+const isModelByIdProps = /* @__PURE__ */ __name((props) => {
+  return "uid" in props && "modelClassName" in props && Boolean(props.uid) && Boolean(props.modelClassName);
+}, "isModelByIdProps");
+const FlowSettings = /* @__PURE__ */ __name((props) => {
+  if (isModelByIdProps(props)) {
+    return /* @__PURE__ */ import_react.default.createElement(FlowSettingsWithModelById, { ...props });
+  } else {
+    return /* @__PURE__ */ import_react.default.createElement(FlowSettingsWithModel, { ...props });
+  }
+}, "FlowSettings");
+const FlowSettingsWithModel = (0, import_react2.observer)(({ model, flowKey }) => {
+  if (!model) {
+    return /* @__PURE__ */ import_react.default.createElement(import_antd.Alert, { message: "\u63D0\u4F9B\u7684\u6A21\u578B\u65E0\u6548", type: "error" });
+  }
+  return /* @__PURE__ */ import_react.default.createElement(FlowSettingsContent, { model, flowKey });
+});
+const FlowSettingsWithModelById = (0, import_react2.observer)(({ uid, flowKey, modelClassName }) => {
+  const model = (0, import_hooks.useFlowModelById)(uid, modelClassName);
+  if (!model) {
+    return /* @__PURE__ */ import_react.default.createElement(import_antd.Alert, { message: `\u672A\u627E\u5230ID\u4E3A ${uid} \u7684\u6A21\u578B`, type: "error" });
+  }
+  return /* @__PURE__ */ import_react.default.createElement(FlowSettingsContent, { model, flowKey });
+});
+const FlowSettingsContent = (0, import_react2.observer)(({ model, flowKey }) => {
+  const [form] = import_antd.Form.useForm();
+  const flows = model.getFlows();
+  const flow = flows.get(flowKey);
+  const configurableSteps = Object.entries((flow == null ? void 0 : flow.steps) || {}).map(([stepKey, actionStep]) => {
+    var _a, _b;
+    if (actionStep.hideInSettings) {
+      return null;
+    }
+    const stepUiSchema = actionStep.uiSchema || {};
+    let actionUiSchema = {};
+    if (actionStep.use) {
+      const action = (_b = (_a = model.flowEngine) == null ? void 0 : _a.getAction) == null ? void 0 : _b.call(_a, actionStep.use);
+      if (action && action.uiSchema) {
+        actionUiSchema = action.uiSchema;
+      }
+    }
+    const mergedUiSchema = { ...actionUiSchema };
+    Object.entries(stepUiSchema).forEach(([fieldKey, schema]) => {
+      if (mergedUiSchema[fieldKey]) {
+        mergedUiSchema[fieldKey] = { ...mergedUiSchema[fieldKey], ...schema };
+      } else {
+        mergedUiSchema[fieldKey] = schema;
+      }
+    });
+    if (Object.keys(mergedUiSchema).length === 0) {
+      return null;
+    }
+    return { stepKey, step: actionStep, uiSchema: mergedUiSchema };
+  }).filter(Boolean);
+  const getCurrentParams = (0, import_react.useCallback)(async () => {
+    const params = {};
+    for (const { stepKey, step } of configurableSteps) {
+      const stepParams = model.getStepParams(flowKey, stepKey) || {};
+      const flowRuntimeContext = new import_flowContext.FlowRuntimeContext(model, flowKey, "settings");
+      const flow2 = model.getFlow(flowKey);
+      (0, import_utils.setupRuntimeContextSteps)(flowRuntimeContext, (flow2 == null ? void 0 : flow2.steps) || {}, model, flowKey);
+      const resolvedDefaultParams = await (0, import_utils.resolveDefaultParams)(step.defaultParams, flowRuntimeContext);
+      const mergedParams = { ...resolvedDefaultParams, ...stepParams };
+      if (Object.keys(mergedParams).length > 0) {
+        params[stepKey] = mergedParams;
+      }
+    }
+    return params;
+  }, [model, flowKey, configurableSteps]);
+  (0, import_react.useEffect)(() => {
+    const loadParams = /* @__PURE__ */ __name(async () => {
+      try {
+        const currentParams = await getCurrentParams();
+        form.setFieldsValue(currentParams);
+      } catch (error) {
+        console.error("Error loading default params:", error);
+      }
+    }, "loadParams");
+    loadParams();
+  }, [flowKey, form, getCurrentParams]);
+  const handleValuesChange = (0, import_react.useCallback)(
+    (changedValues, allValues) => {
+      Object.entries(allValues).forEach(([stepKey, stepValues]) => {
+        if (stepValues && typeof stepValues === "object") {
+          model.setStepParams(flowKey, stepKey, stepValues);
+        }
+      });
+    },
+    [model, flowKey]
+  );
+  if (!flow) {
+    return /* @__PURE__ */ import_react.default.createElement(import_antd.Alert, { message: `\u672A\u627E\u5230Key\u4E3A ${flowKey} \u7684\u6D41\u7A0B`, type: "error" });
+  }
+  if (configurableSteps.length === 0) {
+    return /* @__PURE__ */ import_react.default.createElement(import_antd.Alert, { message: "\u6B64\u6D41\u7A0B\u6CA1\u6709\u53EF\u914D\u7F6E\u7684\u53C2\u6570", type: "info" });
+  }
+  const renderFormFields = /* @__PURE__ */ __name(() => {
+    return configurableSteps.map(({ stepKey, uiSchema }) => {
+      return Object.entries(uiSchema).map(([fieldKey, schema]) => {
+        const fieldName = `${stepKey}.${fieldKey}`;
+        const renderField = /* @__PURE__ */ __name(() => {
+          var _a, _b, _c, _d;
+          switch (schema["x-component"]) {
+            case "Select":
+              return /* @__PURE__ */ import_react.default.createElement(
+                import_antd.Select,
+                {
+                  placeholder: ((_a = schema["x-component-props"]) == null ? void 0 : _a.placeholder) || `\u8BF7\u9009\u62E9${schema.title}`,
+                  options: schema.enum || [],
+                  ...schema["x-component-props"] || {}
+                }
+              );
+            case "InputNumber":
+              return /* @__PURE__ */ import_react.default.createElement(
+                import_antd.InputNumber,
+                {
+                  placeholder: ((_b = schema["x-component-props"]) == null ? void 0 : _b.placeholder) || `\u8BF7\u8F93\u5165${schema.title}`,
+                  ...schema["x-component-props"] || {}
+                }
+              );
+            case "Switch":
+              return /* @__PURE__ */ import_react.default.createElement(import_antd.Switch, { ...schema["x-component-props"] || {} });
+            case "Input.TextArea":
+              return /* @__PURE__ */ import_react.default.createElement(
+                import_antd.Input.TextArea,
+                {
+                  placeholder: ((_c = schema["x-component-props"]) == null ? void 0 : _c.placeholder) || `\u8BF7\u8F93\u5165${schema.title}`,
+                  ...schema["x-component-props"] || {}
+                }
+              );
+            default:
+              return /* @__PURE__ */ import_react.default.createElement(
+                import_antd.Input,
+                {
+                  placeholder: ((_d = schema["x-component-props"]) == null ? void 0 : _d.placeholder) || `\u8BF7\u8F93\u5165${schema.title}`,
+                  ...schema["x-component-props"] || {}
+                }
+              );
+          }
+        }, "renderField");
+        return /* @__PURE__ */ import_react.default.createElement(
+          import_antd.Form.Item,
+          {
+            key: fieldName,
+            name: [stepKey, fieldKey],
+            label: schema.title || fieldKey,
+            rules: schema.required ? [{ required: true, message: `\u8BF7\u8F93\u5165${schema.title || fieldKey}` }] : []
+          },
+          renderField()
+        );
+      });
+    });
+  }, "renderFormFields");
+  return /* @__PURE__ */ import_react.default.createElement(import_antd.Form, { form, layout: "vertical", onValuesChange: handleValuesChange }, renderFormFields());
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FlowSettings
+});

package/lib/components/settings/wrappers/embedded/FlowsSettings.d.ts

@@ -0,0 +1,41 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+import React from 'react';
+interface ModelProvidedProps {
+    model: any;
+    expandAll?: boolean;
+    children?: React.ReactNode;
+}
+interface ModelByIdProps {
+    uid: string;
+    modelClassName: string;
+    expandAll?: boolean;
+    children?: React.ReactNode;
+}
+type FlowsSettingsProps = ModelProvidedProps | ModelByIdProps;
+/**
+ * FlowsSettings组件 - 简单的流程配置界面
+ *
+ * 功能特性：
+ * - 流程配置界面
+ * - Wrapper 模式支持
+ *
+ * 支持两种使用方式：
+ * 1. 直接提供model: <FlowsSettings model={myModel} />
+ * 2. 通过uid和modelClassName获取model: <FlowsSettings uid="model1" modelClassName="MyModel" />
+ *
+ * 支持两种模式：
+ * 1. 独立设置界面: <FlowsSettings model={myModel} />
+ * 2. Wrapper模式: <FlowsSettings model={myModel}>{children}</FlowsSettings>
+ *
+ * @param props.expandAll 是否展开所有Collapse，默认为false
+ * @param props.children 子组件，如果提供则作为wrapper模式
+ */
+declare const FlowsSettings: React.FC<FlowsSettingsProps>;
+export { FlowsSettings };