@nocobase/client-v2 2.1.0-alpha.45 → 2.1.0-alpha.47

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/client-v2",
-  "version": "2.1.0-alpha.45",
+  "version": "2.1.0-alpha.47",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.mjs",
@@ -27,11 +27,11 @@
     "@formily/antd-v5": "1.2.3",
     "@formily/react": "^2.2.27",
     "@formily/shared": "^2.2.27",
-    "@nocobase/evaluators": "2.1.0-alpha.45",
-    "@nocobase/flow-engine": "2.1.0-alpha.45",
-    "@nocobase/sdk": "2.1.0-alpha.45",
-    "@nocobase/shared": "2.1.0-alpha.45",
-    "@nocobase/utils": "2.1.0-alpha.45",
+    "@nocobase/evaluators": "2.1.0-alpha.47",
+    "@nocobase/flow-engine": "2.1.0-alpha.47",
+    "@nocobase/sdk": "2.1.0-alpha.47",
+    "@nocobase/shared": "2.1.0-alpha.47",
+    "@nocobase/utils": "2.1.0-alpha.47",
     "ahooks": "^3.7.2",
     "antd": "5.24.2",
     "antd-style": "3.7.1",
@@ -45,5 +45,5 @@
     "react-i18next": "^11.15.1",
     "react-router-dom": "^6.30.1"
   },
-  "gitHead": "e9e24987e12d0ad10a5db8815b1e1b7b447f1938"
+  "gitHead": "66196b57f9043ea0ac6ebdafbc732bfb98af1396"
 }

package/src/__tests__/browserChecker.test.ts

