@nocobase/client-v2 2.2.0-alpha.1 → 2.2.0-alpha.10

package/src/flow/components/FieldAssignExactDatePicker.tsx

@@ -7,7 +7,7 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import React, { useMemo, useState } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 import { DatePicker, Select, Space } from 'antd';
 import { inferPickerType } from '../../flow-compat';
 import { dayjs, getDateTimeFormat, getPickerFormat } from '@nocobase/utils/client';
@@ -29,6 +29,7 @@ export interface FieldAssignExactDatePickerProps {
   isRange?: boolean;
   onChange?: (value: ExactDatePickerValue) => void;
   style?: React.CSSProperties;
+  disabled?: boolean;
 }
 
 function getRawSingleValue(value: unknown, isRange: boolean): unknown {
@@ -114,7 +115,7 @@ function parseRangeValue(value: unknown, format: string): [dayjs.Dayjs, dayjs.Da
 }
 
 export const FieldAssignExactDatePicker: React.FC<FieldAssignExactDatePickerProps> = (props) => {
-  const { picker = 'date', format, showTime, timeFormat, value, isRange = false, onChange, style } = props;
+  const { picker = 'date', format, showTime, timeFormat, value, isRange = false, onChange, style, disabled } = props;
   const flowCtx = useFlowContext();
   const t = flowCtx.model.translate.bind(flowCtx.model);
 
@@ -124,17 +125,17 @@ export const FieldAssignExactDatePicker: React.FC<FieldAssignExactDatePickerProp
     return inferPickerFromRawValue(rawSingleValue, picker);
   });
 
