@blueking/bkflow-canvas-editor 1.0.16 → 1.0.18

package/README.md

@@ -36,7 +36,7 @@ npm install @blueking/bkflow-canvas-editor
       scope_type: 'space',
       scope_value: 123,
     }, // 作用域数据（必需）
-    fetchUserApi: `${window.BK_COMPONENT_API_URL}/api/c/compapi/v2/usermanage/fs_list_users/`, // 用户查询 API（可选）
+    fetchUserApi: `${window.BK_COMPONENT_API_URL}/api/c/compapi/v2/usermanage/fs_list_users/`, // @deprecated 仅保留向后兼容，推荐使用 memberSelectorConfig
     // 可选：使用自定义 axios 实例
     // axiosInstance: customAxiosInstance,
     // 可选：axios 配置
@@ -46,6 +46,22 @@ npm install @blueking/bkflow-canvas-editor
     // },
   };
 
+  // 人员选择器配置（可选）
+  // legacy 模式：使用组件内置的 UserSelector
+  const memberSelectorConfig = {
+    mode: 'legacy',
+    fetchUserApi: `${window.BK_COMPONENT_API_URL}/api/c/compapi/v2/usermanage/fs_list_users/`,
+  };
+  // tenant 模式：使用 @blueking/bk-user-selector（需接入方单独安装该 npm 包）
+  // const memberSelectorConfig = {
+  //   mode: 'tenant',
+  //   tenantId: 'default',
+  //   apiBaseUrl: 'https://bk-user.example.com',
+  //   currentUserId: 'admin',
+  //   enableMultiTenantMode: false,
+  //   hasAvatar: false,
+  // };
+
   const handleEdit = () => {
     // 跳转到编辑页面
   };
@@ -1009,13 +1025,64 @@ interface FlowApiConfig {
     scope_type: string;
     scope_value: number;
   };
-  /** 用户查询 API 地址（可选） */
+  /**
+   * 用户查询 API 地址
+   * @deprecated 请改用 FlowEdit/FlowView/FlowCreateTask 的 memberSelectorConfig prop。
+   * 仅保留以后兼容旧版本。
+   */
   fetchUserApi?: string;
   /** 是否启用第三方插件（可选，默认为 true） */
   enableThirdPlugin?: boolean;
 }
 ```
 
+### MemberSelectorConfig
+
+`FlowEdit` / `FlowView` / `FlowCreateTask` 组件提供可选的 `memberSelectorConfig` prop，用于控制人员选择器的行为。未传入时默认为 `{ mode: 'legacy' }`。
+
+```typescript
+type MemberSelectorConfig =
+  | {
+      /** legacy 模式：使用组件内置的 UserSelector */
+      mode?: 'legacy';
+      /** 用户查询 API 地址 */
+      fetchUserApi?: string;
+    }
+  | {
+      /** tenant 模式：使用多租户人员选择器 @blueking/bk-user-selector */
+      mode: 'tenant';
+      /** 租户 ID（必填） */
+      tenantId: string;
+      /** bk-user 服务的 API 基础地址（必填） */
+      apiBaseUrl: string;
+      /** 当前登录用户 ID */
+      currentUserId?: string;
+      /** 是否启用跨租户搜索，默认 false */
+      enableMultiTenantMode?: boolean;
+      /** 是否展示头像，默认 false */
+      hasAvatar?: boolean;
+      /** 头像 CDN 基础地址 */
+      avatarBaseUrl?: string;
+      /** 最近选择的用户 ID 列表 */
+      recentUserIds?: string[];
+    };
+```
+
+使用示例：
+
+```vue
+<FlowEdit
+  :flow-id="flowId"
+  :api-config="apiConfig"
+  :member-selector-config="{
+    mode: 'tenant',
+    tenantId: 'default',
+    apiBaseUrl: 'https://bk-user.example.com',
+  }" />
+```
+
+> 提示：选择 `tenant` 模式时，接入方需安装可选 peer 依赖 `@blueking/bk-user-selector`。它仅在 tenant 模式下被动态加载，legacy 模式下未安装也不会报错。
+
 组件内部会自动实现所有 API 方法，包括：
 
 - `fetchFlowDetail` - 获取流程详情

package/dist/advanced.d.ts

@@ -547,7 +547,11 @@ interface FlowApiConfig {
         scope_type: string;
         scope_value: number;
     };
-    /** 用户查询 API 地址（可选） */
+    /**
+     * 用户查询 API 地址（可选）
+     * @deprecated 请改用 FlowEdit/FlowView 顶层组件的 `memberSelectorConfig.fetchUserApi`。
+     * 该字段仅保留向后兼容，未来版本会移除。
+     */
     fetchUserApi?: string;
     /** 是否启用第三方插件（可选，默认为 true） */
     enableThirdPlugin?: boolean;
@@ -594,6 +598,10 @@ interface FlowViewApiConfig {
     fetchFlowDetail: (id: string) => Promise<FlowTemplate>;
     fetchSpaceFlowConfig: (id: string) => Promise<SpaceFlowConfig>;
     fetchSystemVariables: (id: string) => Promise<Variable[]>;
+    /**
+     * 用户查询 API 地址
+     * @deprecated 请改用 memberSelectorConfig.fetchUserApi（顶层组件 prop）
+     */
     fetchUserApi?: string;
     /** 作用域数据（必需，由外部传入） */
     scopeData: {