@nocobase/client-v2 2.2.0-beta.5 → 2.2.0-beta.7

package/src/flow/models/blocks/table/__tests__/TableActionsColumnModel.test.tsx

@@ -19,11 +19,16 @@ const capturedDroppableUids: string[] = [];
 const capturedRendererProps: any[] = [];
 let latestOnDragEnd: ((event: any) => void) | undefined;
 const capturedDndProviders: Array<{ persist: boolean }> = [];
+const capturedAddSubModelButtonProps: any[] = [];
 
 vi.mock('@nocobase/flow-engine', async () => {
   const actual = await vi.importActual<any>('@nocobase/flow-engine');
   return {
     ...actual,
+    AddSubModelButton: (props) => {
+      capturedAddSubModelButtonProps.push(props);
+      return <button data-testid="add-sub-model-button">{props.children}</button>;
+    },
     DndProvider: ({ children, onDragEnd, persist = true, ...restProps }) => {
       const engine = actual.useFlowEngine();
       const handleDragEnd = (event: any) => {
@@ -50,6 +55,17 @@ vi.mock('@nocobase/flow-engine', async () => {
       const ActualFlowModelRenderer = actual.FlowModelRenderer;
       return <ActualFlowModelRenderer {...props} />;
     },
+    FlowsFloatContextMenu: ({ children, extraToolbarItems = [], model }) => {
+      return (
+        <div data-test-flow-context-menu>
+          {children}
+          {extraToolbarItems.map((item) => {
+            const Component = item.component;
+            return <Component key={item.key} model={model} />;
+          })}
+        </div>
+      );
+    },
   };
 });
 
@@ -165,6 +181,7 @@ describe('TableActionsColumnModel: drag integration', () => {
     capturedDroppableUids.length = 0;
     capturedRendererProps.length = 0;
     capturedDndProviders.length = 0;
+    capturedAddSubModelButtonProps.length = 0;
     latestOnDragEnd = undefined;
   });
 
@@ -177,6 +194,7 @@ describe('TableActionsColumnModel: drag integration', () => {
       props: { width: 200, title: 'Actions' },
       subModels: { actions: [{ use: 'TestViewActionModel' }, { use: 'TestViewActionModel' }] },
     });
+    actionsCol.context.defineMethod('getModelClassName', (className: string) => className);
 
     const colProps = actionsCol.getColumnProps();
     const record = { id: 1, phone: '000000' } as any;
@@ -279,4 +297,40 @@ describe('TableActionsColumnModel: drag integration', () => {
 
     expect(moveModelSpy).toHaveBeenCalledWith(firstUid, secondUid, { persist: true });
   });
+
+  it('disables icon-only mode when adding row actions without icons', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({ TableActionsColumnModel, TestViewActionModel });
+
+    const actionsCol = engine.createModel<TableActionsColumnModel>({
+      use: 'TableActionsColumnModel',
+      props: { width: 200, title: 'Actions' },
+    });
+    actionsCol.context.defineMethod('getModelClassName', (className: string) => className);
+
+    render(
+      <FlowEngineProvider engine={engine}>
+        <ConfigProvider>
+          <App>{actionsCol.getColumnProps().title as React.ReactNode}</App>
+        </ConfigProvider>
+      </FlowEngineProvider>,
+    );
+
+    const addButtonProps = capturedAddSubModelButtonProps.find(
+      (props) => props.subModelKey === 'actions' && props.subModelBaseClass === 'RecordActionGroupModel',
+    );
+    expect(addButtonProps).toBeDefined();
+    expect(addButtonProps.afterSubModelInit).toBeTypeOf('function');
+
+    const actionModel = {
+      setStepParams: vi.fn(),
+    };
+    await addButtonProps.afterSubModelInit(actionModel);
+
+    expect(actionModel.setStepParams).toHaveBeenCalledWith('buttonSettings', 'general', {
+      type: 'link',
+      icon: null,
+      iconOnly: false,
+    });
+  });
 });

package/src/flow/models/blocks/table/__tests__/TableBlockModel.mobileSettingsButtons.test.tsx