-  const getResolvedFormat = (nextPicker: ExactDatePickerMode) => {
-    const baseFormat = nextPicker === picker && format ? format : getPickerFormat(nextPicker);
-    const dateFormat = nextPicker === 'date' ? stripTimeFromFormat(baseFormat) : baseFormat;
-    return getDateTimeFormat(nextPicker, dateFormat, showTime, timeFormat);
-  };
-
-  const resolvedFormat = useMemo(
-    () => getResolvedFormat(targetPicker),
-    [targetPicker, format, picker, showTime, timeFormat],
+  const getResolvedFormat = useCallback(
+    (nextPicker: ExactDatePickerMode) => {
+      const baseFormat = nextPicker === picker && format ? format : getPickerFormat(nextPicker);
+      const dateFormat = nextPicker === 'date' ? stripTimeFromFormat(baseFormat) : baseFormat;
+      return getDateTimeFormat(nextPicker, dateFormat, showTime, timeFormat);
+    },
+    [format, picker, showTime, timeFormat],
   );
 
+  const resolvedFormat = useMemo(() => getResolvedFormat(targetPicker), [getResolvedFormat, targetPicker]);
+
   const singleValue = useMemo(() => {
     if (isRange) return null;
     return parseDateFromRawValue(value, resolvedFormat);
@@ -156,6 +157,10 @@ export const FieldAssignExactDatePicker: React.FC<FieldAssignExactDatePickerProp
   );
 
   const handlePickerTypeChange = (nextPicker: ExactDatePickerMode) => {
+    if (disabled) {
+      return;
+    }
+
     setTargetPicker(nextPicker);
 
     if (!onChange) {
@@ -182,7 +187,11 @@ export const FieldAssignExactDatePicker: React.FC<FieldAssignExactDatePickerProp
     inputReadOnly: flowCtx.isMobileLayout,
     showTime: showTime ? { defaultValue: dayjs('00:00:00', 'HH:mm:ss') } : false,
     value: singleValue,
+    disabled,
     onChange: (nextDate: dayjs.Dayjs | null) => {
+      if (disabled) {
+        return;
+      }
       if (nextDate && dayjs.isDayjs(nextDate)) {
         onChange?.(nextDate);
         return;
@@ -200,7 +209,11 @@ export const FieldAssignExactDatePicker: React.FC<FieldAssignExactDatePickerProp
     inputReadOnly: flowCtx.isMobileLayout,
     showTime: showTime ? { defaultValue: [dayjs('00:00:00', 'HH:mm:ss'), dayjs('23:59:59', 'HH:mm:ss')] } : false,
     value: rangeValue,
+    disabled,
     onChange: (nextDates: [dayjs.Dayjs | null, dayjs.Dayjs | null] | null) => {
+      if (disabled) {
+        return;
+      }
       if (Array.isArray(nextDates) && nextDates[0] && nextDates[1]) {
         onChange?.([nextDates[0], nextDates[1]]);
         return;
@@ -218,6 +231,7 @@ export const FieldAssignExactDatePicker: React.FC<FieldAssignExactDatePickerProp
         value={targetPicker}
         options={pickerOptions}
         onChange={handlePickerTypeChange}
+        disabled={disabled}
       />
       {isRange ? <DatePicker.RangePicker {...rangePickerProps} /> : <DatePicker {...singlePickerProps} />}
     </Space.Compact>

package/src/flow/components/FieldAssignRulesEditor.tsx

@@ -28,7 +28,7 @@ import { buildFieldAssignCascaderOptionsFromCollection, type FieldAssignCascader
 import { isRunJSValue, isVariableExpression, type MetaTreeNode } from '@nocobase/flow-engine';
 import { isToManyAssociationField } from '../internal/utils/modelUtils';
 
-export type AssignMode = 'default' | 'assign';
+export type AssignMode = 'default' | 'assign' | 'override';
 
 type CollectionFieldLike = {
   name?: unknown;
@@ -89,6 +89,8 @@ export interface FieldAssignRulesEditorProps {
   defaultMode?: AssignMode;
   /** 固定 mode：用于“仅默认值/仅赋值”的场景 */
   fixedMode?: AssignMode;
+  /** 可选 mode 列表；fixedMode 优先级更高 */
+  allowedModes?: AssignMode[];
   /** 是否显示 condition */
   showCondition?: boolean;
   /** 是否显示 enable 开关 */
@@ -109,6 +111,65 @@ export interface FieldAssignRulesEditorProps {
   maxAssociationFieldDepth?: number;
 }
 
+const ALL_ASSIGN_MODES: AssignMode[] = ['default', 'override', 'assign'];
+
+function cloneCascaderOption(option: FieldAssignCascaderOption): FieldAssignCascaderOption {
+  return {
+    ...option,
+    children: option.children?.map((child) => cloneCascaderOption(child)),
+  };
+}
+
+function mergeCascaderOptionInto(options: FieldAssignCascaderOption[], source: FieldAssignCascaderOption) {
+  const value = source?.value ? String(source.value) : '';
+  if (!value) return;
+
+  const existing = options.find((item) => String(item?.value || '') === value);
+  if (!existing) {
+    options.push(cloneCascaderOption(source));
+    return;
+  }
+
+  if (!existing.label && source.label) {
+    existing.label = source.label;
+  }
+  if (source.isLeaf === false || existing.children?.length || source.children?.length) {
+    existing.isLeaf = false;
+  }
+  if (source.loading) {
+    existing.loading = source.loading;
+  }
+  if (source.children?.length) {
+    existing.children = mergeCascaderOptions(existing.children || [], source.children);
+  }
+}
+
+function mergeCascaderOptions(
+  configured: FieldAssignCascaderOption[],
+  allFields: FieldAssignCascaderOption[],
+): FieldAssignCascaderOption[] {
+  const result = (Array.isArray(configured) ? configured : []).map((item) => cloneCascaderOption(item));
+  for (const item of Array.isArray(allFields) ? allFields : []) {
+    mergeCascaderOptionInto(result, item);
+  }
+  return result;
+}
+
+function isAssignMode(mode: unknown): mode is AssignMode {
+  return mode === 'default' || mode === 'override' || mode === 'assign';
+}
+
+function normalizeAssignModes(modes?: AssignMode[]): AssignMode[] {
+  const source = Array.isArray(modes) && modes.length ? modes : ALL_ASSIGN_MODES;
+  const out: AssignMode[] = [];
+  for (const mode of source) {
+    if (!isAssignMode(mode)) continue;
+    if (out.includes(mode)) continue;
+    out.push(mode);
+  }
+  return out.length ? out : ALL_ASSIGN_MODES;
+}
+
 export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (props) => {
   const {
     t,
@@ -118,6 +179,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
     onChange,
     defaultMode = 'assign',
     fixedMode,
+    allowedModes: rawAllowedModes,
     showCondition = true,
     showEnable = true,
     showValueEditorWhenNoField = false,
@@ -129,13 +191,43 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
   } = props;
 
   const value = React.useMemo(() => (Array.isArray(rawValue) ? rawValue : []), [rawValue]);
+  const allowedModes = React.useMemo(
+    () => normalizeAssignModes(fixedMode ? [fixedMode] : rawAllowedModes),
+    [fixedMode, rawAllowedModes],
+  );
+  const getDefaultMode = React.useCallback((): AssignMode => {
+    if (fixedMode) return fixedMode;
+    if (isAssignMode(defaultMode) && allowedModes.includes(defaultMode)) return defaultMode;
+    return allowedModes[0] || 'assign';
+  }, [allowedModes, defaultMode, fixedMode]);
+  const normalizeItemMode = React.useCallback(
+    (item: FieldAssignRuleItem): FieldAssignRuleItem => {
+      const mode = isAssignMode(item?.mode) && allowedModes.includes(item.mode) ? item.mode : getDefaultMode();
+      return item?.mode === mode ? item : { ...item, mode };
+    },
+    [allowedModes, getDefaultMode],
+  );
+  const emitChange = React.useCallback(
+    (next: FieldAssignRuleItem[]) => {
+      onChange?.(next.map((item) => normalizeItemMode(item)));
+    },
+    [normalizeItemMode, onChange],
+  );
+
+  const normalizeFieldOptions = React.useCallback((options: FieldAssignRulesEditorProps['fieldOptions']) => {
+    return Array.isArray(options)
+      ? (options as FieldAssignCascaderOption[]).map((option) => cloneCascaderOption(option))
+      : [];
+  }, []);
   const [cascaderOptions, setCascaderOptions] = React.useState<FieldAssignCascaderOption[]>(() =>
-    Array.isArray(fieldOptions) ? (fieldOptions as FieldAssignCascaderOption[]) : [],
+    normalizeFieldOptions(fieldOptions),
   );
+  const loadedCascaderOptionsRef = React.useRef<WeakSet<FieldAssignCascaderOption>>(new WeakSet());
 
   React.useEffect(() => {
-    setCascaderOptions(Array.isArray(fieldOptions) ? (fieldOptions as FieldAssignCascaderOption[]) : []);
-  }, [fieldOptions]);
+    loadedCascaderOptionsRef.current = new WeakSet();
+    setCascaderOptions(normalizeFieldOptions(fieldOptions));
+  }, [fieldOptions, normalizeFieldOptions, rootCollection, maxAssociationFieldDepth]);
 
   const getRuleKey = React.useCallback((item: FieldAssignRuleItem, index: number) => item?.key || String(index), []);
   const [titleFieldDraftMap, setTitleFieldDraftMap] = React.useState<Record<string, string | undefined>>({});
@@ -312,7 +404,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
 
   const patchItem = (index: number, patch: Partial<FieldAssignRuleItem>) => {
     const next = value.map((it, i) => (i === index ? { ...it, ...patch } : it));
-    onChange?.(next);
+    emitChange(next);
   };
 
   const removeItem = (index: number) => {
@@ -334,7 +426,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
       setSyncingRuleKey(null);
     }
     const next = value.filter((_, i) => i !== index);
-    onChange?.(next);
+    emitChange(next);
   };
 
   const moveItem = (index: number, direction: 'up' | 'down') => {
@@ -343,7 +435,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
     if (targetIndex < 0 || targetIndex >= next.length) return;
     const [item] = next.splice(index, 1);
     next.splice(targetIndex, 0, item);
-    onChange?.(next);
+    emitChange(next);
   };
 
   const addItem = () => {
@@ -352,29 +444,33 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
       {
         key: uid(),
         enable: true,
-        mode: fixedMode || defaultMode,
+        mode: getDefaultMode(),
         condition: { logic: '$and', items: [] },
         targetPath: undefined,
         value: undefined,
       },
     ];
-    onChange?.(next);
+    emitChange(next);
   };
 
   const getEffectiveMode = (item: FieldAssignRuleItem): AssignMode => {
     if (fixedMode) return fixedMode;
-    return item?.mode === 'default' ? 'default' : 'assign';
+    if (isAssignMode(item?.mode) && allowedModes.includes(item.mode)) return item.mode;
+    return getDefaultMode();
   };
 
   const renderAssignModeLabel = React.useCallback(
     (mode: AssignMode) => {
-      const modeText = mode === 'default' ? t('Default value') : t('Fixed value');
+      const modeText =
+        mode === 'default' ? t('Default value') : mode === 'override' ? t('Override value') : t('Fixed value');
       const modeHelpText =
         mode === 'default'
           ? t(
               'A pre-filled value. Editable, for new entries only, and won’t affect existing data (including empty values).',
             )
-          : t('A system-set value. Read-only.');
+          : mode === 'override'
+            ? t('Overrides existing values until the user edits it.')
+            : t('A system-set value. Read-only.');
 
       const preventModeToggle = (e: React.MouseEvent<HTMLElement>) => {
         e.preventDefault();
@@ -551,23 +647,26 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
       const opts = selectedOptions || [];
       const target = opts[opts.length - 1];
       if (!target) return;
-      if (target.children && Array.isArray(target.children) && target.children.length) return;
       if (target.isLeaf) return;
+      if (loadedCascaderOptionsRef.current.has(target)) return;
 
       const segments = opts.map((o) => String(o?.value)).filter(Boolean);
       const targetCollection = resolveTargetCollectionBySegments(segments);
       if (!targetCollection) {
-        target.isLeaf = true;
+        target.isLeaf = !(target.children && target.children.length);
+        loadedCascaderOptionsRef.current.add(target);
         setCascaderOptions((prev) => [...prev]);
         return;
       }
 
       const children = buildChildrenFromCollection(targetCollection, segments.length);
       if (!children.length) {
-        target.isLeaf = true;
+        target.isLeaf = !(target.children && target.children.length);
       } else {
-        target.children = children;
+        target.children = mergeCascaderOptions(target.children || [], children);
+        target.isLeaf = false;
       }
+      loadedCascaderOptionsRef.current.add(target);
       setCascaderOptions((prev) => [...prev]);
     },
     [buildChildrenFromCollection, resolveTargetCollectionBySegments],
@@ -583,12 +682,14 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
         const hit = options.find((o) => String(o?.value) === seg);
         if (!hit) return;
         selected.push(hit);
+        if (!hit.isLeaf && !loadedCascaderOptionsRef.current.has(hit)) {
+          await loadCascaderData(selected);
+        }
         if (hit.children?.length) {
           options = hit.children;
           continue;
         }
         if (hit.isLeaf) return;
-        await loadCascaderData(selected);
         options = hit.children || [];
       }
     },
@@ -619,7 +720,9 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
         await preloadCascaderPath(segs);
       }
     };
-    void run();
+    run().catch((error) => {
+      console.warn('[FieldAssignRulesEditor] Failed to preload cascader path', error);
+    });
     return () => {
       cancelled = true;
     };
@@ -627,7 +730,8 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
 
   const renderPanelHeader = (item: FieldAssignRuleItem, index: number) => {
     const mode = getEffectiveMode(item);
-    const modeText = mode === 'default' ? t('Default value') : t('Fixed value');
+    const modeText =
+      mode === 'default' ? t('Default value') : mode === 'override' ? t('Override value') : t('Fixed value');
     const fieldLabel = getFieldLabel(item.targetPath);
     const title = fieldLabel ? String(fieldLabel) : t('Please select field');
 
@@ -935,8 +1039,11 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
                 onChange={(event) => patchItem(index, { mode: event.target.value as AssignMode })}
               >
                 <Space size={16}>
-                  <Radio value="default">{renderAssignModeLabel('default')}</Radio>
-                  <Radio value="assign">{renderAssignModeLabel('assign')}</Radio>
+                  {allowedModes.map((allowedMode) => (
+                    <Radio key={allowedMode} value={allowedMode}>
+                      {renderAssignModeLabel(allowedMode)}
+                    </Radio>
+                  ))}
                 </Space>
               </Radio.Group>
             </div>

package/src/flow/components/FieldAssignValueInput.tsx

@@ -42,6 +42,12 @@ import { normalizeFilterValueByOperator } from '../models/blocks/filter-form/val
 import { FieldAssignExactDatePicker, type ExactDatePickerMode } from './FieldAssignExactDatePicker';
 import { limitAssociationMetaTree } from './filter/metaTreeAssociationDepth';
 
+type VariableInputConverters = {
+  renderInputComponent?: (metaTreeNode: MetaTreeNode | null) => React.ComponentType<any> | null;
+  resolvePathFromValue?: (value: any) => string[] | undefined;
+  resolveValueFromPath?: (metaTreeNode: MetaTreeNode) => any;
+};
+
 const DATE_FIELD_INTERFACES = new Set(['date', 'datetime', 'datetimeNoTz', 'createdAt', 'updatedAt', 'unixTimestamp']);
 
 const TZ_AWARE_DATE_INTERFACES = new Set(['datetime', 'createdAt', 'updatedAt', 'unixTimestamp']);
@@ -341,7 +347,11 @@ interface Props {
    * 默认 false，保持历史行为。
    */
   enableDateVariableAsConstant?: boolean;
+  /** 是否允许在变量选择器中使用 RunJS。默认 true，保持历史行为。 */
+  allowRunJS?: boolean;
   maxAssociationFieldDepth?: number;
+  disabled?: boolean;
+  variableConverters?: VariableInputConverters;
 }
 
 type ResolvedFieldContext = {
@@ -712,7 +722,10 @@ export const FieldAssignValueInput: React.FC<Props> = ({
   preferFormItemFieldModel,
   associationFieldNamesOverride,
   enableDateVariableAsConstant = false,
+  allowRunJS = true,
   maxAssociationFieldDepth = 2,
+  disabled = false,
+  variableConverters,
 }) => {
   const flowCtx = useFlowContext<FlowModelContext>();
   const normalizeEventValue = React.useCallback((eventOrValue: unknown) => {
@@ -1028,18 +1041,22 @@ export const FieldAssignValueInput: React.FC<Props> = ({
       collectionField: effectiveCollectionField,
     });
 
-    const created = engine?.createModel?.({
-      use: 'VariableFieldFormModel',
-      subModels: {
-        fields: [
-          {
-            use: effectiveFieldModelUse,
-            stepParams: tempFieldStepParams,
-            props: tempFieldProps,
-          },
-        ],
+    const sourceContext = resolved?.itemModel?.context || flowCtx.model?.context;
+    const created = engine?.createModel?.(
+      {
+        use: 'VariableFieldFormModel',
+        subModels: {
+          fields: [
+            {
+              use: effectiveFieldModelUse,
+              stepParams: tempFieldStepParams,
+              props: tempFieldProps,
+            },
+          ],
+        },
       },
-    });
+      sourceContext ? { delegate: sourceContext } : undefined,
+    );
     if (!created) return;
 
     // 注入上下文（集合/数据源/字段/区块/资源）
@@ -1073,7 +1090,7 @@ export const FieldAssignValueInput: React.FC<Props> = ({
       fm.setStepParams('selectSettings', 'fieldNames', { label: overrideLabel });
     }
     fm?.setProps?.({
-      disabled: false,
+      disabled,
       readPretty: false,
       pattern: 'editable',
       updateAssociation: false,
@@ -1136,6 +1153,7 @@ export const FieldAssignValueInput: React.FC<Props> = ({
     preferFormItemFieldModel,
     associationFieldNamesOverride?.label,
     associationFieldNamesOverride?.value,
+    disabled,
   ]);
 
   // 当传入 operator / operatorMetaList 时，按 operator schema 适配临时字段的输入组件与 props。
@@ -1188,6 +1206,9 @@ export const FieldAssignValueInput: React.FC<Props> = ({
       React.useEffect(() => {
         const coercedValue = coerceEmptyValueForRenderer(inputProps?.value);
         const handleChange = (ev: any) => {
+          if (inputProps?.disabled) {
+            return;
+          }
           const nextRaw = normalizeEventValue(ev);
           const normalizedForStore = operator ? normalizeFilterValueByOperator(operator, nextRaw) : nextRaw;
           const nextValue = coerceEmptyValueForRenderer(normalizedForStore);
@@ -1219,6 +1240,7 @@ export const FieldAssignValueInput: React.FC<Props> = ({
             value={inputProps?.value}
             onChange={(e) => inputProps?.onChange?.(normalizeEventValue(e))}
             placeholder={placeholder}
+            disabled={inputProps?.disabled}
             style={withFullWidthStyle(wrapperStyle)}
           />
         );
@@ -1237,6 +1259,7 @@ export const FieldAssignValueInput: React.FC<Props> = ({
     const C: React.FC<any> = (inputProps) => {
       const wrapperStyle = pickStyle(inputProps?.style);
       const raw = inputProps?.value;
+      const isDisabled = Boolean(inputProps?.disabled);
       const parsed = isCtxDateExpression(raw) ? parseCtxDateExpression(raw) : raw;
       const parsedValue = typeof parsed === 'undefined' ? undefined : parsed;
       const { token } = theme.useToken();
@@ -1261,6 +1284,9 @@ export const FieldAssignValueInput: React.FC<Props> = ({
       });
 
       const handleSelect = (val: string) => {
+        if (isDisabled) {
+          return;
+        }
         setOpen(false);
         if (val === 'exact') {
           inputProps?.onChange?.('');
@@ -1275,10 +1301,16 @@ export const FieldAssignValueInput: React.FC<Props> = ({
       };
 
       const handleExactSingleChange = (nextValue: any) => {
+        if (isDisabled) {
+          return;
+        }
         inputProps?.onChange?.(nextValue || '');
       };
 
       const handleExactRangeChange = (nextValue: any) => {
+        if (isDisabled) {
+          return;
+        }
         inputProps?.onChange?.(nextValue || '');
       };
 
@@ -1323,7 +1355,11 @@ export const FieldAssignValueInput: React.FC<Props> = ({
           <Select
             options={options}
             open={open}
-            onDropdownVisibleChange={setOpen}
+            onDropdownVisibleChange={(nextOpen) => {
+              if (!isDisabled) {
+                setOpen(nextOpen);
+              }
+            }}
             allowClear={false}
             style={{
               width: '100%',
@@ -1333,13 +1369,18 @@ export const FieldAssignValueInput: React.FC<Props> = ({
             value={selectedType}
             onChange={handleSelect}
             dropdownRender={dropdownRender}
+            disabled={isDisabled}
           />
           {['past', 'next'].includes(selectedType) && [
             <InputNumber
               key="number"
               style={{ flex: 1 }}
               value={(parsedValue as any)?.number}
+              disabled={isDisabled}
               onChange={(nextNumber) => {
+                if (isDisabled) {
+                  return;
+                }
                 inputProps?.onChange?.({
                   ...(parsedValue as any),
                   type: selectedType,
@@ -1352,7 +1393,11 @@ export const FieldAssignValueInput: React.FC<Props> = ({
               key="unit"
               value={(parsedValue as any)?.unit}
               style={{ minWidth: 130, maxWidth: 140 }}
+              disabled={isDisabled}
               onChange={(nextUnit) => {
+                if (isDisabled) {
+                  return;
+                }
                 inputProps?.onChange?.({
                   ...(parsedValue as any),
                   type: selectedType,
@@ -1375,6 +1420,7 @@ export const FieldAssignValueInput: React.FC<Props> = ({
               isRange={isRange}
               value={isRange ? exactRangeValue : exactSingleValue}
               onChange={isRange ? handleExactRangeChange : handleExactSingleChange}
+              disabled={isDisabled}
               style={{ flex: 1 }}
             />
           )}
@@ -1394,7 +1440,12 @@ export const FieldAssignValueInput: React.FC<Props> = ({
 
   const RunJSComponent = React.useMemo(() => {
     const C: React.FC<any> = (inputProps) => (
-      <RunJSValueEditor t={flowCtx.t} value={inputProps?.value} onChange={inputProps?.onChange} />
+      <RunJSValueEditor
+        t={flowCtx.t}
+        value={inputProps?.value}
+        onChange={inputProps?.onChange}
+        disabled={inputProps?.disabled}
+      />
     );
     return C;
   }, [flowCtx]);
@@ -1417,11 +1468,13 @@ export const FieldAssignValueInput: React.FC<Props> = ({
           render: ConstantEditor,
         },
         { title: tExpr('Null'), name: 'null', type: 'object', paths: ['null'], render: NullComponent },
-        { title: tExpr('RunJS'), name: 'runjs', type: 'object', paths: ['runjs'], render: RunJSComponent },
+        ...(allowRunJS
+          ? [{ title: tExpr('RunJS'), name: 'runjs', type: 'object', paths: ['runjs'], render: RunJSComponent }]
+          : []),
         ...limitedBase,
       ];
     };
-  }, [flowCtx, ConstantEditor, NullComponent, RunJSComponent, maxAssociationFieldDepth]);
+  }, [flowCtx, ConstantEditor, NullComponent, RunJSComponent, allowRunJS, maxAssociationFieldDepth]);
 
   const displayValue = React.useMemo(() => {
     if (!useDateVariableConstant) {
@@ -1438,6 +1491,10 @@ export const FieldAssignValueInput: React.FC<Props> = ({
 
   const handleVariableInputChange = React.useCallback(
     (nextValue: any) => {
+      if (disabled) {
+        return;
+      }
+
       if (!useDateVariableConstant) {
         onChange(nextValue);
         return;
@@ -1445,7 +1502,7 @@ export const FieldAssignValueInput: React.FC<Props> = ({
 
       onChange(normalizeDateVariableOutput(nextValue, dateVariableComponentProps));
     },
-    [dateVariableComponentProps, onChange, useDateVariableConstant],
+    [dateVariableComponentProps, disabled, onChange, useDateVariableConstant],
   );
 
   if (!fieldPath) {
@@ -1460,26 +1517,40 @@ export const FieldAssignValueInput: React.FC<Props> = ({
       metaTree={metaTree}
       style={{ width: '100%' }}
       clearValue={''}
+      disabled={disabled}
       converters={{
+        ...variableConverters,
         renderInputComponent: (meta) => {
+          const external = variableConverters?.renderInputComponent?.(meta ?? null);
+          if (external) {
+            return external;
+          }
           const firstPath = meta?.paths?.[0];
           if (firstPath === 'constant') return ConstantEditor;
           if (firstPath === 'null') return NullComponent;
-          if (firstPath === 'runjs') return RunJSComponent;
+          if (allowRunJS && firstPath === 'runjs') return RunJSComponent;
           return null;
         },
         resolveValueFromPath: (item) => {
+          const external = variableConverters?.resolveValueFromPath?.(item);
+          if (external !== undefined) {
+            return external;
+          }
           const firstPath = item?.paths?.[0];
           if (firstPath === 'constant') {
             return useDateVariableConstant ? { type: 'today' } : '';
           }
           if (firstPath === 'null') return null;
-          if (firstPath === 'runjs') return { code: '', version: 'v2' };
+          if (allowRunJS && firstPath === 'runjs') return { code: '', version: 'v2' };
           return undefined;
         },
         resolvePathFromValue: (currentValue) => {
+          const external = variableConverters?.resolvePathFromValue?.(currentValue);
+          if (external !== undefined) {
+            return external;
+          }
           if (currentValue === null) return ['null'];
-          if (isRunJSValue(currentValue)) return ['runjs'];
+          if (allowRunJS && isRunJSValue(currentValue)) return ['runjs'];
           if (useDateVariableConstant && isCtxDateExpression(currentValue)) {
             return ['constant'];
           }