@nocobase/flow-engine 2.2.0-beta.13 → 2.2.0-beta.15

package/lib/components/variables/VariableTag.js

@@ -47,35 +47,37 @@ var import_utils = require("./utils");
 var import_useResolvedMetaTree = require("./useResolvedMetaTree");
 var import_ahooks = require("ahooks");
 var import_FlowContextProvider = require("../../FlowContextProvider");
+const VARIABLE_PARSING_FAILED_TEXT = "Variable parsing failed";
 const VariableTagComponent = /* @__PURE__ */ __name(({
   value,
   onClear,
+  disabled = false,
+  allowCustomTagInput = true,
   className,
   style,
   metaTreeNode,
-  metaTree
+  metaTree,
+  resolvedPath
 }) => {
   const { resolvedMetaTree } = (0, import_useResolvedMetaTree.useResolvedMetaTree)(metaTree);
   const ctx = (0, import_FlowContextProvider.useFlowContext)();
-  const { data: displayedValue } = (0, import_ahooks.useRequest)(
+  const { data: displayState } = (0, import_ahooks.useRequest)(
     async () => {
       const resolveLabelFromPath = /* @__PURE__ */ __name(async (rawPath2) => {
-        if (!rawPath2) return null;
-        if (!Array.isArray(rawPath2)) return null;
-        if (!Array.isArray(resolvedMetaTree)) return null;
+        if (!rawPath2) return { label: null, resolved: false, attempted: false };
+        if (!Array.isArray(rawPath2)) return { label: null, resolved: false, attempted: false };
+        if (!Array.isArray(resolvedMetaTree)) return { label: null, resolved: false, attempted: false };
         const topNames = new Set((resolvedMetaTree || []).map((n) => String(n == null ? void 0 : n.name)));
         const path = !topNames.has(String(rawPath2[0])) ? rawPath2.slice(1) : rawPath2;
-        if (!path.length) return "";
+        if (!path.length) return { label: "", resolved: true, attempted: true };
         let nodes = resolvedMetaTree;
         const titleChain = [];
-        let matchedCount = 0;
         for (let i = 0; i < path.length; i++) {
-          if (!nodes) break;
+          if (!nodes) return { label: null, resolved: false, attempted: true };
           const seg = String(path[i]);
           const node = nodes.find((n) => String(n == null ? void 0 : n.name) === seg);
-          if (!node) break;
+          if (!node) return { label: null, resolved: false, attempted: true };
           titleChain.push(String(node.title ?? node.name ?? seg));
-          matchedCount = i + 1;
           if (i < path.length - 1) {
             if (Array.isArray(node.children)) {
               nodes = node.children;
@@ -92,29 +94,37 @@ const VariableTagComponent = /* @__PURE__ */ __name(({
             }
           }
         }
-        if (matchedCount === 0) return null;
-        let label2 = titleChain.map(ctx.t).join("/");
-        if (matchedCount < path.length) {
-          const tail = path.slice(matchedCount).join("/");
-          label2 = tail ? `${label2}/${tail}` : label2;
-        }
-        return label2;
+        return { label: titleChain.map(ctx.t).join("/"), resolved: true, attempted: true };
       }, "resolveLabelFromPath");
       if (metaTreeNode == null ? void 0 : metaTreeNode.parentTitles) {
-        return [...metaTreeNode.parentTitles, metaTreeNode.title].map(ctx.t).join("/");
+        return {
+          text: [...metaTreeNode.parentTitles, metaTreeNode.title].map(ctx.t).join("/"),
+          invalid: false
+        };
       }
       if (metaTreeNode) {
-        const rawPath2 = (0, import_utils.parseValueToPath)(value) || metaTreeNode.paths;
-        const label2 = await resolveLabelFromPath(rawPath2);
-        return label2 ?? ctx.t(metaTreeNode.title) ?? "";
+        const rawPath2 = resolvedPath || (0, import_utils.parseValueToPath)(value) || metaTreeNode.paths;
+        const result2 = await resolveLabelFromPath(rawPath2);
+        if (result2.resolved && result2.label != null) {
+          return { text: result2.label, invalid: false };
+        }
+        if (result2.attempted) {
+          return { text: VARIABLE_PARSING_FAILED_TEXT, invalid: true, rawValue: String(value ?? "") };
+        }
+        return { text: ctx.t(metaTreeNode.title) ?? "", invalid: false };
+      }
+      if (!value) return { text: String(value), invalid: false };
+      const rawPath = resolvedPath || (0, import_utils.parseValueToPath)(value);
+      const result = await resolveLabelFromPath(rawPath);
+      if (result.resolved && result.label != null) {
+        return { text: result.label, invalid: false };
+      }
+      if (result.attempted) {
+        return { text: VARIABLE_PARSING_FAILED_TEXT, invalid: true, rawValue: String(value ?? "") };
       }
-      if (!value) return String(value);
-      const rawPath = (0, import_utils.parseValueToPath)(value);
-      const label = await resolveLabelFromPath(rawPath);
-      if (label != null) return label;
-      return Array.isArray(rawPath) ? rawPath.join("/") : String(value);
+      return { text: Array.isArray(rawPath) ? rawPath.join("/") : String(value), invalid: false };
     },
-    { refreshDeps: [resolvedMetaTree, value, metaTreeNode] }
+    { refreshDeps: [resolvedMetaTree, resolvedPath, value, metaTreeNode] }
   );
   const { token } = import_antd.theme.useToken();
   const shrinkableOverflowItem = import_css.css`
@@ -129,12 +139,12 @@ const VariableTagComponent = /* @__PURE__ */ __name(({
     }
   `;
   const customTagRender = /* @__PURE__ */ __name((props) => {
-    const { label } = props;
-    const fullText = typeof label === "string" ? label : String(label);
-    return /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { title: fullText, placement: "top", getPopupContainer: () => document.body }, /* @__PURE__ */ import_react.default.createElement(
+    const fullText = (displayState == null ? void 0 : displayState.text) || (typeof props.label === "string" ? props.label : String(props.label));
+    const tooltipText = (displayState == null ? void 0 : displayState.invalid) ? displayState.rawValue || fullText : fullText;
+    return /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { title: tooltipText, placement: "top", getPopupContainer: () => document.body }, /* @__PURE__ */ import_react.default.createElement(
       import_antd.Tag,
       {
-        color: "blue",
+        color: (displayState == null ? void 0 : displayState.invalid) ? "error" : "blue",
         style: {
           margin: `0 ${token.marginXXS || token.marginXS}px`,
           borderRadius: token.borderRadiusSM,
@@ -175,12 +185,14 @@ const VariableTagComponent = /* @__PURE__ */ __name(({
         flex: "1 1 auto",
         ...style
       },
-      value: displayedValue ? [displayedValue] : [],
-      mode: "tags",
+      value: (displayState == null ? void 0 : displayState.text) ? [displayState.text] : [],
+      mode: allowCustomTagInput ? "tags" : "multiple",
       open: false,
-      allowClear: !!onClear,
-      onClear,
-      disabled: !onClear,
+      showSearch: allowCustomTagInput,
+      searchValue: allowCustomTagInput ? void 0 : "",
+      allowClear: !disabled && !!onClear,
+      onClear: disabled ? void 0 : onClear,
+      disabled: disabled || !onClear,
       variant: "outlined",
       suffixIcon: null,
       tagRender: customTagRender,

package/lib/components/variables/types.d.ts

@@ -13,12 +13,30 @@ export interface FlowContextSelectorProps extends Omit<CascaderProps<ContextSele
     value?: string;
     onChange?: (value: string, metaTreeNode?: MetaTreeNode) => void;
     children?: CascaderProps<ContextSelectorItem>['children'];
+    /**
+     * Controls whether the default `x` trigger button is rendered as active
+     * (`type="primary"`). When omitted, the selector falls back to its parsed
+     * `value` path (`true` iff a valid variable path is currently selected).
+     *
+     * Use this when callers intentionally feed synthetic paths such as
+     * `['constant']` / `['null']` into the cascader to keep menu state aligned,
+     * but only want real variable references to show the blue active button.
+     */
+    active?: boolean;
     metaTree?: MetaTreeNode[] | (() => MetaTreeNode[] | Promise<MetaTreeNode[]>);
     parseValueToPath?: (value: string) => string[] | undefined;
     formatPathToValue?: (item: MetaTreeNode) => string;
     open?: boolean;
     onlyLeafSelectable?: boolean;
     ignoreFieldNames?: string[];
+    /**
+     * Footer rendered at the bottom of the dropdown. Defaults to a muted
+     * "Double click to choose entire object" hint when non-leaf selection is
+     * allowed (`onlyLeafSelectable` is false) — since double-clicking a non-leaf
+     * node selects the whole object. Pass an explicit node to override, or `null`
+     * to hide it.
+     */
+    dropdownFooter?: React.ReactNode;
 }
 export interface ContextSelectorItem {
     label: React.ReactNode;
@@ -68,7 +86,10 @@ export interface VariableInputProps {
 }
 export interface VariableTagProps {
     value?: string;
+    resolvedPath?: Array<string | number>;
     onClear?: () => void;
+    disabled?: boolean;
+    allowCustomTagInput?: boolean;
     className?: string;
     style?: React.CSSProperties;
     metaTreeNode?: MetaTreeNode | null;

package/lib/flowI18n.js

@@ -81,7 +81,7 @@ const _FlowI18n = class _FlowI18n {
    * @private
    */
   isTemplate(str) {
-    return /\{\{\s*t\s*\(\s*["'`].*?["'`]\s*(?:,\s*.*?)?\s*\)\s*\}\}/g.test(str);
+    return /\{\{\s*t\s*\(\s*(["'`])(?:\\.|(?!\1).)*?\1\s*(?:,\s*.*?)?\s*\)\s*\}\}/.test(str);
   }
   /**
    * 编译模板字符串
@@ -89,8 +89,8 @@ const _FlowI18n = class _FlowI18n {
    */
   compileTemplate(template) {
     return template.replace(
-      /\{\{\s*t\s*\(\s*["'`](.*?)["'`]\s*(?:,\s*((?:[^{}]|\{[^}]*\})*?))?\s*\)\s*\}\}/g,
-      (match, key, optionsStr) => {
+      /\{\{\s*t\s*\(\s*(["'`])((?:\\.|(?!\1).)*?)\1\s*(?:,\s*((?:[^{}]|\{[^}]*\})*?))?\s*\)\s*\}\}/g,
+      (match, _quote, key, optionsStr) => {
         try {
           let templateOptions = {};
           if (optionsStr) {

package/lib/types.d.ts

@@ -122,7 +122,9 @@ export declare enum ActionScene {
     /** 动态事件流可用 */
     DYNAMIC_EVENT_FLOW = 6,
     /** 菜单项联动规则可用 */
-    MENU_LINKAGE_RULES = 7
+    MENU_LINKAGE_RULES = 7,
+    /** 标签页联动规则可用 */
+    TAB_LINKAGE_RULES = 8
 }
 /**
  * Defines a reusable action with generic model type support.

package/lib/types.js

@@ -37,6 +37,7 @@ var ActionScene = /* @__PURE__ */ ((ActionScene2) => {
   ActionScene2[ActionScene2["ACTION_LINKAGE_RULES"] = 5] = "ACTION_LINKAGE_RULES";
   ActionScene2[ActionScene2["DYNAMIC_EVENT_FLOW"] = 6] = "DYNAMIC_EVENT_FLOW";
   ActionScene2[ActionScene2["MENU_LINKAGE_RULES"] = 7] = "MENU_LINKAGE_RULES";
+  ActionScene2[ActionScene2["TAB_LINKAGE_RULES"] = 8] = "TAB_LINKAGE_RULES";
   return ActionScene2;
 })(ActionScene || {});
 // Annotate the CommonJS export names for ESM import in node:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/flow-engine",
-  "version": "2.2.0-beta.13",
+  "version": "2.2.0-beta.15",
   "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.2.0-beta.13",
-    "@nocobase/shared": "2.2.0-beta.13",
+    "@nocobase/sdk": "2.2.0-beta.15",
+    "@nocobase/shared": "2.2.0-beta.15",
     "ahooks": "^3.7.2",
     "axios": "^1.7.0",
     "dayjs": "^1.11.9",
@@ -37,5 +37,5 @@
   ],
   "author": "NocoBase Team",
   "license": "Apache-2.0",
-  "gitHead": "8fff12b34f41f4336075cdafcc700ec694f9b78a"
+  "gitHead": "4c471f6b7d26adc412b2cc1d91264572296ca873"
 }

package/src/__tests__/flowI18n.test.ts

@@ -17,6 +17,17 @@ describe('FlowI18n', () => {
     expect(i18n.translate("{{ t('Hello') }}")).toBe('你好');
   });
 
+  it('keeps embedded quotes of a different type inside the key', () => {
+    // A single-quoted key whose text contains double quotes (and vice versa) must not be truncated at the first inner
+    // quote.
+    const key = 'Unlike "Post-action event", it listens for data changes.';
+    const table: Record<string, string> = { [key]: '与“操作后事件”不同，它监听数据变动。' };
+    const i18n = new FlowI18n({ i18n: { t: (k: string) => table[k] ?? k } });
+
+    expect(i18n.translate(`{{t('${key}', { ns: "workflow" })}}`)).toBe(table[key]);
+    expect(i18n.translate(`{{t("It's here", { ns: "workflow" })}}`)).toBe("It's here");
+  });
+
   it('template compile ignores malformed options', () => {
     const spy = vi.spyOn(console, 'warn').mockImplementation(() => undefined);
     const i18n = new FlowI18n({ i18n: { t: (k: string) => k } });

package/src/components/FlowContextSelector.tsx

@@ -40,6 +40,18 @@ type SelectedPathInfo = {
   meta?: ContextSelectorItem['meta'];
 };
 
+type MetaNodeTooltipOptions = { tooltip?: React.ReactNode };
+
+function getMetaNodeTooltip(meta?: ContextSelectorItem['meta']): React.ReactNode {
+  if (!meta) {
+    return undefined;
+  }
+
+  const metaWithTooltip = meta as ContextSelectorItem['meta'] & MetaNodeTooltipOptions;
+  const options = meta.options as MetaNodeTooltipOptions | undefined;
+  return metaWithTooltip.tooltip ?? options?.tooltip;
+}
+
 const normalizePath = (path: unknown): string[] | undefined => {
   if (!Array.isArray(path)) {
     return undefined;
@@ -85,6 +97,7 @@ const FlowContextSelectorComponent: React.FC<FlowContextSelectorProps> = ({
   value,
   onChange,
   children,
+  active,
   metaTree,
   showSearch = false,
   parseValueToPath: customParseValueToPath = parseValueToPath,
@@ -92,6 +105,7 @@ const FlowContextSelectorComponent: React.FC<FlowContextSelectorProps> = ({
   open,
   onlyLeafSelectable = false,
   ignoreFieldNames,
+  dropdownFooter,
   ...cascaderProps
 }) => {
   const { token } = theme.useToken();
@@ -119,17 +133,28 @@ const FlowContextSelectorComponent: React.FC<FlowContextSelectorProps> = ({
 
         // 文本国际化：仅当 label 为字符串时进行翻译
         const baseLabel = typeof o.label === 'string' ? flowCtx.t(o.label) : o.label;
+        const labelText = typeof baseLabel === 'string' ? baseLabel : String(o.value);
+        const tooltip = getMetaNodeTooltip(meta);
+        const tooltipTitle = disabled
+          ? disabledReason || tooltip || flowCtx.t('This variable is not available')
+          : tooltip;
 
-        const label = disabled ? (
+        const label = tooltipTitle ? (
           <span>
             {baseLabel}
             <Tooltip
-              title={disabledReason || flowCtx.t('This variable is not available')}
-              placement="right"
-              overlayClassName="flow-variable-disabled-tip"
+              title={typeof tooltipTitle === 'string' ? flowCtx.t(tooltipTitle) : tooltipTitle}
+              placement="top"
+              classNames={{ root: 'flow-variable-tip' }}
               destroyTooltipOnHide
             >
-              <QuestionCircleOutlined style={{ marginLeft: 6, color: 'rgba(0,0,0,0.35)' }} />
+              <QuestionCircleOutlined
+                aria-label={`${labelText} tooltip`}
+                style={{
+                  marginLeft: token.marginXXS,
+                  color: disabled ? token.colorTextDisabled : token.colorTextDescription,
+                }}
+              />
             </Tooltip>
           </span>
         ) : (
@@ -144,7 +169,7 @@ const FlowContextSelectorComponent: React.FC<FlowContextSelectorProps> = ({
         };
       });
     },
-    [flowCtx],
+    [flowCtx, token.colorTextDescription, token.colorTextDisabled, token.marginXXS],
   );
 
   // 用于强制重新渲染的状态
@@ -265,13 +290,13 @@ const FlowContextSelectorComponent: React.FC<FlowContextSelectorProps> = ({
 
   // 默认按钮组件
   const defaultChildren = useMemo(() => {
-    const hasSelected = currentPath && currentPath.length > 0;
+    const hasSelected = active ?? Boolean(currentPath && currentPath.length > 0);
     return (
-      <Button type={hasSelected ? 'primary' : 'default'} style={defaultButtonStyle}>
+      <Button type={hasSelected ? 'primary' : 'default'} style={defaultButtonStyle} disabled={cascaderProps.disabled}>
         x
       </Button>
     );
-  }, [currentPath]);
+  }, [active, cascaderProps.disabled, currentPath]);
 
   // 处理选择变化事件
   const handleChange = useCallback(
@@ -360,12 +385,41 @@ const FlowContextSelectorComponent: React.FC<FlowContextSelectorProps> = ({
     [cascaderOnDropdownVisibleChange, open],
   );
 
+  // Footer hint at the bottom of the dropdown. Defaults to the "double click to choose entire object" hint whenever
+  // non-leaf selection is allowed (double-clicking a non-leaf selects the whole object). Callers can override with
+  // their own node, or pass `null` to hide it.
+  const footerNode = useMemo(() => {
+    if (dropdownFooter !== undefined) {
+      return dropdownFooter;
+    }
+    if (onlyLeafSelectable) {
+      return null;
+    }
+    return (
+      <div
+        className={css`
+          padding: 6px 12px;
+          color: ${token.colorTextDescription};
+          border-top: 1px solid ${token.colorSplit};
+          font-size: ${token.fontSizeSM}px;
+        `}
+      >
+        {flowCtx.t('Double click to choose entire object')}
+      </div>
+    );
+  }, [dropdownFooter, onlyLeafSelectable, token, flowCtx]);
+
   const renderDropdown = useCallback(
     (menu: React.ReactElement) => {
       const cascaderMenuNode = cascaderDropdownRender ? cascaderDropdownRender(menu) : menu;
       const cascaderMenu = React.isValidElement(cascaderMenuNode) ? cascaderMenuNode : <>{cascaderMenuNode}</>;
       if (!isSearchEnabled || children === null) {
-        return cascaderMenu;
+        return (
+          <>
+            {cascaderMenu}
+            {footerNode}
+          </>
+        );
       }
 
       return (
@@ -381,10 +435,11 @@ const FlowContextSelectorComponent: React.FC<FlowContextSelectorProps> = ({
             />
           </div>
           {cascaderMenu}
+          {footerNode}
         </>
       );
     },
-    [cascaderDropdownRender, cascaderSearchInputClassName, children, flowCtx, isSearchEnabled, searchText],
+    [cascaderDropdownRender, cascaderSearchInputClassName, children, flowCtx, isSearchEnabled, searchText, footerNode],
   );
 
   const inlinePlaceholder =

package/src/components/FormItem.tsx

@@ -54,15 +54,20 @@ const formItemPropKeys: (keyof ExtendedFormItemProps)[] = [
   'showLabel',
 ];
 
+const modelInternalPropKeys = ['globalSort'];
+
 export const FormItem = ({
   children,
   showLabel = true,
   labelWidth,
   ...rest
 }: ExtendedFormItemProps & ChildExtraProps) => {
+  const forwardedRest = Object.fromEntries(
+    Object.entries(rest).filter(([key]) => !modelInternalPropKeys.includes(key)),
+  ) as ExtendedFormItemProps & ChildExtraProps;
   // 过滤掉 Form.Item 专用 props，只保留要传给子组件的
   const childProps = Object.fromEntries(
-    Object.entries(rest).filter(([key]) => !formItemPropKeys.includes(key as keyof ExtendedFormItemProps)),
+    Object.entries(forwardedRest).filter(([key]) => !formItemPropKeys.includes(key as keyof ExtendedFormItemProps)),
   );
 
   const processedChildren =
@@ -74,7 +79,7 @@ export const FormItem = ({
           }
           return child;
         });
-  const { label, labelWrap, colon = true, layout } = rest;
+  const { label, labelWrap, colon = true, layout } = forwardedRest;
   const effectiveLabelWrap = !layout || layout === 'vertical' ? true : labelWrap;
   const labelColStyle =
     layout === 'vertical' ? { width: labelWidth, ...verticalFormItemLabelStyle } : { width: labelWidth };
@@ -122,17 +127,17 @@ export const FormItem = ({
   };
   return (
     <Form.Item
-      {...rest}
-      style={{ ...formItemStyle, ...rest.style }}
+      {...forwardedRest}
+      style={{ ...formItemStyle, ...forwardedRest.style }}
       labelCol={{ style: labelColStyle }}
       layout={layout}
       label={renderLabel()}
       colon={false}
-      extra={rest.extra && <span style={{ whiteSpace: 'pre-wrap' }}>{rest.extra}</span>}
+      extra={forwardedRest.extra && <span style={{ whiteSpace: 'pre-wrap' }}>{forwardedRest.extra}</span>}
       tooltip={
-        rest.tooltip &&
+        forwardedRest.tooltip &&
         ({
-          title: rest.tooltip,
+          title: forwardedRest.tooltip,
           overlayInnerStyle: { whiteSpace: 'pre-line' },
         } as TooltipProps)
       }

package/src/components/__tests__/FormItem.test.tsx

@@ -7,8 +7,10 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { describe, expect, it } from 'vitest';
-import { formItemStyle, verticalFormItemLabelStyle } from '../FormItem';
+import { render } from '@testing-library/react';
+import React from 'react';
+import { describe, expect, it, vi } from 'vitest';
+import { FormItem, formItemStyle, verticalFormItemLabelStyle } from '../FormItem';
 
 describe('FormItem', () => {
   it('keeps vertical label-to-value spacing consistent with v1', () => {
@@ -22,4 +24,17 @@ describe('FormItem', () => {
       marginBottom: 12,
     });
   });
+
+  it('does not forward model-internal globalSort props to field children', () => {
+    const Field = vi.fn(() => <input aria-label="field" />);
+
+    render(
+      <FormItem globalSort={['title']} placeholder="Title">
+        <Field />
+      </FormItem>,
+    );
+
+    expect(Field).toHaveBeenCalledWith(expect.not.objectContaining({ globalSort: expect.anything() }), {});
+    expect(Field).toHaveBeenCalledWith(expect.objectContaining({ placeholder: 'Title' }), {});
+  });
 });