@nocobase/flow-engine 2.2.0-alpha.7 → 2.2.0-alpha.8

package/lib/components/variables/VariableInput.js

@@ -132,16 +132,18 @@ const VariableInputComponent = /* @__PURE__ */ __name(({
     },
     [onChange]
   );
+  const resolvedPath = (0, import_react.useMemo)(() => {
+    return resolvePathFromValue == null ? void 0 : resolvePathFromValue(innerValue);
+  }, [innerValue, resolvePathFromValue]);
   const resolvedMetaTreeNode = (0, import_react.useMemo)(() => {
     if (currentMetaTreeNode) return currentMetaTreeNode;
     if (Array.isArray(resolvedMetaTree)) {
-      const path = resolvePathFromValue == null ? void 0 : resolvePathFromValue(innerValue);
-      if (path) {
-        return findMetaTreeNodeByPath(resolvedMetaTree, path);
+      if (resolvedPath) {
+        return findMetaTreeNodeByPath(resolvedMetaTree, resolvedPath);
       }
     }
     return null;
-  }, [currentMetaTreeNode, innerValue, resolvedMetaTree, resolvePathFromValue]);
+  }, [currentMetaTreeNode, resolvedMetaTree, resolvedPath]);
   (0, import_react.useEffect)(() => {
     const restoreFromValue = /* @__PURE__ */ __name(async () => {
       if (!Array.isArray(resolvedMetaTree) || value == null) return;
@@ -192,9 +194,13 @@ const VariableInputComponent = /* @__PURE__ */ __name(({
   const ValueComponent = (0, import_react.useMemo)(() => {
     const Component = renderInputComponent == null ? void 0 : renderInputComponent(resolvedMetaTreeNode);
     const CustomComponent = resolvedMetaTreeNode == null ? void 0 : resolvedMetaTreeNode.render;
-    const finalComponent = (0, import_utils.isVariableValue)(innerValue) ? import_VariableTag.VariableTag : Component || CustomComponent || import_antd.Input;
+    const shouldRenderVariableTag = (0, import_utils.isVariableValue)(innerValue) || Boolean(resolvedMetaTreeNode) && Array.isArray(resolvedPath) && resolvedPath.length > 0 && !Component && !CustomComponent;
+    const finalComponent = shouldRenderVariableTag ? import_VariableTag.VariableTag : Component || CustomComponent || import_antd.Input;
     return finalComponent;
-  }, [renderInputComponent, resolvedMetaTreeNode, innerValue]);
+  }, [renderInputComponent, resolvedMetaTreeNode, innerValue, resolvedPath]);
+  const isVariableActive = (0, import_react.useMemo)(() => {
+    return (0, import_utils.isVariableValue)(innerValue) || Boolean(resolvedMetaTreeNode) && Array.isArray(resolvedPath) && resolvedPath.length > 0 && !(renderInputComponent == null ? void 0 : renderInputComponent(resolvedMetaTreeNode)) && !(resolvedMetaTreeNode == null ? void 0 : resolvedMetaTreeNode.render);
+  }, [innerValue, renderInputComponent, resolvedMetaTreeNode, resolvedPath]);
   (0, import_react.useEffect)(() => {
     if (!resolvedMetaTreeNode) return;
     if (!Array.isArray(resolvedMetaTree) || innerValue == null) return;
@@ -278,6 +284,8 @@ const VariableInputComponent = /* @__PURE__ */ __name(({
       return {
         ...baseProps,
         onClear: handleClear,
+        disabled,
+        allowCustomTagInput: false,
         metaTreeNode: resolvedMetaTreeNode,
         metaTree,
         style: stableProps.style
@@ -325,7 +333,7 @@ const VariableInputComponent = /* @__PURE__ */ __name(({
     {
       metaTree: resolvedMetaTree,
       value: innerValue,
-      active: (0, import_utils.isVariableValue)(innerValue),
+      active: isVariableActive,
       disabled,
       onChange: handleVariableSelect,
       parseValueToPath: resolvePathFromValue,

package/lib/components/variables/VariableTag.js

@@ -47,9 +47,12 @@ 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,
@@ -57,25 +60,23 @@ const VariableTagComponent = /* @__PURE__ */ __name(({
 }) => {
   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,27 +93,35 @@ 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 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 String(value);
+      if (!value) return { text: String(value), invalid: false };
       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);
+      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 ?? "") };
+      }
+      return { text: Array.isArray(rawPath) ? rawPath.join("/") : String(value), invalid: false };
     },
     { refreshDeps: [resolvedMetaTree, value, metaTreeNode] }
   );
@@ -129,12 +138,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 +184,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

@@ -87,6 +87,8 @@ export interface VariableInputProps {
 export interface VariableTagProps {
     value?: string;
     onClear?: () => void;
+    disabled?: boolean;
+    allowCustomTagInput?: boolean;
     className?: string;
     style?: React.CSSProperties;
     metaTreeNode?: MetaTreeNode | null;

package/lib/utils/dirtyAwareApiClient.js

@@ -31,8 +31,10 @@ __export(dirtyAwareApiClient_exports, {
   getDirtyAwareApiClient: () => getDirtyAwareApiClient
 });
 module.exports = __toCommonJS(dirtyAwareApiClient_exports);
+var import_sdk = require("@nocobase/sdk");
 var import_dataSourceDirty = require("./dataSourceDirty");
 const SKIP_DATA_SOURCE_DIRTY = "__nocobaseSkipDataSourceDirty";
+const DIRTY_DISPATCH_TOKEN = Symbol("nocobaseDirtyDispatchToken");
 const dirtyAwareApiClientCache = /* @__PURE__ */ new WeakMap();
 const dirtyAwareApiClientProxies = /* @__PURE__ */ new WeakSet();
 const MUTATING_RESOURCE_ACTIONS = [
@@ -288,6 +290,43 @@ function resolveDirtyResourceAction(options, context) {
   return parseDirtyResourceActionFromUrl(options == null ? void 0 : options.url, context);
 }
 __name(resolveDirtyResourceAction, "resolveDirtyResourceAction");
+function getDirtyResourceActionDispatchKey(dirtyResourceAction, headers) {
+  if (!dirtyResourceAction) {
+    return void 0;
+  }
+  return JSON.stringify([
+    dirtyResourceAction.dataSourceKey || (0, import_dataSourceDirty.getDataSourceKeyFromHeaders)(headers),
+    dirtyResourceAction.resourceName,
+    dirtyResourceAction.actionName
+  ]);
+}
+__name(getDirtyResourceActionDispatchKey, "getDirtyResourceActionDispatchKey");
+function getRequestDispatchKey(options, context) {
+  return getDirtyResourceActionDispatchKey(resolveDirtyResourceAction(options, context), options.headers);
+}
+__name(getRequestDispatchKey, "getRequestDispatchKey");
+function getResourceDispatchKey(name, of, headers) {
+  const resourceName = String(name ?? "").trim();
+  if (!resourceName) {
+    return void 0;
+  }
+  return JSON.stringify([resourceName, String(of ?? ""), (0, import_dataSourceDirty.getDataSourceKeyFromHeaders)(headers)]);
+}
+__name(getResourceDispatchKey, "getResourceDispatchKey");
+function getMatchingRequestToken(token, requestKey) {
+  if (!token || !requestKey || token.requestKey && token.requestKey !== requestKey) {
+    return void 0;
+  }
+  return token;
+}
+__name(getMatchingRequestToken, "getMatchingRequestToken");
+function getMatchingResourceToken(token, resourceKey) {
+  if (!token || !resourceKey || token.resourceKey && token.resourceKey !== resourceKey) {
+    return void 0;
+  }
+  return token;
+}
+__name(getMatchingResourceToken, "getMatchingResourceToken");
 function markResourceActionDataSourceDirty(context, dirtyResourceAction, headers) {
   (0, import_dataSourceDirty.markDataSourceDirty)({
     engine: context.engine,
@@ -297,7 +336,19 @@ function markResourceActionDataSourceDirty(context, dirtyResourceAction, headers
   });
 }
 __name(markResourceActionDataSourceDirty, "markResourceActionDataSourceDirty");
-function createDirtyAwareResource(context, resource, resourceName, resourceOf, headers) {
+function markResourceActionDataSourceDirtyOnce(token, context, dirtyResourceAction, headers) {
+  if (token.skip || token.marked || !dirtyResourceAction || !isMutatingResourceAction(dirtyResourceAction.actionName)) {
+    return;
+  }
+  token.marked = true;
+  markResourceActionDataSourceDirty(context, dirtyResourceAction, headers);
+}
+__name(markResourceActionDataSourceDirtyOnce, "markResourceActionDataSourceDirtyOnce");
+function isObjectRecord(value) {
+  return !!value && typeof value === "object";
+}
+__name(isObjectRecord, "isObjectRecord");
+function createDirtyAwareResource(context, resource, resourceName, resourceOf, headers, requestTokenStack, parentToken) {
   return new Proxy(resource, {
     get(target, prop, receiver) {
       const original = Reflect.get(target, prop, receiver);
@@ -306,10 +357,38 @@ function createDirtyAwareResource(context, resource, resourceName, resourceOf, h
       }
       const action = original;
       return async (...args) => {
-        const result = await action(...args);
+        const actionOptions = isObjectRecord(args[1]) ? args[1] : void 0;
         const dirtyResourceAction = resolveDirtyResourceActionFromResource(resourceName, resourceOf, prop, context);
-        if (dirtyResourceAction) {
-          markResourceActionDataSourceDirty(context, dirtyResourceAction, headers);
+        const requestKey = getDirtyResourceActionDispatchKey(dirtyResourceAction, headers);
+        const resourceKey = getResourceDispatchKey(resourceName, resourceOf, headers);
+        const inheritedToken = getMatchingRequestToken(
+          actionOptions == null ? void 0 : actionOptions[DIRTY_DISPATCH_TOKEN],
+          requestKey
+        ) || getMatchingRequestToken(parentToken, requestKey);
+        const token = inheritedToken || { marked: false, skip: false };
+        const ownsToken = !inheritedToken;
+        token.requestKey ||= requestKey;
+        token.resourceKey ||= resourceKey;
+        if (actionOptions == null ? void 0 : actionOptions[SKIP_DATA_SOURCE_DIRTY]) {
+          token.skip = true;
+        }
+        const forwardedArgs = actionOptions || args[1] == null ? [
+          args[0],
+          {
+            ...actionOptions,
+            [DIRTY_DISPATCH_TOKEN]: token
+          }
+        ] : args;
+        let actionResult;
+        requestTokenStack.push({ key: requestKey, token });
+        try {
+          actionResult = Reflect.apply(action, receiver, forwardedArgs);
+        } finally {
+          requestTokenStack.pop();
+        }
+        const result = await actionResult;
+        if (ownsToken) {
+          markResourceActionDataSourceDirtyOnce(token, context, dirtyResourceAction, headers);
         }
         return result;
       };
@@ -318,31 +397,206 @@ function createDirtyAwareResource(context, resource, resourceName, resourceOf, h
 }
 __name(createDirtyAwareResource, "createDirtyAwareResource");
 function createDirtyAwareApiClient(api, context) {
+  const baseResource = api.resource;
+  const baseRequest = api.request;
+  const shouldUseResourceDispatchReceiver = baseResource === import_sdk.APIClient.prototype.resource;
+  const shouldUseRequestDispatchReceiver = baseRequest === import_sdk.APIClient.prototype.request;
+  const resourceTokenStack = [];
+  const requestTokenStack = [];
+  let hasResourceOverride = false;
+  let resourceOverride;
+  let hasRequestOverride = false;
+  let requestOverride;
+  const getCurrentResource = /* @__PURE__ */ __name(() => hasResourceOverride ? resourceOverride : resource, "getCurrentResource");
+  const getCurrentRequest = /* @__PURE__ */ __name(() => hasRequestOverride ? requestOverride : request, "getCurrentRequest");
+  const dispatchResource = /* @__PURE__ */ __name((token, args) => {
+    const resourceKey = getResourceDispatchKey(args[0], args[1], args[2]);
+    const activeToken = getMatchingResourceToken(token, resourceKey);
+    const shouldWrapActions = !!activeToken && hasResourceOverride;
+    if (activeToken) {
+      activeToken.resourceKey ||= resourceKey;
+      resourceTokenStack.push({ key: resourceKey, token: activeToken });
+    }
+    try {
+      const resourceInstance = Reflect.apply(getCurrentResource(), proxy, args);
+      if (!shouldWrapActions || !activeToken) {
+        return resourceInstance;
+      }
+      return new Proxy(resourceInstance, {
+        get(target, prop, receiver) {
+          const original = Reflect.get(target, prop, receiver);
+          if (typeof prop !== "string" || typeof original !== "function" || !isMutatingResourceAction(prop)) {
+            return original;
+          }
+          const action = original;
+          return (...actionArgs) => {
+            const actionOptions = isObjectRecord(actionArgs[1]) ? actionArgs[1] : void 0;
+            const forwardedArgs = actionOptions || actionArgs[1] == null ? [
+              actionArgs[0],
+              {
+                ...actionOptions,
+                [DIRTY_DISPATCH_TOKEN]: activeToken
+              }
+            ] : actionArgs;
+            resourceTokenStack.push({ key: resourceKey, token: activeToken });
+            requestTokenStack.push({ key: activeToken.requestKey, token: activeToken });
+            try {
+              return Reflect.apply(action, receiver, forwardedArgs);
+            } finally {
+              requestTokenStack.pop();
+              resourceTokenStack.pop();
+            }
+          };
+        }
+      });
+    } finally {
+      if (activeToken) {
+        resourceTokenStack.pop();
+      }
+    }
+  }, "dispatchResource");
+  const createDispatchReceiver = /* @__PURE__ */ __name((token) => {
+    const receiver = Object.create(api);
+    Object.defineProperties(receiver, {
+      request: {
+        configurable: true,
+        value: /* @__PURE__ */ __name((config) => {
+          const options = config;
+          const requestKey = getRequestDispatchKey(options, context);
+          const stackFrame = requestTokenStack.at(-1);
+          const activeToken = getMatchingRequestToken(options == null ? void 0 : options[DIRTY_DISPATCH_TOKEN], requestKey) || (requestKey && (stackFrame == null ? void 0 : stackFrame.key) === requestKey ? stackFrame.token : void 0) || getMatchingRequestToken(token, requestKey);
+          const { [DIRTY_DISPATCH_TOKEN]: _dirtyDispatchToken, ...cleanOptions } = options;
+          const configWithToken = activeToken ? { ...cleanOptions, [DIRTY_DISPATCH_TOKEN]: activeToken } : cleanOptions;
+          if (activeToken) {
+            activeToken.requestKey ||= requestKey;
+            requestTokenStack.push({ key: requestKey, token: activeToken });
+          }
+          try {
+            return Reflect.apply(getCurrentRequest(), proxy, [configWithToken]);
+          } finally {
+            if (activeToken) {
+              requestTokenStack.pop();
+            }
+          }
+        }, "value")
+      },
+      resource: {
+        configurable: true,
+        value: /* @__PURE__ */ __name((...args) => {
+          const resourceKey = getResourceDispatchKey(args[0], args[1], args[2]);
+          const stackFrame = resourceTokenStack.at(-1);
+          const activeToken = getMatchingResourceToken(token, resourceKey) || (resourceKey && (stackFrame == null ? void 0 : stackFrame.key) === resourceKey ? stackFrame.token : void 0);
+          return dispatchResource(activeToken, args);
+        }, "value")
+      }
+    });
+    return receiver;
+  }, "createDispatchReceiver");
   const resource = /* @__PURE__ */ __name((name, of, headers, cancel) => {
-    const targetResource = api.resource(name, of, headers, cancel);
-    return createDirtyAwareResource(context, targetResource, name, of, headers);
+    const resourceKey = getResourceDispatchKey(name, of, headers);
+    const stackFrame = resourceTokenStack.at(-1);
+    const parentToken = resourceKey && (stackFrame == null ? void 0 : stackFrame.key) === resourceKey ? stackFrame.token : void 0;
+    const receiver = createDispatchReceiver(parentToken);
+    const resourceInstance = Reflect.apply(baseResource, shouldUseResourceDispatchReceiver ? receiver : api, [
+      name,
+      of,
+      headers,
+      cancel
+    ]);
+    return createDirtyAwareResource(context, resourceInstance, name, of, headers, requestTokenStack, parentToken);
   }, "resource");
   const request = /* @__PURE__ */ __name((config) => {
     const options = config;
+    const requestKey = getRequestDispatchKey(options, context);
+    const stackFrame = requestTokenStack.at(-1);
+    const inheritedToken = getMatchingRequestToken(options == null ? void 0 : options[DIRTY_DISPATCH_TOKEN], requestKey) || (requestKey && (stackFrame == null ? void 0 : stackFrame.key) === requestKey ? stackFrame.token : void 0);
+    const token = inheritedToken || { marked: false, skip: false };
+    const ownsToken = !inheritedToken;
+    token.requestKey ||= requestKey;
+    if (typeof options.resource === "string") {
+      token.resourceKey ||= getResourceDispatchKey(options.resource, options.resourceOf, options.headers);
+    }
     const skipDataSourceDirty = options == null ? void 0 : options[SKIP_DATA_SOURCE_DIRTY];
-    const dirtyResourceAction = skipDataSourceDirty ? void 0 : resolveDirtyResourceAction(options, context);
-    const { [SKIP_DATA_SOURCE_DIRTY]: _skipDataSourceDirty, ...cleanConfig } = options;
-    return api.request(cleanConfig).then((result) => {
-      if (dirtyResourceAction && isMutatingResourceAction(dirtyResourceAction.actionName)) {
-        markResourceActionDataSourceDirty(context, dirtyResourceAction, options.headers);
+    if (skipDataSourceDirty) {
+      token.skip = true;
+    }
+    const dirtyResourceAction = resolveDirtyResourceAction(options, context);
+    const {
+      [DIRTY_DISPATCH_TOKEN]: _dirtyDispatchToken,
+      [SKIP_DATA_SOURCE_DIRTY]: _skipDataSourceDirty,
+      ...cleanConfig
+    } = options;
+    const receiver = createDispatchReceiver(token);
+    return Reflect.apply(baseRequest, shouldUseRequestDispatchReceiver ? receiver : api, [cleanConfig]).then((result) => {
+      if (ownsToken) {
+        markResourceActionDataSourceDirtyOnce(token, context, dirtyResourceAction, options.headers);
       }
       return result;
     });
   }, "request");
+  const isLockedOwnProperty = /* @__PURE__ */ __name((target, prop) => {
+    const descriptor = Reflect.getOwnPropertyDescriptor(target, prop);
+    return !!descriptor && !descriptor.configurable;
+  }, "isLockedOwnProperty");
   const proxy = new Proxy(api, {
     get(target, prop, receiver) {
       if (prop === "resource") {
-        return resource;
+        if (isLockedOwnProperty(target, prop)) {
+          return Reflect.get(target, prop, receiver);
+        }
+        return hasResourceOverride ? resourceOverride : resource;
       }
       if (prop === "request") {
-        return request;
+        if (isLockedOwnProperty(target, prop)) {
+          return Reflect.get(target, prop, receiver);
+        }
+        return hasRequestOverride ? requestOverride : request;
       }
       return Reflect.get(target, prop, receiver);
+    },
+    set(target, prop, value, receiver) {
+      if (prop === "resource") {
+        const descriptor = Reflect.getOwnPropertyDescriptor(target, prop);
+        if (descriptor && (!descriptor.configurable || !Reflect.isExtensible(target))) {
+          return false;
+        }
+        hasResourceOverride = true;
+        resourceOverride = value;
+        return true;
+      }
+      if (prop === "request") {
+        const descriptor = Reflect.getOwnPropertyDescriptor(target, prop);
+        if (descriptor && (!descriptor.configurable || !Reflect.isExtensible(target))) {
+          return false;
+        }
+        hasRequestOverride = true;
+        requestOverride = value;
+        return true;
+      }
+      return Reflect.set(target, prop, value, receiver);
+    },
+    deleteProperty(target, prop) {
+      if (prop !== "resource" && prop !== "request") {
+        return Reflect.deleteProperty(target, prop);
+      }
+      const descriptor = Reflect.getOwnPropertyDescriptor(target, prop);
+      if (descriptor && (!descriptor.configurable || !Reflect.isExtensible(target))) {
+        return false;
+      }
+      if (prop === "resource") {
+        hasResourceOverride = false;
+        resourceOverride = void 0;
+      } else {
+        hasRequestOverride = false;
+        requestOverride = void 0;
+      }
+      return true;
+    },
+    defineProperty(target, prop, descriptor) {
+      if (prop === "resource" || prop === "request") {
+        return false;
+      }
+      return Reflect.defineProperty(target, prop, descriptor);
     }
   });
   dirtyAwareApiClientProxies.add(proxy);

package/package.json

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

package/src/components/variables/VariableInput.tsx

@@ -125,16 +125,19 @@ const VariableInputComponent: React.FC<VariableInputProps> = ({
     [onChange],
   );
 
+  const resolvedPath = useMemo(() => {
+    return resolvePathFromValue?.(innerValue);
+  }, [innerValue, resolvePathFromValue]);
+
   const resolvedMetaTreeNode = useMemo(() => {
     if (currentMetaTreeNode) return currentMetaTreeNode;
     if (Array.isArray(resolvedMetaTree)) {
-      const path = resolvePathFromValue?.(innerValue);
-      if (path) {
-        return findMetaTreeNodeByPath(resolvedMetaTree, path);
+      if (resolvedPath) {
+        return findMetaTreeNodeByPath(resolvedMetaTree, resolvedPath);
       }
     }
     return null;
-  }, [currentMetaTreeNode, innerValue, resolvedMetaTree, resolvePathFromValue]);
+  }, [currentMetaTreeNode, resolvedMetaTree, resolvedPath]);
 
   // 当 value 存在但 currentMetaTreeNode 还未恢复，尝试按路径逐级加载（支持 children 为函数的场景）
   useEffect(() => {
@@ -197,9 +200,31 @@ const VariableInputComponent: React.FC<VariableInputProps> = ({
   const ValueComponent = useMemo(() => {
     const Component = renderInputComponent?.(resolvedMetaTreeNode);
     const CustomComponent = resolvedMetaTreeNode?.render;
-    const finalComponent = isVariableValue(innerValue) ? VariableTag : Component || CustomComponent || Input;
+    // Some domains (workflow) persist variables as `{{$context...}}` rather than the core `{{ ctx... }}` form.
+    // Those values are not recognized by `isVariableValue`, but if the active converters can resolve them back to a
+    // real meta-tree path and that path maps to a plain variable node (not Constant / Null / RunJS), they should still
+    // render as the labelled pill instead of falling back to the raw input text.
+    const shouldRenderVariableTag =
+      isVariableValue(innerValue) ||
+      (Boolean(resolvedMetaTreeNode) &&
+        Array.isArray(resolvedPath) &&
+        resolvedPath.length > 0 &&
+        !Component &&
+        !CustomComponent);
+    const finalComponent = shouldRenderVariableTag ? VariableTag : Component || CustomComponent || Input;
     return finalComponent;
-  }, [renderInputComponent, resolvedMetaTreeNode, innerValue]);
+  }, [renderInputComponent, resolvedMetaTreeNode, innerValue, resolvedPath]);
+
+  const isVariableActive = useMemo(() => {
+    return (
+      isVariableValue(innerValue) ||
+      (Boolean(resolvedMetaTreeNode) &&
+        Array.isArray(resolvedPath) &&
+        resolvedPath.length > 0 &&
+        !renderInputComponent?.(resolvedMetaTreeNode) &&
+        !resolvedMetaTreeNode?.render)
+    );
+  }, [innerValue, renderInputComponent, resolvedMetaTreeNode, resolvedPath]);
 
   useEffect(() => {
     if (!resolvedMetaTreeNode) return;
@@ -303,6 +328,8 @@ const VariableInputComponent: React.FC<VariableInputProps> = ({
       return {
         ...baseProps,
         onClear: handleClear,
+        disabled,
+        allowCustomTagInput: false,
         metaTreeNode: resolvedMetaTreeNode,
         metaTree,
         style: stableProps.style,
@@ -356,7 +383,7 @@ const VariableInputComponent: React.FC<VariableInputProps> = ({
       <FlowContextSelector
         metaTree={resolvedMetaTree}
         value={innerValue}
-        active={isVariableValue(innerValue)}
+        active={isVariableActive}
         disabled={disabled}
         onChange={handleVariableSelect}
         parseValueToPath={resolvePathFromValue}