@@ -0,0 +1,78 @@
+/**
+ * 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 { FlowEngine } from '@nocobase/flow-engine';
+import '@nocobase/client';
+import React from 'react';
+import { describe, expect, it } from 'vitest';
+import { TableBlockModel } from '../TableBlockModel';
+
+function createTableModel(options: { isMobileLayout?: boolean; flowSettingsEnabled?: boolean } = {}) {
+  const engine = new FlowEngine();
+  engine.registerModels({ TableBlockModel });
+  engine.context.defineProperty('isMobileLayout', { value: !!options.isMobileLayout });
+  engine.context.defineProperty('flowSettingsEnabled', { value: !!options.flowSettingsEnabled });
+
+  const ds = engine.dataSourceManager.getDataSource('main');
+  ds.addCollection({
+    name: 'posts',
+    filterTargetKey: 'id',
+    fields: [
+      { name: 'id', type: 'integer', interface: 'number' },
+      { name: 'title', type: 'string', interface: 'input' },
+    ],
+  });
+
+  return engine.createModel<TableBlockModel>({
+    uid: `posts-table-${options.isMobileLayout ? 'mobile' : 'desktop'}`,
+    use: 'TableBlockModel',
+    stepParams: {
+      resourceSettings: {
+        init: {
+          dataSourceKey: 'main',
+          collectionName: 'posts',
+        },
+      },
+    },
+  });
+}
+
+function getSettingsButton(element: React.ReactElement) {
+  return element.props.children as React.ReactElement;
+}
+
+describe('TableBlockModel mobile settings buttons', () => {
+  it('renders table actions and fields settings as icon-only buttons in mobile layouts', () => {
+    const model = createTableModel({ isMobileLayout: true, flowSettingsEnabled: true });
+    const actionButton = getSettingsButton(model.renderConfigureActions() as React.ReactElement);
+    const addColumn = model.getColumns().find((column) => column.key === 'addColumn');
+    const fieldsButton = getSettingsButton(
+      (addColumn?.title as React.ReactElement).type({ model }) as React.ReactElement,
+    );
+
+    expect(actionButton.props.children).toBeNull();
+    expect(actionButton.props['aria-label']).toBe('Actions');
+    expect(fieldsButton.props.children).toBeNull();
+    expect(fieldsButton.props['aria-label']).toBe('Fields');
+    expect(addColumn?.width).toBeUndefined();
+  });
+
+  it('keeps table actions and fields settings labels outside mobile layouts', () => {
+    const model = createTableModel({ flowSettingsEnabled: true });
+    const actionButton = getSettingsButton(model.renderConfigureActions() as React.ReactElement);
+    const addColumn = model.getColumns().find((column) => column.key === 'addColumn');
+    const fieldsButton = getSettingsButton(
+      (addColumn?.title as React.ReactElement).type({ model }) as React.ReactElement,
+    );
+
+    expect(actionButton.props.children).toBe('Actions');
+    expect(fieldsButton.props.children).toBe('Fields');
+    expect(addColumn?.width).toBe(100);
+  });
+});

package/src/flow/models/fields/AssociationFieldModel/AssociationFieldModel.tsx

@@ -11,7 +11,7 @@ import { FormItemModel } from '../../blocks/form/FormItemModel';
 import { FieldModel } from '../../base/FieldModel';
 export class AssociationFieldModel extends FieldModel {
   operator = '$eq';
-  updateAssociation = true;
+  updateAssociation = false;
 }
 
 AssociationFieldModel.registerFlow({

package/src/flow/models/fields/AssociationFieldModel/PopupSubTableFieldModel/PopupSubTableFieldModel.tsx

@@ -203,6 +203,8 @@ const DisplayTable = (props) => {
     onSelectExitRecordClick,
     resetPage,
     allowCreate,
+    formValuesChangeEmitter,
+    onResetFieldValue,
   } = props;
   const [currentPage, setCurrentPage] = useState(1);
   const [currentPageSize, setCurrentPageSize] = useState(pageSize);
@@ -223,6 +225,18 @@ const DisplayTable = (props) => {
     resetPage && setCurrentPage(1);
   }, [resetPage]);
 
+  useEffect(() => {
+    if (!formValuesChangeEmitter?.on || !formValuesChangeEmitter?.off || !onResetFieldValue) return;
+    const listener = () => {
+      onResetFieldValue();
+      setTableData([]);
+    };
+    formValuesChangeEmitter.on('onFieldReset', listener);
+    return () => {
+      formValuesChangeEmitter.off('onFieldReset', listener);
+    };
+  }, [formValuesChangeEmitter, onResetFieldValue]);
+
   const pagination = useMemo(() => {
     return {
       current: currentPage, // 当前页码
@@ -237,7 +251,7 @@ const DisplayTable = (props) => {
         return t('Total {{count}} items', { count: total });
       },
     } as any;
-  }, [currentPage, currentPageSize, tableData]);
+  }, [currentPage, currentPageSize, tableData, t]);
 
   const columns = useMemo(() => {
     const cols = adjustColumnOrder(
@@ -421,10 +435,6 @@ export class PopupSubTableFieldModel extends AssociationFieldModel {
           currentPageSize,
         });
       };
-      // 监听表单reset
-      this.context.blockModel.emitter.on('onFieldReset', () => {
-        this.props?.onChange([]);
-      });
     }
   }
 
@@ -457,8 +467,21 @@ export class PopupSubTableFieldModel extends AssociationFieldModel {
   }
 
   public render() {
+    const fieldPathArray = this.context.fieldPathArray ?? this.parent?.context?.fieldPathArray;
+    const onResetFieldValue = () => {
+      const value = [];
+      this.setProps({ value });
+      this.context.blockModel?.setFieldValue?.(fieldPathArray, value);
+    };
     return (
-      <DisplayTable {...this.props} collection={this.collection} baseColumns={this.getBaseColumns(this)} model={this} />
+      <DisplayTable
+        {...this.props}
+        collection={this.collection}
+        baseColumns={this.getBaseColumns(this)}
+        model={this}
+        formValuesChangeEmitter={this.context.blockModel?.emitter}
+        onResetFieldValue={onResetFieldValue}
+      />
     );
   }
 }

package/src/flow/models/fields/AssociationFieldModel/SubTableFieldModel/SubTableField.tsx

@@ -70,6 +70,7 @@ export function SubTableField(props) {
     getCurrentValue,
     fieldPathArray,
     formValuesChangeEmitter,
+    onResetFieldValue,
   } = props;
   const [currentPage, setCurrentPage] = useState(1);
   const [currentPageSize, setCurrentPageSize] = useState(pageSize);
@@ -97,6 +98,17 @@ export function SubTableField(props) {
       formValuesChangeEmitter.off('formValuesChange', listener);
     };
   }, [fieldPathArray, formValuesChangeEmitter]);
+  useEffect(() => {
+    if (!formValuesChangeEmitter?.on || !formValuesChangeEmitter?.off || !onResetFieldValue) return;
+    const listener = () => {
+      onResetFieldValue();
+      forceRefresh((v) => v + 1);
+    };
+    formValuesChangeEmitter.on('onFieldReset', listener);
+    return () => {
+      formValuesChangeEmitter.off('onFieldReset', listener);
+    };
+  }, [formValuesChangeEmitter, onResetFieldValue]);
   const applyValue = React.useCallback((nextValue: any) => onChange?.(normalizeSubTableRows(nextValue)), [onChange]);
   const getLatestValue = React.useCallback(() => normalizeSubTableRows(getCurrentValue()), [getCurrentValue]);
   useEffect(() => {
@@ -125,7 +137,7 @@ export function SubTableField(props) {
         return t('Total {{count}} items', { count: total });
       },
     } as any;
-  }, [currentPage, currentPageSize, currentValue.length]);
+  }, [currentPage, currentPageSize, currentValue.length, t]);
 
   // 新增一行
   const handleAdd = () => {

package/src/flow/models/fields/AssociationFieldModel/SubTableFieldModel/__tests__/SubTableFieldModel.reset.test.ts

@@ -0,0 +1,180 @@
+/**
+ * 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 React from 'react';
+import { act, render } from '@nocobase/test/client';
+import { FlowEngine, type FlowModel } from '@nocobase/flow-engine';
+import { describe, expect, it, vi } from 'vitest';
+import { PopupSubTableFieldModel } from '../../PopupSubTableFieldModel';
+import { SubTableFieldModel } from '..';
+
+vi.mock('react-i18next', async (importOriginal) => ({
+  ...(await importOriginal<any>()),
+  useTranslation: () => ({
+    t: (value: string) => value,
+  }),
+}));
+
+vi.mock('antd', async () => {
+  const actual = await vi.importActual<any>('antd');
+  return {
+    ...actual,
+    Table: ({ dataSource = [], columns = [] }: any) =>
+      React.createElement(
+        'div',
+        { 'data-testid': 'subtable' },
+        dataSource.map((record: any, rowIdx: number) =>
+          React.createElement(
+            'div',
+            { 'data-testid': `row-${rowIdx}`, key: record.__index__ || rowIdx },
+            columns.map((column: any) =>
+              React.createElement(
+                'div',
+                { 'data-testid': `cell-${rowIdx}-${String(column.dataIndex || column.key)}`, key: column.key },
+                column.render?.(record[column.dataIndex], record, rowIdx),
+              ),
+            ),
+          ),
+        ),
+      ),
+  };
+});
+
+function createSubTableFieldModel(props: Record<string, unknown> = {}) {
+  const engine = new FlowEngine();
+  engine.registerModels({ SubTableFieldModel });
+  const setFieldValue = vi.fn();
+
+  const blockModel = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'form-block',
+  });
+  (blockModel as FlowModel & { setFieldValue: typeof setFieldValue }).setFieldValue = setFieldValue;
+  const parent = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'form-item',
+  });
+
+  parent.context.defineProperty('blockModel', { value: blockModel });
+  parent.context.defineProperty('collectionField', {
+    value: {
+      target: 'roles',
+      targetCollection: {
+        filterTargetKey: 'id',
+      },
+    },
+  });
+  parent.context.defineProperty('fieldPathArray', { value: ['roles'] });
+
+  const model = engine.createModel<SubTableFieldModel>({
+    use: 'SubTableFieldModel',
+    uid: 'roles-subtable',
+    parentId: parent.uid,
+    props,
+  });
+
+  return { blockModel, model, setFieldValue };
+}
+
+async function createPopupSubTableFieldModel(props: Record<string, unknown> = {}) {
+  const engine = new FlowEngine();
+  engine.registerModels({ PopupSubTableFieldModel });
+  const setFieldValue = vi.fn();
+
+  const blockModel = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'popup-form-block',
+  });
+  (blockModel as FlowModel & { setFieldValue: typeof setFieldValue }).setFieldValue = setFieldValue;
+  const parent = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'popup-form-item',
+  });
+
+  parent.context.defineProperty('blockModel', { value: blockModel });
+  parent.context.defineProperty('collectionField', {
+    value: {
+      target: 'roles',
+      targetCollection: {
+        filterTargetKey: 'id',
+      },
+    },
+  });
+  parent.context.defineProperty('fieldPathArray', { value: ['roles'] });
+
+  const model = engine.createModel<PopupSubTableFieldModel>({
+    use: 'PopupSubTableFieldModel',
+    uid: 'roles-popup-subtable',
+    parentId: parent.uid,
+    props,
+  });
+  (model.subModels as Record<string, unknown>).subTableColumns = [];
+  await model.onDispatchEventStart('beforeRender');
+
+  return { blockModel, model, setFieldValue };
+}
+
+describe('SubTable field reset', () => {
+  it('resets the rendered fork through its own form field path', () => {
+    const onChange = vi.fn();
+    const { blockModel, model, setFieldValue } = createSubTableFieldModel({
+      onChange,
+      value: [{ id: 1 }],
+    });
+    const fork = model.createFork({ value: [{ id: 1 }] }, 'orders.0.lines');
+    fork.context.defineProperty('fieldPathArray', { value: ['orders', 0, 'lines'] });
+
+    render(React.createElement(React.Fragment, null, fork.render()));
+
+    act(() => {
+      blockModel.emitter.emit('onFieldReset');
+    });
+
+    expect(fork.props.value).toEqual([]);
+    expect(setFieldValue).toHaveBeenCalledWith(['orders', 0, 'lines'], []);
+    expect(onChange).not.toHaveBeenCalled();
+  });
+
+  it('resets the non-forked model through the parent form field path', () => {
+    const onChange = vi.fn();
+    const { blockModel, model, setFieldValue } = createSubTableFieldModel({
+      onChange,
+      value: [{ id: 1 }],
+    });
+
+    render(React.createElement(React.Fragment, null, model.render()));
+
+    act(() => {
+      blockModel.emitter.emit('onFieldReset');
+    });
+
+    expect(model.props.value).toEqual([]);
+    expect(setFieldValue).toHaveBeenCalledWith(['roles'], []);
+    expect(onChange).not.toHaveBeenCalled();
+  });
+
+  it('resets popup sub-table form values without relying on onChange', async () => {
+    const onChange = vi.fn();
+    const { blockModel, model, setFieldValue } = await createPopupSubTableFieldModel({
+      onChange,
+      pageSize: 10,
+      value: [{ id: 1 }],
+    });
+
+    render(React.createElement(React.Fragment, null, model.render()));
+
+    act(() => {
+      blockModel.emitter.emit('onFieldReset');
+    });
+
+    expect(model.props.value).toEqual([]);
+    expect(setFieldValue).toHaveBeenCalledWith(['roles'], []);
+    expect(onChange).not.toHaveBeenCalled();
+  });
+});

package/src/flow/models/fields/AssociationFieldModel/SubTableFieldModel/index.tsx

@@ -112,6 +112,11 @@ export class SubTableFieldModel extends AssociationFieldModel {
     };
     const isConfigMode = !!this.context.flowSettingsEnabled;
     const fieldPathArray = this.context.fieldPathArray ?? this.parent?.context?.fieldPathArray;
+    const onResetFieldValue = () => {
+      const value = [];
+      this.setProps({ value });
+      this.context.blockModel?.setFieldValue?.(fieldPathArray, value);
+    };
     return (
       <SubTableField
         {...this.props}
@@ -124,6 +129,7 @@ export class SubTableFieldModel extends AssociationFieldModel {
         formValuesChangeEmitter={this.context.blockModel?.emitter}
         fieldPathArray={fieldPathArray}
         getCurrentValue={() => this.getCurrentValue()}
+        onResetFieldValue={onResetFieldValue}
       />
     );
   }
@@ -136,10 +142,6 @@ export class SubTableFieldModel extends AssociationFieldModel {
     this.context.defineProperty('collection', {
       get: () => this.context.collectionField.targetCollection,
     });
-    // 监听表单reset
-    this.context.blockModel.emitter.on('onFieldReset', () => {
-      this.props.onChange([]);
-    });
     this.onSelectExitRecordClick = (setCurrentPage, currentPageSize) => {
       this.setCurrentPage = setCurrentPage;
       this.currentPageSize = currentPageSize;

package/src/flow/models/fields/AssociationFieldModel/__tests__/AssociationFieldModel.updateAssociation.test.ts

@@ -0,0 +1,72 @@
+/**
+ * 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 { FlowEngine, FlowModel } from '@nocobase/flow-engine';
+import { describe, expect, it, vi } from 'vitest';
+import { AssociationFieldModel } from '../AssociationFieldModel';
+
+class DefaultAssociationFieldModel extends AssociationFieldModel {}
+
+class UpdateAssociationFieldModel extends AssociationFieldModel {
+  updateAssociation = true;
+}
+
+async function runAssociationFieldInit(FieldModelClass: typeof AssociationFieldModel) {
+  const engine = new FlowEngine();
+  engine.registerModels({
+    DefaultAssociationFieldModel,
+    UpdateAssociationFieldModel,
+  });
+
+  const addUpdateAssociationValues = vi.fn();
+  const blockModel = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'form-block',
+  });
+  blockModel.context.defineProperty('resource', {
+    value: { addUpdateAssociationValues },
+  });
+
+  const formItem = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'form-item',
+  });
+  (formItem as FlowModel & { fieldPath: string }).fieldPath = 'author';
+  formItem.context.defineProperty('blockModel', { value: blockModel });
+
+  const field = engine.createModel<AssociationFieldModel>({
+    use: FieldModelClass,
+    uid: 'association-field',
+    parentId: formItem.uid,
+  });
+  field.context.defineProperty('collectionField', {
+    value: {
+      dataSourceKey: 'main',
+      target: 'users',
+    },
+  });
+
+  await field.applyFlow('AssociationFieldInit');
+
+  return addUpdateAssociationValues;
+}
+
+describe('AssociationFieldModel updateAssociation', () => {
+  it('does not add updateAssociationValues by default', async () => {
+    const addUpdateAssociationValues = await runAssociationFieldInit(DefaultAssociationFieldModel);
+
+    expect(addUpdateAssociationValues).not.toHaveBeenCalled();
+  });
+
+  it('adds updateAssociationValues for opt-in association fields', async () => {
+    const addUpdateAssociationValues = await runAssociationFieldInit(UpdateAssociationFieldModel);
+
+    expect(addUpdateAssociationValues).toHaveBeenCalledWith('author');
+  });
+});

package/src/flow/models/fields/InputFieldModel.tsx

@@ -9,31 +9,18 @@
 
 import { EditableItemModel, FilterableItemModel, tExpr } from '@nocobase/flow-engine';
 import { Input } from 'antd';
-import type { InputProps, InputRef } from 'antd';
-import React, { useEffect, useRef } from 'react';
+import type { InputProps } from 'antd';
+import React, { useEffect, useState } from 'react';
 import { customAlphabet as Alphabet } from 'nanoid';
 import { FieldModel } from '../base/FieldModel';
 import { ScanInput } from '../../../components/form/ScanInput';
 
 function IMESafeInput(props: InputProps) {
   const { value, onChange, onCompositionStart, onCompositionEnd, ...rest } = props;
-  const inputRef = useRef<InputRef>(null);
-  const previousValueRef = useRef(value);
-  const defaultValue = typeof value === 'bigint' ? String(value) : value;
+  const [inputValue, setInputValue] = useState<InputProps['value']>(() => normalizeInputValue(value));
 
   useEffect(() => {
-    if (Object.is(previousValueRef.current, value)) {
-      return;
-    }
-    previousValueRef.current = value;
-
-    const input = inputRef.current?.input;
-    if (input) {
-      const nextValue = value == null ? '' : String(value);
-      if (input.value !== nextValue) {
-        input.value = nextValue;
-      }
-    }
+    setInputValue(normalizeInputValue(value));
   }, [value]);
 
   const getEventValue = (event: React.ChangeEvent<HTMLInputElement> | React.CompositionEvent<HTMLInputElement>) =>
@@ -42,24 +29,29 @@ function IMESafeInput(props: InputProps) {
   return (
     <Input
       {...rest}
-      ref={inputRef}
-      defaultValue={defaultValue}
+      value={inputValue}
       onChange={(event) => {
-        previousValueRef.current = getEventValue(event);
+        setInputValue(getEventValue(event));
         onChange?.(event);
       }}
       onCompositionStart={(event) => {
-        previousValueRef.current = getEventValue(event);
+        setInputValue(getEventValue(event));
         onCompositionStart?.(event);
       }}
       onCompositionEnd={(event) => {
-        previousValueRef.current = getEventValue(event);
+        setInputValue(getEventValue(event));
         onCompositionEnd?.(event);
       }}
     />
   );
 }
 
+function normalizeInputValue(nextValue: unknown): InputProps['value'] {
+  if (typeof nextValue === 'bigint') return String(nextValue);
+  if (nextValue == null) return '';
+  return nextValue as InputProps['value'];
+}
+
 export class InputFieldModel extends FieldModel {
   render() {
     if (this.props.enableScan) {

package/src/flow/models/fields/JSEditableFieldModel.tsx

@@ -7,7 +7,7 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { ElementProxy, tExpr, createSafeDocument, createSafeWindow, createSafeNavigator } from '@nocobase/flow-engine';
+import { ElementProxy, tExpr } from '@nocobase/flow-engine';
 import React, { useEffect, useMemo, useRef } from 'react';
 import { Input } from 'antd';
 import { FieldModel } from '../base/FieldModel';
@@ -398,16 +398,7 @@ JSEditableFieldModel.registerFlow({
             get: () => isReadOnlyMode(ctx.model),
             cache: false,
           });
-          const navigator = createSafeNavigator();
-          await ctx.runjs(
-            code,
-            {
-              window: createSafeWindow({ navigator }),
-              document: createSafeDocument(),
-              navigator,
-            },
-            { version },
-          );
+          await ctx.runjs(code, undefined, { version });
         });
       },
     },