amis-core 6.13.0-beta.2 → 6.13.0-beta.21

package/esm/renderers/Form.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.13.0-beta.2
+ * amis-core v6.13.0-beta.21
  * Copyright 2018-2025 fex
  */
 
@@ -23,7 +23,7 @@ import { reaction } from 'mobx';
 import groupBy from 'lodash/groupBy';
 import isEqual from 'lodash/isEqual';
 import CustomStyle from '../components/CustomStyle.js';
-import { isObject, createObject, cloneObject, injectObjectChain } from '../utils/object.js';
+import { isObject, injectObjectChain, createObject, cloneObject } from '../utils/object.js';
 import { setThemeClassName } from '../utils/style-helper.js';
 import { dataMapping } from '../utils/dataMapping.js';
 
@@ -38,6 +38,12 @@ var Form = /** @class */ (function (_super) {
             trailing: true,
             leading: false
         });
+        // 当有多次调用时，只需要跳一个
+        _this.lazyJumpToErrorComponent = debounce(_this.jumpToErrorComponent.bind(_this), 250, {
+            trailing: false,
+            leading: true
+        });
+        _this.formRef = React.createRef();
         // 如果开启了 lazyChange，需要一个 flush 方法把队列中值应用上。
         _this.flushing = false;
         _this.emittedData = null;
