@nocobase/flow-engine 2.1.29 → 2.1.30

package/lib/components/subModel/LazyDropdown.js

@@ -419,6 +419,8 @@ const SUBMENU_MOTION_DISABLED = {
 const dropdownPersistRegistry = /* @__PURE__ */ new Map();
 const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
   const engine = (0, import_provider.useFlowEngine)();
+  const { getPrefixCls } = import_react.default.useContext(import_antd.ConfigProvider.ConfigContext);
+  const triggerId = import_react.default.useId();
   const [menuVisible, setMenuVisible] = (0, import_react.useState)(false);
   const [openKeys, setOpenKeys] = (0, import_react.useState)(/* @__PURE__ */ new Set());
   const [rootItems, setRootItems] = (0, import_react.useState)([]);
@@ -426,6 +428,9 @@ const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
   const activeSearchKeyRef = (0, import_react.useRef)(null);
   const closeByOutsideClickRef = (0, import_react.useRef)(false);
   const skipPreserveActiveSearchRef = (0, import_react.useRef)(false);
+  const triggerOpenClassName = `nb-lazy-dropdown-trigger-${triggerId.replace(/[^a-zA-Z0-9_-]/g, "")}`;
+  const defaultOpenClassName = `${getPrefixCls("dropdown", props.prefixCls)}-open`;
+  const mergedOpenClassName = [props.openClassName ?? defaultOpenClassName, triggerOpenClassName].filter(Boolean).join(" ");
   const dropdownMaxHeight = useNiceDropdownMaxHeight();
   const t = engine.translate.bind(engine);
   const { items: menuItems, keepDropdownOpen, persistKey, stateVersion, refreshKeys, ...dropdownMenuProps } = menu;
@@ -510,7 +515,9 @@ const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
     if (!menuVisible) return;
     const markOutsideClick = /* @__PURE__ */ __name((event) => {
       const target = event.target;
-      const isOutside = !(target == null ? void 0 : target.closest(".ant-dropdown, .ant-dropdown-menu, .ant-dropdown-menu-submenu-popup"));
+      const isInsidePopup = target == null ? void 0 : target.closest(".ant-dropdown, .ant-dropdown-menu, .ant-dropdown-menu-submenu-popup");
+      const isInsideCurrentTrigger = target == null ? void 0 : target.closest(`.${triggerOpenClassName}`);
+      const isOutside = !isInsidePopup && !isInsideCurrentTrigger;
       closeByOutsideClickRef.current = isOutside;
       if (isOutside) {
         closeMenu();
@@ -522,7 +529,7 @@ const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
       document.removeEventListener("pointerdown", markOutsideClick, true);
       document.removeEventListener("mousedown", markOutsideClick, true);
     };
-  }, [closeMenu, menuVisible]);
+  }, [closeMenu, menuVisible, triggerOpenClassName]);
   (0, import_react.useEffect)(() => {
     if (!persistKey) return;
     const until = dropdownPersistRegistry.get(persistKey) || 0;
@@ -741,6 +748,7 @@ const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
       open: menuVisible,
       destroyPopupOnHide: true,
       mouseLeaveDelay: props.mouseLeaveDelay ?? MENU_CLOSE_DELAY,
+      openClassName: mergedOpenClassName,
       overlayClassName,
       placement: "bottomLeft",
       menu: {

package/lib/locale/en-US.json

@@ -1,5 +1,6 @@
 {
   "Add": "Add",
+  "Are you sure you want to perform the action?": "Are you sure you want to perform the action?",
   "Are you sure you want to delete this item? This action cannot be undone.": "Are you sure you want to delete this item? This action cannot be undone.",
   "Are you sure to convert this template block to copy mode?": "Are you sure you want to convert this template block to copy mode?",
   "Array index out of bounds": "Array index {{index}} out of bounds for '{{subKey}}'",
@@ -53,6 +54,7 @@
   "Other blocks": "Other blocks",
   "Parent not found, cannot replace block": "Parent not found, cannot replace block",
   "Previous step": "Previous step",
+  "Please Confirm": "Please Confirm",
   "Replace current block with template?": "Replace current block with template?",
   "Replaced with template block": "Replaced with template block",
   "Render failed": "Render failed",

package/lib/locale/index.d.ts

@@ -9,6 +9,7 @@
 export declare const locales: {
     'en-US': {
         Add: string;
+        "Are you sure you want to perform the action?": string;
         "Are you sure you want to delete this item? This action cannot be undone.": string;
         "Are you sure to convert this template block to copy mode?": string;
         "Array index out of bounds": string;
@@ -62,6 +63,7 @@ export declare const locales: {
         "Other blocks": string;
         "Parent not found, cannot replace block": string;
         "Previous step": string;
+        "Please Confirm": string;
         "Replace current block with template?": string;
         "Replaced with template block": string;
         "Render failed": string;
@@ -91,6 +93,7 @@ export declare const locales: {
     };
     'zh-CN': {
         Add: string;
+        "Are you sure you want to perform the action?": string;
         "Are you sure you want to delete this item? This action cannot be undone.": string;
         "Are you sure to convert this template block to copy mode?": string;
         "Array index out of bounds": string;
@@ -150,6 +153,7 @@ export declare const locales: {
         OK: string;
         "Other blocks": string;
         "Previous step": string;
+        "Please Confirm": string;
         "Render failed": string;
         "Response record": string;
         "Step configuration": string;

package/lib/locale/zh-CN.json

@@ -1,5 +1,6 @@
 {
   "Add": "添加",
+  "Are you sure you want to perform the action?": "确定要执行此操作吗？",
   "Are you sure you want to delete this item? This action cannot be undone.": "确定要删除此项吗？此操作不可撤销。",
   "Are you sure to convert this template block to copy mode?": "确定将该模板区块转换为复制模式吗？",
   "Array index out of bounds": "数组索引 {{index}} 超出 '{{subKey}}' 的边界",
@@ -59,6 +60,7 @@
   "OK": "确定",
   "Other blocks": "其他区块",
   "Previous step": "上一步",
+  "Please Confirm": "请确认",
   "Render failed": "渲染失败",
   "Response record": "响应结果记录",
   "Step configuration": "步骤配置",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/flow-engine",
-  "version": "2.1.29",
+  "version": "2.1.30",
   "private": false,
   "description": "A standalone flow engine for NocoBase, managing workflows, models, and actions.",
   "main": "lib/index.js",
@@ -8,8 +8,8 @@
   "dependencies": {
     "@formily/antd-v5": "1.x",
     "@formily/reactive": "2.x",
-    "@nocobase/sdk": "2.1.29",
-    "@nocobase/shared": "2.1.29",
+    "@nocobase/sdk": "2.1.30",
+    "@nocobase/shared": "2.1.30",
     "ahooks": "^3.7.2",
     "axios": "^1.7.0",
     "dayjs": "^1.11.9",
@@ -37,5 +37,5 @@
   ],
   "author": "NocoBase Team",
   "license": "Apache-2.0",
-  "gitHead": "d9848c5df07cef806cb938bb14b3f4ef5f3d0129"
+  "gitHead": "c1a4bff0fd3c8b30e06fc6f50ad33e054b04061a"
 }

package/src/components/subModel/LazyDropdown.tsx

@@ -8,7 +8,7 @@
  */
 
 import { css } from '@emotion/css';
-import { Dropdown, DropdownProps, Empty, Input, InputProps, Spin } from 'antd';
+import { ConfigProvider, Dropdown, DropdownProps, Empty, Input, InputProps, Spin } from 'antd';
 import React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useFlowEngine } from '../../provider';
 
@@ -564,6 +564,8 @@ const dropdownPersistRegistry: Map<string, number> = new Map();
 
 const LazyDropdown: React.FC<Omit<DropdownProps, 'menu'> & { menu: LazyDropdownMenuProps }> = ({ menu, ...props }) => {
   const engine = useFlowEngine();
+  const { getPrefixCls } = React.useContext(ConfigProvider.ConfigContext);
+  const triggerId = React.useId();
   const [menuVisible, setMenuVisible] = useState(false);
   const [openKeys, setOpenKeys] = useState<Set<string>>(new Set());
   const [rootItems, setRootItems] = useState<Item[]>([]);
@@ -571,6 +573,11 @@ const LazyDropdown: React.FC<Omit<DropdownProps, 'menu'> & { menu: LazyDropdownM
   const activeSearchKeyRef = useRef<string | null>(null);
   const closeByOutsideClickRef = useRef(false);
   const skipPreserveActiveSearchRef = useRef(false);
+  const triggerOpenClassName = `nb-lazy-dropdown-trigger-${triggerId.replace(/[^a-zA-Z0-9_-]/g, '')}`;
+  const defaultOpenClassName = `${getPrefixCls('dropdown', props.prefixCls)}-open`;
+  const mergedOpenClassName = [props.openClassName ?? defaultOpenClassName, triggerOpenClassName]
+    .filter(Boolean)
+    .join(' ');
   const dropdownMaxHeight = useNiceDropdownMaxHeight();
   const t = engine.translate.bind(engine);
 
@@ -673,7 +680,9 @@ const LazyDropdown: React.FC<Omit<DropdownProps, 'menu'> & { menu: LazyDropdownM
 
     const markOutsideClick = (event: MouseEvent | PointerEvent) => {
       const target = event.target as HTMLElement | null;
-      const isOutside = !target?.closest('.ant-dropdown, .ant-dropdown-menu, .ant-dropdown-menu-submenu-popup');
+      const isInsidePopup = target?.closest('.ant-dropdown, .ant-dropdown-menu, .ant-dropdown-menu-submenu-popup');
+      const isInsideCurrentTrigger = target?.closest(`.${triggerOpenClassName}`);
+      const isOutside = !isInsidePopup && !isInsideCurrentTrigger;
       closeByOutsideClickRef.current = isOutside;
       if (isOutside) {
         closeMenu();
@@ -686,7 +695,7 @@ const LazyDropdown: React.FC<Omit<DropdownProps, 'menu'> & { menu: LazyDropdownM
       document.removeEventListener('pointerdown', markOutsideClick, true);
       document.removeEventListener('mousedown', markOutsideClick, true);
     };
-  }, [closeMenu, menuVisible]);
+  }, [closeMenu, menuVisible, triggerOpenClassName]);
 
   // 在挂载时，若存在 persistKey 且仍在持久期内，则尝试恢复打开状态
   useEffect(() => {
@@ -965,6 +974,7 @@ const LazyDropdown: React.FC<Omit<DropdownProps, 'menu'> & { menu: LazyDropdownM
       open={menuVisible}
       destroyPopupOnHide
       mouseLeaveDelay={props.mouseLeaveDelay ?? MENU_CLOSE_DELAY}
+      openClassName={mergedOpenClassName}
       overlayClassName={overlayClassName}
       placement="bottomLeft"
       menu={{

package/src/components/subModel/__tests__/AddSubModelButton.test.tsx

@@ -503,6 +503,85 @@ describe('transformItems - searchable flags', () => {
     await waitFor(() => expect(screen.queryByText('Fields')).not.toBeInTheDocument());
   });
 
+  it('keeps the dropdown open when clicking its already-hovered trigger', async () => {
+    const engine = new FlowEngine();
+    await engine.flowSettings.forceEnable();
+    class Parent extends FlowModel {}
+    engine.registerModels({ Parent });
+    const parent = engine.createModel<FlowModel>({ use: 'Parent' });
+    const user = userEvent.setup();
+
+    render(
+      <FlowEngineProvider engine={engine}>
+        <ConfigProvider>
+          <App>
+            <AddSubModelButton
+              model={parent}
+              subModelKey="items"
+              items={[
+                {
+                  key: 'child',
+                  label: 'Child',
+                  createModelOptions: { use: 'Parent' },
+                },
+              ]}
+            >
+              Open
+            </AddSubModelButton>
+          </App>
+        </ConfigProvider>
+      </FlowEngineProvider>,
+    );
+
+    const trigger = screen.getByText('Open');
+    await user.hover(trigger);
+    await waitFor(() => expect(screen.getByText('Child')).toBeInTheDocument());
+    expect(trigger).toHaveClass('ant-dropdown-open');
+
+    await user.click(trigger);
+
+    expect(screen.getByText('Child')).toBeInTheDocument();
+  });
+
+  it('closes the dropdown when clicking another dropdown trigger', async () => {
+    const engine = new FlowEngine();
+    await engine.flowSettings.forceEnable();
+    class Parent extends FlowModel {}
+    engine.registerModels({ Parent });
+    const parent = engine.createModel<FlowModel>({ use: 'Parent' });
+    const user = userEvent.setup();
+
+    render(
+      <FlowEngineProvider engine={engine}>
+        <ConfigProvider>
+          <App>
+            <AddSubModelButton
+              model={parent}
+              subModelKey="firstItems"
+              items={[{ key: 'first-child', label: 'First child', createModelOptions: { use: 'Parent' } }]}
+            >
+              Open first
+            </AddSubModelButton>
+            <AddSubModelButton
+              model={parent}
+              subModelKey="secondItems"
+              items={[{ key: 'second-child', label: 'Second child', createModelOptions: { use: 'Parent' } }]}
+            >
+              Open second
+            </AddSubModelButton>
+          </App>
+        </ConfigProvider>
+      </FlowEngineProvider>,
+    );
+
+    await user.hover(screen.getByText('Open first'));
+    await waitFor(() => expect(screen.getByText('First child')).toBeInTheDocument());
+
+    fireEvent.pointerDown(screen.getByText('Open second'));
+
+    await waitFor(() => expect(screen.queryByText('First child')).not.toBeInTheDocument());
+  });
+
   it('switches away from active searchable submenu and resets its input', async () => {
     const engine = new FlowEngine();
     await engine.flowSettings.forceEnable();

package/src/locale/__tests__/index.test.ts

@@ -0,0 +1,21 @@
+/**
+ * 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 { describe, expect, it } from 'vitest';
+
+import { getFlowEngineTranslation } from '../index';
+
+describe('flow engine locale', () => {
+  it('translates the default secondary confirmation text into Chinese', () => {
+    expect(getFlowEngineTranslation('Please Confirm', 'zh-CN')).toBe('请确认');
+    expect(getFlowEngineTranslation('Are you sure you want to perform the action?', 'zh-CN')).toBe(
+      '确定要执行此操作吗？',
+    );
+  });
+});

package/src/locale/en-US.json

@@ -1,5 +1,6 @@
 {
   "Add": "Add",
+  "Are you sure you want to perform the action?": "Are you sure you want to perform the action?",
   "Are you sure you want to delete this item? This action cannot be undone.": "Are you sure you want to delete this item? This action cannot be undone.",
   "Are you sure to convert this template block to copy mode?": "Are you sure you want to convert this template block to copy mode?",
   "Array index out of bounds": "Array index {{index}} out of bounds for '{{subKey}}'",
@@ -53,6 +54,7 @@
   "Other blocks": "Other blocks",
   "Parent not found, cannot replace block": "Parent not found, cannot replace block",
   "Previous step": "Previous step",
+  "Please Confirm": "Please Confirm",
   "Replace current block with template?": "Replace current block with template?",
   "Replaced with template block": "Replaced with template block",
   "Render failed": "Render failed",

package/src/locale/zh-CN.json

@@ -1,5 +1,6 @@
 {
   "Add": "添加",
+  "Are you sure you want to perform the action?": "确定要执行此操作吗？",
   "Are you sure you want to delete this item? This action cannot be undone.": "确定要删除此项吗？此操作不可撤销。",
   "Are you sure to convert this template block to copy mode?": "确定将该模板区块转换为复制模式吗？",
   "Array index out of bounds": "数组索引 {{index}} 超出 '{{subKey}}' 的边界",
@@ -59,6 +60,7 @@
   "OK": "确定",
   "Other blocks": "其他区块",
   "Previous step": "上一步",
+  "Please Confirm": "请确认",
   "Render failed": "渲染失败",
   "Response record": "响应结果记录",
   "Step configuration": "步骤配置",