@@ -0,0 +1,103 @@
+/**
+ * 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 { readFileSync } from 'node:fs';
+import path from 'node:path';
+import vm from 'node:vm';
+import { fileURLToPath } from 'node:url';
+
+type BrowserCheckerCase = {
+  pathname: string;
+  publicPath: string;
+  expectedRedirect?: string;
+};
+
+const testDir = path.dirname(fileURLToPath(import.meta.url));
+const browserCheckerCases = [
+  {
+    label: 'v2 public browser-checker',
+    scriptPath: path.resolve(testDir, '../../../app/client-v2/public/browser-checker.js'),
+  },
+  {
+    label: 'v1 public browser-checker',
+    scriptPath: path.resolve(testDir, '../../../app/client/public/browser-checker.js'),
+  },
+] as const;
+
+function executeBrowserChecker(scriptPath: string, input: BrowserCheckerCase) {
+  const replace = vi.fn();
+  const consoleMock = {
+    debug: vi.fn(),
+    log: vi.fn(),
+  };
+  const context = {
+    showLog: false,
+    window: {
+      __nocobase_public_path__: input.publicPath,
+      location: {
+        origin: 'http://c.local.nocobase.com',
+        pathname: input.pathname,
+        search: '',
+        hash: '',
+        replace,
+      },
+      console: consoleMock,
+      outerWidth: 1280,
+      outerHeight: 720,
+      devicePixelRatio: 1,
+      onresize: undefined,
+    },
+    document: {
+      documentElement: {
+        className: '',
+        clientWidth: 1280,
+        clientHeight: 720,
+      },
+    },
+    navigator: {
+      userAgent: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 14_0) AppleWebKit/537.36 Chrome/126.0 Safari/537.36',
+    },
+    console: consoleMock,
+  };
+
+  vm.runInNewContext(readFileSync(scriptPath, 'utf8'), context, {
+    filename: scriptPath,
+  });
+
+  return replace;
+}
+
+describe.each(browserCheckerCases)('$label', ({ scriptPath }) => {
+  it('normalizes a relative public path before redirecting to the trailing-slash entry', () => {
+    const replace = executeBrowserChecker(scriptPath, {
+      pathname: '/nocobase/v',
+      publicPath: 'nocobase/v/',
+    });
+
+    expect(replace).toHaveBeenCalledWith('http://c.local.nocobase.com/nocobase/v/');
+  });
+
+  it('prefixes outside paths with a root-relative basename instead of duplicating a relative segment', () => {
+    const replace = executeBrowserChecker(scriptPath, {
+      pathname: '/foo',
+      publicPath: 'nocobase/v/',
+    });
+
+    expect(replace).toHaveBeenCalledWith('http://c.local.nocobase.com/nocobase/v/foo');
+  });
+
+  it('does not redirect when the current path is already under the normalized basename', () => {
+    const replace = executeBrowserChecker(scriptPath, {
+      pathname: '/nocobase/v/',
+      publicPath: 'nocobase/v/',
+    });
+
+    expect(replace).not.toHaveBeenCalled();
+  });
+});

package/src/__tests__/dataSourceRuntime.test.tsx

@@ -7,7 +7,7 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { createMockClient } from '@nocobase/client-v2';
+import { CollectionFieldInterface, createMockClient } from '@nocobase/client-v2';
 import { describe, expect, it } from 'vitest';
 
 class InputInterface {
@@ -16,6 +16,12 @@ class InputInterface {
   titleUsable = true;
 }
 
+class OperatorOnlyInterface extends CollectionFieldInterface {
+  name = 'operatorOnly';
+  group = 'basic';
+  filterable = {};
+}
+
 describe('data source runtime', () => {
   it('shares one dataSourceManager instance between app and flow context', () => {
     const app = createMockClient();
@@ -31,4 +37,19 @@ describe('data source runtime', () => {
 
     expect(app.dataSourceManager.collectionFieldInterfaceManager.getFieldInterface('input')?.titleUsable).toBe(true);
   });
+
+  it('exposes operators registered on interfaces without predefined operator lists', () => {
+    const app = createMockClient();
+    const operator = {
+      label: 'plugin operator',
+      value: '$plugin',
+      schema: { 'x-component': 'PluginInput' },
+    };
+
+    app.addFieldInterfaces([OperatorOnlyInterface as any]);
+    app.addFieldInterfaceOperator('operatorOnly', operator);
+
+    const fieldInterface = app.dataSourceManager.collectionFieldInterfaceManager.getFieldInterface('operatorOnly');
+    expect(fieldInterface?.filterable?.operators).toEqual([operator]);
+  });
 });

package/src/__tests__/nocobase-buildin-plugin-auth.test.tsx

@@ -26,6 +26,10 @@ describe('nocobase buildin plugin auth redirect', () => {
   const originalLocation = globalThis.window.location;
 
   beforeEach(() => {
+    // These fixtures mount the modern client under the `v2` segment; tell the
+    // runtime-prefix helper so v2-runtime detection matches (server injects it
+    // in production).
+    (globalThis.window as any).__nocobase_modern_client_prefix__ = 'v2';
     Object.defineProperty(globalThis.window, 'matchMedia', {
       configurable: true,
       value: vi.fn().mockImplementation((query: string) => ({
@@ -42,6 +46,7 @@ describe('nocobase buildin plugin auth redirect', () => {
   });
 
   afterEach(() => {
+    delete (globalThis.window as any).__nocobase_modern_client_prefix__;
     Object.defineProperty(globalThis.window, 'location', {
       configurable: true,
       value: originalLocation,

package/src/authRedirect.ts

@@ -113,6 +113,49 @@ function getV2BasePath(app: AppLike) {
   return trimTrailingSlashes(getV2PublicPath(app)) || '/';
 }
 
+type ModernClientWindow = {
+  __nocobase_modern_client_prefix__?: string;
+  __nocobase_public_path__?: string;
+};
+
+function getModernClientWindow(): ModernClientWindow | undefined {
+  return typeof window !== 'undefined' ? (window as unknown as ModernClientWindow) : undefined;
+}
+
+/**
+ * The runtime URL segment under which the modern (v2) client is served.
+ * Injected by the server as `window.__nocobase_modern_client_prefix__`. Falls
+ * back to the trailing segment of `window.__nocobase_public_path__`, then to
+ * the default `v`. Returns a bare segment (no slashes).
+ */
+export function getModernClientPrefix(): string {
+  const win = getModernClientWindow();
+  const fromWindow = win?.__nocobase_modern_client_prefix__;
+  if (typeof fromWindow === 'string' && fromWindow.trim()) {
+    return trimLeadingSlashes(trimTrailingSlashes(fromWindow.trim()));
+  }
+  const publicPath = win?.__nocobase_public_path__;
+  if (typeof publicPath === 'string' && publicPath.trim()) {
+    const segments = trimTrailingSlashes(publicPath.trim()).split('/');
+    const last = segments[segments.length - 1];
+    if (last) {
+      return last;
+    }
+  }
+  return 'v';
+}
+
+/**
+ * Strip the trailing modern-client prefix segment from a public path,
+ * recovering the app root public path (e.g. `/nocobase/v/` -> `/nocobase/`).
+ */
+export function stripModernClientPrefix(publicPath?: string): string {
+  const normalized = normalizePublicPath(publicPath);
+  const prefix = getModernClientPrefix();
+  const suffixPattern = new RegExp(`/${escapeRegExp(prefix)}/?$`);
+  return normalizePublicPath(normalized.replace(suffixPattern, '/'));
+}
+
 export function getV2EffectiveBasePath(app: AppLike): string {
   const basename = app.router?.getBasename?.();
   if (basename) {

package/src/collection-field-interface/CollectionFieldInterface.ts

@@ -14,7 +14,6 @@ import type { ComponentType, ReactNode } from 'react';
 
 import {
   normalizeFilterableOperators,
-  resolveFilterOperators,
   type FieldFilterable,
   type FieldFilterOperator,
 } from '../collection-manager/filter-operators';
@@ -181,14 +180,22 @@ export abstract class CollectionFieldInterface {
   }
 
   addOperator(operatorOption: FieldFilterOperator) {
-    normalizeFilterableOperators(this.filterable);
-    const operators = [...resolveFilterOperators(this.filterable?.operators)];
-    set(this, 'filterable.operators', operators);
+    if (!this.filterable) {
+      set(this, 'filterable', {});
+    }
 
-    if (operators.find((item) => item.value === operatorOption.value)) {
-      return;
+    const operatorOverrides = Array.isArray(this.filterable.operatorOverrides)
+      ? [...this.filterable.operatorOverrides]
+      : [];
+
+    const existingIndex = operatorOverrides.findIndex((item) => item.value === operatorOption.value);
+    if (existingIndex !== -1) {
+      operatorOverrides[existingIndex] = operatorOption;
+    } else {
+      operatorOverrides.push(operatorOption);
     }
 
-    operators.push(operatorOption);
+    set(this, 'filterable.operatorOverrides', operatorOverrides);
+    normalizeFilterableOperators(this.filterable);
   }
 }

package/src/collection-manager/filter-operators/index.ts

@@ -23,6 +23,7 @@ export type FieldFilterOperatorList<TMeta = unknown> = FieldFilterOperator<TMeta
 export type FieldFilterable<TMeta = unknown> = {
   operators?: FieldFilterOperatorList<TMeta>;
   operatorGroup?: string;
+  operatorOverrides?: FieldFilterOperator<TMeta>[];
   children?: unknown[];
   nested?: boolean;
   [key: string]: unknown;
@@ -120,14 +121,20 @@ export function normalizeFilterableOperators<TMeta = unknown>(filterable?: Field
     return filterable;
   }
 
+  const operatorOverrides = Array.isArray(filterable.operatorOverrides) ? filterable.operatorOverrides : [];
+
   if (filterable.operatorGroup) {
-    filterable.operators = resolveFilterOperators(filterable.operatorGroup);
+    filterable.operators = mergeOperatorOverrides(resolveFilterOperators(filterable.operatorGroup), operatorOverrides);
   }
 
   const rawOperators = (filterable as { operators?: unknown }).operators;
   if (typeof rawOperators === 'string') {
     filterable.operatorGroup = rawOperators;
-    filterable.operators = resolveFilterOperators(rawOperators);
+    filterable.operators = mergeOperatorOverrides(resolveFilterOperators(rawOperators), operatorOverrides);
+  } else if (Array.isArray(rawOperators)) {
+    filterable.operators = mergeOperatorOverrides(rawOperators, operatorOverrides);
+  } else if (operatorOverrides.length > 0) {
+    filterable.operators = [...operatorOverrides];
   }
 
   if (Array.isArray(filterable.children)) {
@@ -141,6 +148,26 @@ export function normalizeFilterableOperators<TMeta = unknown>(filterable?: Field
   return filterable;
 }
 
+function mergeOperatorOverrides<TMeta = unknown>(
+  operators: FieldFilterOperator<TMeta>[] = [],
+  operatorOverrides: FieldFilterOperator<TMeta>[] = [],
+) {
+  if (operatorOverrides.length === 0) {
+    return operators;
+  }
+
+  const result = [...operators];
+  operatorOverrides.forEach((operatorOverride) => {
+    const existingIndex = result.findIndex((item) => item.value === operatorOverride.value);
+    if (existingIndex === -1) {
+      result.push(operatorOverride);
+    } else {
+      result[existingIndex] = operatorOverride;
+    }
+  });
+  return result;
+}
+
 export function createFilterable<TPreset extends FieldFilterOperatorGroupName>(
   preset: TPreset,
   options: Omit<FieldFilterable, 'operators'> = {},

package/src/components/README.md

@@ -169,6 +169,54 @@ Key props:
 
 Under the hood `VariableInput` wraps `VariableHybridInput` (inline pills), `VariableTextArea` wraps `TextAreaWithContextSelector` (textarea + variable button). Both share the same MetaTree.
 
+#### TypedVariableInput
+
+Typed-constant + variable hybrid input. Ported from v1 `Variable.Input`'s `useTypedConstant` pattern: an italic `x` button on the right triggers a Cascader switcher `[Null | Constant<types> | Variable<…namespaces>]`; the left side renders the matching editor (`Input` / `InputNumber` / `Select(True/False)` / `DatePicker`) or a pill carrying the variable path.
+
+Reach for this when a field **accepts both** a typed literal **and** a variable reference. The canonical example is `plugin-notification-email`'s SMTP `port` and `secure` fields: users can type a numeric port / boolean flag, or pass `{{ $env.SMTP_PORT }}` to read from environment variables.
+
+```tsx
+import { TypedVariableInput } from '@nocobase/client-v2';
+
+// Port — numeric constant + $env variable
+<Form.Item name={['options', 'port']} label={t('Port')} initialValue={465}>
+  <TypedVariableInput
+    types={[['number', { min: 1, max: 65535, step: 1 }]]}
+    namespaces={['$env']}
+  />
+</Form.Item>
+
+// Secure mode — boolean constant + $env variable
+<Form.Item name={['options', 'secure']} label={t('Secure')} initialValue={true}>
+  <TypedVariableInput types={['boolean']} namespaces={['$env']} />
+</Form.Item>
+```
+
+Key props:
+
+- `types`: allowed constant types. Shape mirrors v1 `useTypedConstant` — pass bare type names (`['number', 'boolean']`) or `[type, editorProps]` tuples (`[['number', { min, max, step }]]`) to forward props to the underlying antd editor. Defaults to `['string', 'number', 'boolean', 'date']`. **Even when only one type is allowed, the `Constant` entry still expands into a typed submenu** (Number / Boolean / Date / String) — matches v1 so users can see what type the constant is
+- `namespaces`: restrict the variable picker to specific top-level namespaces (e.g. `['$env']`). Omit to expose every namespace registered on `flowEngine.context`
+- `extraNodes`: static leaves appended after the namespace-filtered nodes
+- `nullable`: whether to expose the `Null` switcher entry. Default `true`. Combined with `Form.Item.rules={[{ required: true }]}`, the user can explicitly clear the field but submission is still blocked by validation — mirrors v1's "Null + required" pairing
+- `delimiters`: variable-token delimiters, default `['{{', '}}']` — same as `VariableInput`
+- `value` / `onChange` / `placeholder` / `disabled` / `style` / `className`: standard controlled-input props
+
+Value shape:
+
+- Constant: stored as the native type (`number` / `boolean` / `Date` / `string`)
+- Variable: a string like `'{{ $env.SMTP_PORT }}'`
+- Null: `null`
+
+When **not** to use it:
+
+- **Pure literal fields** (users will never pass a variable) → use the antd primitive directly (`InputNumber` / `Select` / `DatePicker` / `Input`) and skip the Cascader column overhead
+- **Pure variable fields** (users will never pass a literal) → use `EnvVariableInput` (`$env`-only, with optional password masking) or `VariableInput` (general-purpose)
+
+Capabilities skipped (present in v1, not yet ported to v2):
+
+- `object` constant type (JSON editor) — v2 has no inline "JSON editor + Cascader switcher" yet; add when there's a concrete caller
+- Async `loadChildren` cascading — most MetaTree namespaces are already eagerly resolved by `useFilteredMetaTree`, so this hasn't been needed
+
 #### FileSizeInput
 
 A byte-valued size input paired with a unit selector (Byte / KB / MB / GB). The persisted value is always in bytes; the displayed number is derived from the picked unit.

package/src/components/README.zh-CN.md

@@ -169,6 +169,54 @@ import { VariableInput, VariableTextArea } from '@nocobase/client-v2';
 
 底层共用 `VariableHybridInput`（`VariableInput`）和 `TextAreaWithContextSelector`（`VariableTextArea`），用同一套 MetaTree 数据。
 
+#### TypedVariableInput
+
+类型化常量 + 变量混合输入器。移植 v1 `Variable.Input` 的 `useTypedConstant` 形态：右侧斜体 `x` 按钮触发 Cascader 切换 `[空值 | 常量<types> | 变量和密钥<…namespaces>]`，左侧根据当前模式渲染对应编辑器（`Input` / `InputNumber` / `Select(True/False)` / `DatePicker`）或一颗带变量路径的 pill。
+
+用于字段**同时接受**字面量**和**变量引用的场景。最典型的就是 `plugin-notification-email` 的 SMTP `port` 和 `secure`：可以填具体数字 / 布尔值，也可以填 `{{ $env.SMTP_PORT }}` 走环境变量。
+
+```tsx
+import { TypedVariableInput } from '@nocobase/client-v2';
+
+// 端口：数字常量 + $env 变量
+<Form.Item name={['options', 'port']} label={t('端口')} initialValue={465}>
+  <TypedVariableInput
+    types={[['number', { min: 1, max: 65535, step: 1 }]]}
+    namespaces={['$env']}
+  />
+</Form.Item>
+
+// 安全模式：布尔常量 + $env 变量
+<Form.Item name={['options', 'secure']} label={t('安全模式')} initialValue={true}>
+  <TypedVariableInput types={['boolean']} namespaces={['$env']} />
+</Form.Item>
+```
+
+主要属性：
+
+- `types`：允许的常量类型。形态对齐 v1 `useTypedConstant`，可以传裸类型名 `['number', 'boolean']`，也可以传 `[type, editorProps]` 元组 `[['number', { min, max, step }]]` 把 props 透传给底层 antd 编辑器。默认 `['string', 'number', 'boolean', 'date']`。**即使只允许一种类型，「常量」入口也会展开二级菜单**（数字 / 逻辑值 / 日期 / 字符串）——跟 v1 一致，让用户能直观看到当前常量是什么类型
+- `namespaces`：限定变量 picker 可选的顶层命名空间（如 `['$env']`）。不传就用 `flowEngine.context` 里所有已注册命名空间
+- `extraNodes`：在命名空间过滤后追加几条静态变量节点
+- `nullable`：是否暴露「空值」入口，默认 `true`。配合 `Form.Item.rules={[{ required: true }]}` 可以让用户能手动清空、但提交时会被校验拦截——跟 v1 的「空值 + required」组合一致
+- `delimiters`：变量 token 开闭分隔符，默认 `['{{', '}}']`，跟 `VariableInput` 一致
+- `value` / `onChange` / `placeholder` / `disabled` / `style` / `className`：标准受控字段属性
+
+值的形态：
+
+- 常量：原生类型直接存（`number` / `boolean` / `Date` / `string`）
+- 变量：字符串 `'{{ $env.SMTP_PORT }}'`
+- 空值：`null`
+
+什么时候**不该用**：
+
+- **纯字面量字段**（用户不会想填变量）→ 直接用 antd `InputNumber` / `Select` / `DatePicker` / `Input`，省掉 Cascader 那一格的视觉开销
+- **纯变量字段**（用户不会想填字面量）→ 用 `EnvVariableInput`（`$env` 专用，带 password mask）或 `VariableInput`（更通用）
+
+跳过的能力（v1 有但 v2 还没补）：
+
+- `object` 类型（JSON 编辑器）——v2 还没对应的「内联 JSON 编辑器 + Cascader 切换」组件，等真有需求再补
+- 异步 `loadChildren` 分支——大多数命名空间的 MetaTree 已经由 `useFilteredMetaTree` 提前展平，没遇到刚需
+
 #### FileSizeInput
 
 文件大小输入器。值统一存字节数，UI 上配一个单位选择器（Byte / KB / MB / GB）。