@@ -64,7 +70,7 @@ var Form = /** @class */ (function (_super) {
         _this.dispatchInited = _this.dispatchInited.bind(_this);
         _this.blockRouting = _this.blockRouting.bind(_this);
         _this.beforePageUnload = _this.beforePageUnload.bind(_this);
-        _this.formItemDispatchEvent = _this.formItemDispatchEvent.bind(_this);
+        _this.dispatchEvent = _this.dispatchEvent.bind(_this);
         _this.flush = _this.flush.bind(_this);
         var store = props.store, canAccessSuperData = props.canAccessSuperData, persistData = props.persistData, simpleMode = props.simpleMode, formLazyChange = props.formLazyChange;
         store.setCanAccessSuperData(canAccessSuperData !== false);
@@ -162,6 +168,11 @@ var Form = /** @class */ (function (_super) {
                 }
             })
                 .then(this.initInterval)
+                .then(function () {
+                return _this.props.dispatchEvent('initApiFinished', injectObjectChain(store.data, {
+                    __trigger: 'init'
+                }));
+            })
                 .then(this.onInit);
         }
         else {
@@ -191,6 +202,7 @@ var Form = /** @class */ (function (_super) {
         clearTimeout(this.timer);
         // this.lazyHandleChange.flush();
         this.lazyEmitChange.cancel();
+        this.lazyJumpToErrorComponent.cancel();
         this.asyncCancel && this.asyncCancel();
         this.toDispose.forEach(function (fn) { return fn(); });
         this.toDispose = [];
@@ -245,6 +257,7 @@ var Form = /** @class */ (function (_super) {
     Form.prototype.onInit = function () {
         return __awaiter(this, void 0, void 0, function () {
             var _a, onInit, store, persistData, submitOnInit, dispatchEvent, data, initedAt, hooks, groupedHooks, dispatch;
+            var _this = this;
             return __generator(this, function (_b) {
                 switch (_b.label) {
                     case 0:
@@ -255,6 +268,13 @@ var Form = /** @class */ (function (_super) {
                         data = cloneObject(store.data);
                         initedAt = store.initedAt;
                         store.setInited(true);
+                        // 等待 formInited 属性下发成功
+                        // 因为 hooks 里面可以能有读取 props 的操作
+                        return [4 /*yield*/, new Promise(function (resolve) { return _this.forceUpdate(resolve); })];
+                    case 1:
+                        // 等待 formInited 属性下发成功
+                        // 因为 hooks 里面可以能有读取 props 的操作
+                        _b.sent();
                         hooks = this.hooks['init'] || [];
                         groupedHooks = groupBy(hooks, function (item) {
                             return item.__enforce === 'prev'
@@ -264,15 +284,15 @@ var Form = /** @class */ (function (_super) {
                                     : 'normal';
                         });
                         return [4 /*yield*/, Promise.all((groupedHooks.prev || []).map(function (hook) { return hook(data); }))];
-                    case 1:
+                    case 2:
                         _b.sent();
                         //  有可能在前面的步骤中删除了钩子，所以需要重新验证一下
                         return [4 /*yield*/, Promise.all((groupedHooks.normal || []).map(function (hook) { return hooks.includes(hook) && hook(data); }))];
-                    case 2:
+                    case 3:
                         //  有可能在前面的步骤中删除了钩子，所以需要重新验证一下
                         _b.sent();
                         return [4 /*yield*/, Promise.all((groupedHooks.post || []).map(function (hook) { return hooks.includes(hook) && hook(data); }))];
-                    case 3:
+                    case 4:
                         _b.sent();
                         if (!isAlive(store)) {
                             return [2 /*return*/];
@@ -290,7 +310,7 @@ var Form = /** @class */ (function (_super) {
                         }
                         onInit && onInit(data, this.props);
                         return [4 /*yield*/, this.dispatchInited({ data: data })];
-                    case 4:
+                    case 5:
                         dispatch = _b.sent();
                         if (dispatch === null || dispatch === void 0 ? void 0 : dispatch.prevented) {
                             return [2 /*return*/];
@@ -322,7 +342,7 @@ var Form = /** @class */ (function (_super) {
                                 _c[initFinishedField || 'finished'] = false,
                                 _c));
                         result = undefined;
-                        if (!isEffectiveApi(initApi, store.data)) return [3 /*break*/, 2];
+                        if (!isEffectiveApi(initApi, store.data)) return [3 /*break*/, 4];
                         return [4 /*yield*/, store.fetchInitData(initApi, store.data, {
                                 successMessage: fetchSuccess,
                                 errorMessage: fetchFailed,
@@ -338,15 +358,20 @@ var Form = /** @class */ (function (_super) {
                             })];
                     case 1:
                         result = _d.sent();
-                        if (result === null || result === void 0 ? void 0 : result.ok) {
-                            this.initInterval(result);
-                            store.reset(undefined, false);
-                        }
-                        return [3 /*break*/, 3];
-                    case 2:
+                        if (!(result === null || result === void 0 ? void 0 : result.ok)) return [3 /*break*/, 3];
+                        this.initInterval(result);
                         store.reset(undefined, false);
+                        return [4 /*yield*/, this.props.dispatchEvent('initApiFinished', injectObjectChain(store.data, {
+                                __trigger: 'reload'
+                            }))];
+                    case 2:
+                        _d.sent();
                         _d.label = 3;
-                    case 3:
+                    case 3: return [3 /*break*/, 5];
+                    case 4:
+                        store.reset(undefined, false);
+                        _d.label = 5;
+                    case 5:
                         // 派发初始化接口请求完成事件
                         this.dispatchInited(result);
                         return [2 /*return*/, store.data];
@@ -548,9 +573,34 @@ var Form = /** @class */ (function (_super) {
             store.setLocalPersistData(persistDataKeys);
         }
     };
-    Form.prototype.formItemDispatchEvent = function (type, data) {
-        var dispatchEvent = this.props.dispatchEvent;
-        return dispatchEvent(type, data);
+    Form.prototype.jumpToErrorComponent = function (renderer) {
+        var _a, _b;
+        // 当表单校验错误是，优先调用组件的 focus
+        // 如果没有 focus 方法，则滚动到错误信息的位置
+        if (typeof (renderer === null || renderer === void 0 ? void 0 : renderer.focus) === 'function') {
+            renderer.focus();
+        }
+        else {
+            (_b = (_a = this.formRef.current) === null || _a === void 0 ? void 0 : _a.querySelector(".".concat(this.props.classPrefix, "Form-feedback"))) === null || _b === void 0 ? void 0 : _b.scrollIntoView({
+                behavior: 'smooth',
+                block: 'center'
+            });
+        }
+    };
+    Form.prototype.dispatchEvent = function (e, data, renderer, // for didmount
+    scoped) {
+        // 把这两个事件转到 form 组件上，让 form 组件来处理
+        if ((e === 'formItemValidateSucc' || e === 'formItemValidateError') &&
+            (renderer === null || renderer === void 0 ? void 0 : renderer.props.type) !== 'form') {
+            if (e === 'formItemValidateError') {
+                this.lazyJumpToErrorComponent(renderer);
+            }
+            // 如果事件是 formItemValidateSucc 或者 formItemValidateError 转成当前组件触发的，
+            // 所以 onEvent 是配置在 form 层的而不是表单项层
+            renderer = undefined;
+            scoped = undefined;
+        }
+        return this.props.dispatchEvent(e, data, renderer, scoped);
     };
     Form.prototype.emitChange = function (submit, emitedFromWatch) {
         if (emitedFromWatch === void 0) { emitedFromWatch = false; }
@@ -1227,7 +1277,7 @@ var Form = /** @class */ (function (_super) {
             addHook: this.addHook,
             removeHook: this.removeHook,
             renderFormItems: this.renderFormItems,
-            formItemDispatchEvent: this.formItemDispatchEvent,
+            dispatchEvent: this.dispatchEvent,
             formPristine: form.pristine,
             onFlushForm: this.flush
             // value: (control as any)?.name
@@ -1250,7 +1300,7 @@ var Form = /** @class */ (function (_super) {
         var padDom = repeatCount(columnCount && Array.isArray(body)
             ? (columnCount - (body.length % columnCount)) % columnCount
             : 0, function (index) { return (React.createElement("div", { className: cx("Form-item Form-item--".concat(mode, " is-placeholder")), key: index })); });
-        return (React.createElement(WrapperComponent, { className: cx("Form", "Form--".concat(mode || 'normal'), columnCount ? "Form--column Form--column-".concat(columnCount) : null, staticClassName && isStatic ? staticClassName : className, isStatic ? 'Form--isStatic' : null, setThemeClassName(__assign(__assign({}, this.props), { name: [
+        return (React.createElement(WrapperComponent, { ref: this.formRef, className: cx("Form", "Form--".concat(mode || 'normal'), columnCount ? "Form--column Form--column-".concat(columnCount) : null, staticClassName && isStatic ? staticClassName : className, isStatic ? 'Form--isStatic' : null, setThemeClassName(__assign(__assign({}, this.props), { name: [
                     'formControlClassName',
                     'itemClassName',
                     'staticClassName',
@@ -1271,16 +1321,14 @@ var Form = /** @class */ (function (_super) {
             }),
             padDom,
             restError && restError.length ? (React.createElement("ul", { className: cx('Form-restError', 'Form-feedback') }, restError.map(function (item, idx) { return (React.createElement("li", { key: idx }, item)); }))) : null,
-            render('modal', __assign(__assign({}, (store.action &&
-                store.action.dialog)), { type: 'dialog' }), {
+            render('modal', __assign(__assign({}, store.dialogSchema), { type: 'dialog' }), {
                 key: 'dialog',
                 data: store.dialogData,
                 onConfirm: this.handleDialogConfirm,
                 onClose: this.handleDialogClose,
                 show: store.dialogOpen
             }),
-            render('modal', __assign(__assign({}, (store.action &&
-                store.action.drawer)), { type: 'drawer' }), {
+            render('modal', __assign(__assign({}, store.drawerSchema), { type: 'drawer' }), {
                 key: 'drawer',
                 data: store.drawerData,
                 onConfirm: this.handleDrawerConfirm,

package/esm/renderers/Item.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.13.0-beta.2
+ * amis-core v6.13.0-beta.21
  * Copyright 2018-2025 fex
  */
 

package/esm/renderers/Options.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.13.0-beta.2
+ * amis-core v6.13.0-beta.21
  * Copyright 2018-2025 fex
  */
 

package/esm/renderers/Placeholder.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.13.0-beta.2
+ * amis-core v6.13.0-beta.21
  * Copyright 2018-2025 fex
  */
 

package/esm/renderers/builtin.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.13.0-beta.2
+ * amis-core v6.13.0-beta.21
  * Copyright 2018-2025 fex
  */
 

package/esm/renderers/register.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.13.0-beta.2
+ * amis-core v6.13.0-beta.21
  * Copyright 2018-2025 fex
  */
 

package/esm/renderers/wrapControl.d.ts

@@ -42,7 +42,6 @@ export interface ControlOutterProps extends RendererProps {
     };
     store?: IIRendererStore;
     onChange?: (value: any, name: string, submit?: boolean, changePristine?: boolean, changeReason?: DataChangeReason) => void;
-    formItemDispatchEvent: (type: string, data: any) => void;
     formItemRef?: (control: any) => void;
 }
 export interface ControlProps {

package/esm/renderers/wrapControl.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.13.0-beta.2
+ * amis-core v6.13.0-beta.21
  * Copyright 2018-2025 fex
  */
 
@@ -19,8 +19,10 @@ import hoistNonReactStatic from 'hoist-non-react-statics';
 import { withRootStore } from '../WithRootStore.js';
 import { TableStore } from '../store/table.js';
 import pick from 'lodash/pick';
+import { reaction } from 'mobx';
 import '../utils/index.js';
 import { tokenize } from '../utils/tokenize.js';
+import { injectObjectChain } from '../utils/object.js';
 import { getVariable } from '../utils/getVariable.js';
 import { callStrFunction } from '../utils/api.js';
 
@@ -57,6 +59,7 @@ function wrapControl(config, ComposedComponent) {
                 if (!name) {
                     return _this;
                 }
+                var valueIsExp = isExpression(value);
                 var propValue = _this.props.value;
                 var model = rootStore.addStore({
                     id: guid(),
@@ -73,8 +76,7 @@ function wrapControl(config, ComposedComponent) {
                     ? __assign(__assign({}, validations), str2rules(config.validations)) : validations;
                 // @issue 打算干掉这个
                 formItem === null || formItem === void 0 ? void 0 : formItem.addSubFormItem(model);
-                model.config(__assign(__assign({}, pick(__assign(__assign({}, ComposedComponent.defaultProps), _this.props.$schema), ['multiple'])), { id: id, type: type, required: props.required || required, unique: unique, value: value, isValueSchemaExp: isExpression(value) &&
-                        value.replace(/\s/g, '') !== "${".concat(name, "}"), rules: rules, messages: validationErrors, delimiter: delimiter, valueField: valueField, labelField: labelField, joinValues: joinValues, extractValue: extractValue, selectFirst: selectFirst, autoFill: autoFill, clearValueOnHidden: clearValueOnHidden, validateApi: validateApi, minLength: minLength, maxLength: maxLength, validateOnChange: validateOnChange, label: label, inputGroupControl: inputGroupControl, extraName: extraName, pagination: pagination }));
+                model.config(__assign(__assign({}, pick(__assign(__assign({}, ComposedComponent.defaultProps), _this.props.$schema), ['multiple'])), { id: id, type: type, required: props.required || required, unique: unique, value: value, isValueSchemaExp: valueIsExp && value.replace(/\s/g, '') !== "${".concat(name, "}"), rules: rules, messages: validationErrors, delimiter: delimiter, valueField: valueField, labelField: labelField, joinValues: joinValues, extractValue: extractValue, selectFirst: selectFirst, autoFill: autoFill, clearValueOnHidden: clearValueOnHidden, validateApi: validateApi, minLength: minLength, maxLength: maxLength, validateOnChange: validateOnChange, label: label, inputGroupControl: inputGroupControl, extraName: extraName, pagination: pagination }));
                 // issue 这个逻辑应该在 combo 里面自己实现。
                 if (_this.model.unique &&
                     ((_b = form === null || form === void 0 ? void 0 : form.parentStore) === null || _b === void 0 ? void 0 : _b.storeType) === ComboStore.name) {
@@ -91,7 +93,13 @@ function wrapControl(config, ComposedComponent) {
                 }
                 if (onChange &&
                     value !== undefined &&
-                    model.tmpValue !== undefined) {
+                    model.tmpValue !== undefined &&
+                    // 要么是默认值起作用了
+                    // 要么是表达式起作用了
+                    // 只有这两种情况才会触发 onChange
+                    // 比如以下 case 就不应该触发
+                    // 关联到上下文数据了，同时设置了默认值，因为是上下文数据优先，这个时候就不应该触发 onChange，因为没变化
+                    (value === model.tmpValue || valueIsExp)) {
                     // 组件默认值支持表达式需要: 避免初始化时上下文中丢失组件默认值
                     if (model.extraName) {
                         var values = model.splitExtraValue(model.tmpValue);
@@ -119,6 +127,17 @@ function wrapControl(config, ComposedComponent) {
                         onChange(model.tmpValue, model.name, false, true);
                     }
                 }
+                _this.reaction = reaction(function () { return model.validatedAt; }, function (validatedAt) {
+                    var _a, _b, _c, _d;
+                    (_b = (_a = _this.props).dispatchEvent) === null || _b === void 0 ? void 0 : _b.call(_a, model.valid
+                        ? 'formItemValidateSucc'
+                        : 'formItemValidateError', injectObjectChain((_d = (_c = _this.props.formStore) === null || _c === void 0 ? void 0 : _c.data) !== null && _d !== void 0 ? _d : _this.props.data, {
+                        __errors: model.errors,
+                        __formName: model.name,
+                        __formValue: model.tmpValue,
+                        __formControl: _this.control
+                    }));
+                });
                 return _this;
             }
             class_1.prototype.componentDidMount = function () {
@@ -373,15 +392,14 @@ function wrapControl(config, ComposedComponent) {
                 }
             };
             class_1.prototype.validate = function () {
-                var _a, _b;
                 return __awaiter(this, void 0, void 0, function () {
-                    var _c, form, data, formItemDispatchEvent, result, combo, group, validPromises, valid;
-                    return __generator(this, function (_d) {
-                        switch (_d.label) {
+                    var _a, form, data, dispatchEvent, result, combo, group, validPromises, valid;
+                    return __generator(this, function (_b) {
+                        switch (_b.label) {
                             case 0:
                                 if (!this.model)
                                     return [2 /*return*/];
-                                _c = this.props, form = _c.formStore, data = _c.data, formItemDispatchEvent = _c.formItemDispatchEvent;
+                                _a = this.props, form = _a.formStore, data = _a.data, dispatchEvent = _a.dispatchEvent;
                                 if (!(this.model.unique &&
                                     (form === null || form === void 0 ? void 0 : form.parentStore) &&
                                     form.parentStore.storeType === ComboStore.name)) return [3 /*break*/, 2];
@@ -392,16 +410,14 @@ function wrapControl(config, ComposedComponent) {
                                 });
                                 return [4 /*yield*/, Promise.all(validPromises)];
                             case 1:
-                                result = _d.sent();
+                                result = _b.sent();
                                 return [3 /*break*/, 4];
                             case 2: return [4 /*yield*/, this.model.validate(data)];
                             case 3:
-                                result = [_d.sent()];
-                                _d.label = 4;
+                                result = [_b.sent()];
+                                _b.label = 4;
                             case 4:
                                 valid = !result.some(function (item) { return item === false; });
-                                (_a = (formItemDispatchEvent !== null && formItemDispatchEvent !== void 0 ? formItemDispatchEvent : this.props.dispatchEvent)) === null || _a === void 0 ? void 0 : _a(valid ? 'formItemValidateSucc' : 'formItemValidateError', (_b = form === null || form === void 0 ? void 0 : form.data) !== null && _b !== void 0 ? _b : this.props.data // form里的一定是最新的数据
-                                );
                                 return [2 /*return*/, valid];
                         }
                     });

package/esm/store/app.d.ts

@@ -17,8 +17,10 @@ export declare const AppStore: import("mobx-state-tree").IModelType<{
     pristineRaw: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IType<any, any, any>, [undefined]>;
     upStreamData: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IType<any, any, any>, [undefined]>;
     action: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IType<any, any, any>, [undefined]>;
+    dialogSchema: import("mobx-state-tree").IType<any, any, any>;
     dialogOpen: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
     dialogData: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IType<any, any, any>, [undefined]>;
+    drawerSchema: import("mobx-state-tree").IType<any, any, any>;
     drawerOpen: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
     drawerData: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IType<any, any, any>, [undefined]>;
 } & {

package/esm/store/app.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.13.0-beta.2
+ * amis-core v6.13.0-beta.21
  * Copyright 2018-2025 fex
  */
 
@@ -7,28 +7,28 @@ import { __assign } from 'tslib';
 import { types } from 'mobx-state-tree';
 import { mapTree, findTree, isVisible, guid, replaceUrlParams } from '../utils/helper.js';
 import { ServiceStore } from './service.js';
+import 'amis-formula';
+import 'moment';
+import { createObject } from '../utils/object.js';
+import '../utils/memoryParse.js';
+import '@rc-component/mini-decimal';
+import 'lodash/isPlainObject';
+import '../utils/filter.js';
 import '../utils/api.js';
 import 'file-saver';
 import '../utils/browser.js';
 import '../utils/ColorScale.js';
 import 'react';
 import 'lodash/chunk';
-import { createObject } from '../utils/object.js';
-import '../utils/memoryParse.js';
-import 'amis-formula';
-import 'lodash/isPlainObject';
 import '../utils/DataSchema.js';
 import '../utils/DataScope.js';
-import 'moment';
 import '../utils/debug.js';
 import 'react-dom';
 import '../utils/errors.js';
 import { filter } from '../utils/tpl.js';
-import '../utils/filter.js';
 import 'lodash/isObject';
 import 'lodash/isString';
 import 'lodash/isBoolean';
-import '@rc-component/mini-decimal';
 import '../utils/image.js';
 import 'lodash/isEqual';
 import '../actions/Action.js';