amis-core 6.6.0 → 6.8.0

package/lib/renderers/Form.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.8.0
  * Copyright 2018-2024 fex
  */
 
@@ -21,6 +21,7 @@ var Scoped = require('../Scoped.js');
 require('amis-formula');
 require('moment');
 var object = require('../utils/object.js');
+require('../utils/memoryParse.js');
 require('@rc-component/mini-decimal');
 var dataMapping = require('../utils/dataMapping.js');
 require('../utils/filter.js');
@@ -50,10 +51,7 @@ require('react-dom');
 require('../utils/SimpleMap.js');
 require('lodash/mapValues');
 require('lodash/camelCase');
-require('lodash/cloneDeep');
-require('lodash/map');
-require('lodash/isEmpty');
-require('lodash/kebabCase');
+var styleHelper = require('../utils/style-helper.js');
 require('uncontrollable');
 require('hoist-non-react-statics');
 require('../utils/validations.js');
@@ -61,6 +59,7 @@ require('../utils/resolveCondition.js');
 var mobx = require('mobx');
 require('../utils/Animation.js');
 var groupBy = require('lodash/groupBy');
+var CustomStyle = require('../components/CustomStyle.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -112,7 +111,7 @@ var Form = /** @class */ (function (_super) {
         _this.blockRouting = _this.blockRouting.bind(_this);
         _this.beforePageUnload = _this.beforePageUnload.bind(_this);
         _this.formItemDispatchEvent = _this.formItemDispatchEvent.bind(_this);
-        var store = props.store, canAccessSuperData = props.canAccessSuperData, persistData = props.persistData, simpleMode = props.simpleMode;
+        var store = props.store, canAccessSuperData = props.canAccessSuperData, persistData = props.persistData, simpleMode = props.simpleMode, formLazyChange = props.formLazyChange;
         store.setCanAccessSuperData(canAccessSuperData !== false);
         store.setPersistData(persistData);
         if (simpleMode) {
@@ -132,7 +131,7 @@ var Form = /** @class */ (function (_super) {
         // https://github.com/baidu/amis/issues/8773
         _this.toDispose.push(mobx.reaction(function () { return store.initedAt; }, function () {
             store.inited &&
-                _this.lazyEmitChange(!!_this.props.submitOnChange, true);
+                (formLazyChange === false ? _this.emitChange : _this.lazyEmitChange)(!!_this.props.submitOnChange, true);
         }));
         return _this;
     }
@@ -491,29 +490,54 @@ var Form = /** @class */ (function (_super) {
     };
     Form.prototype.flush = function () {
         return tslib.__awaiter(this, void 0, void 0, function () {
-            var hooks;
-            return tslib.__generator(this, function (_a) {
-                switch (_a.label) {
+            var hooks, hooks_1, hooks_1_1, hook, e_1_1;
+            var e_1, _a;
+            return tslib.__generator(this, function (_b) {
+                switch (_b.label) {
                     case 0:
-                        _a.trys.push([0, , 4, 5]);
+                        _b.trys.push([0, , 11, 12]);
                         if (this.flushing) {
                             return [2 /*return*/];
                         }
                         this.flushing = true;
                         hooks = this.hooks['flush'] || [];
-                        return [4 /*yield*/, Promise.all(hooks.map(function (fn) { return fn(); }))];
+                        _b.label = 1;
                     case 1:
-                        _a.sent();
-                        if (!!this.emitting) return [3 /*break*/, 3];
-                        return [4 /*yield*/, this.lazyEmitChange.flush()];
+                        _b.trys.push([1, 6, 7, 8]);
+                        hooks_1 = tslib.__values(hooks), hooks_1_1 = hooks_1.next();
+                        _b.label = 2;
                     case 2:
-                        _a.sent();
-                        _a.label = 3;
-                    case 3: return [3 /*break*/, 5];
+                        if (!!hooks_1_1.done) return [3 /*break*/, 5];
+                        hook = hooks_1_1.value;
+                        return [4 /*yield*/, hook()];
+                    case 3:
+                        _b.sent();
+                        _b.label = 4;
                     case 4:
+                        hooks_1_1 = hooks_1.next();
+                        return [3 /*break*/, 2];
+                    case 5: return [3 /*break*/, 8];
+                    case 6:
+                        e_1_1 = _b.sent();
+                        e_1 = { error: e_1_1 };
+                        return [3 /*break*/, 8];
+                    case 7:
+                        try {
+                            if (hooks_1_1 && !hooks_1_1.done && (_a = hooks_1.return)) _a.call(hooks_1);
+                        }
+                        finally { if (e_1) throw e_1.error; }
+                        return [7 /*endfinally*/];
+                    case 8:
+                        if (!!this.emitting) return [3 /*break*/, 10];
+                        return [4 /*yield*/, this.lazyEmitChange.flush()];
+                    case 9:
+                        _b.sent();
+                        _b.label = 10;
+                    case 10: return [3 /*break*/, 12];
+                    case 11:
                         this.flushing = false;
                         return [7 /*endfinally*/];
-                    case 5: return [2 /*return*/];
+                    case 12: return [2 /*return*/];
                 }
             });
         });
@@ -1238,14 +1262,20 @@ var Form = /** @class */ (function (_super) {
         return render("".concat(region ? "".concat(region, "/") : '').concat(key), subSchema, subProps);
     };
     Form.prototype.renderBody = function () {
-        var _a = this.props, body = _a.body, mode = _a.mode, className = _a.className, cx = _a.classnames, debug = _a.debug, debugConfig = _a.debugConfig, $path = _a.$path, store = _a.store, columnCount = _a.columnCount, render = _a.render, staticClassName = _a.staticClassName, _b = _a.static, isStatic = _b === void 0 ? false : _b, loadingConfig = _a.loadingConfig; _a.testid;
+        var _a = this.props, body = _a.body, mode = _a.mode, className = _a.className, cx = _a.classnames, debug = _a.debug, debugConfig = _a.debugConfig, $path = _a.$path, store = _a.store, columnCount = _a.columnCount, render = _a.render, staticClassName = _a.staticClassName, _b = _a.static, isStatic = _b === void 0 ? false : _b, loadingConfig = _a.loadingConfig, themeCss = _a.themeCss, id = _a.id, wrapperCustomStyle = _a.wrapperCustomStyle, env = _a.env, wrapWithPanel = _a.wrapWithPanel; _a.testid;
         var restError = store.restError;
         var WrapperComponent = this.props.wrapperComponent ||
             (/(?:\/|^)form\//.test($path) ? 'div' : 'form');
         var padDom = helper.repeatCount(columnCount && Array.isArray(body)
             ? (columnCount - (body.length % columnCount)) % columnCount
             : 0, function (index) { return (_J$X_("div", { className: cx("Form-item Form-item--".concat(mode, " is-placeholder")), key: index })); });
-        return (_J$X_(WrapperComponent, { className: cx("Form", "Form--".concat(mode || 'normal'), columnCount ? "Form--column Form--column-".concat(columnCount) : null, staticClassName && isStatic ? staticClassName : className, isStatic ? 'Form--isStatic' : null), onSubmit: this.handleFormSubmit, noValidate: true },
+        return (_J$X_(WrapperComponent, { className: cx("Form", "Form--".concat(mode || 'normal'), columnCount ? "Form--column Form--column-".concat(columnCount) : null, staticClassName && isStatic ? staticClassName : className, isStatic ? 'Form--isStatic' : null, styleHelper.setThemeClassName(tslib.__assign(tslib.__assign({}, this.props), { name: [
+                    'formControlClassName',
+                    'itemClassName',
+                    'staticClassName',
+                    'itemLabelClassName'
+                ], id: id, themeCss: themeCss })), !wrapWithPanel &&
+                styleHelper.setThemeClassName(tslib.__assign(tslib.__assign({}, this.props), { name: 'wrapperCustomStyle', id: id, themeCss: wrapperCustomStyle }))), onSubmit: this.handleFormSubmit, noValidate: true },
             _J$X_("input", { type: "submit", style: { display: 'none' } }),
             debug
                 ? render('form-debug-json', tslib.__assign({ type: 'json', value: store.data, ellipsisThreshold: 120, className: cx('Form--debug') }, debugConfig))
@@ -1275,17 +1305,81 @@ var Form = /** @class */ (function (_super) {
                 onConfirm: this.handleDrawerConfirm,
                 onClose: this.handleDrawerClose,
                 show: store.drawerOpen
-            })));
+            }),
+            _J$X_(CustomStyle["default"], tslib.__assign({}, this.props, { config: {
+                    themeCss: themeCss,
+                    classNames: [
+                        wrapWithPanel && {
+                            key: 'panelClassName'
+                        },
+                        !wrapWithPanel && {
+                            key: 'formControlClassName'
+                        },
+                        {
+                            key: 'headerControlClassName',
+                            weights: {
+                                default: {
+                                    parent: ".".concat(cx('Panel'))
+                                }
+                            }
+                        },
+                        wrapWithPanel && {
+                            key: 'headerTitleControlClassName',
+                            weights: {
+                                default: {
+                                    important: true
+                                }
+                            }
+                        },
+                        wrapWithPanel && {
+                            key: 'bodyControlClassName'
+                        },
+                        wrapWithPanel && {
+                            key: 'actionsControlClassName',
+                            weights: {
+                                default: {
+                                    parent: ".".concat(cx('Panel--form'))
+                                }
+                            }
+                        },
+                        {
+                            key: 'itemClassName',
+                            weights: {
+                                default: {
+                                    inner: ".".concat(cx('Form-item'))
+                                }
+                            }
+                        },
+                        {
+                            key: 'staticClassName',
+                            weights: {
+                                default: {
+                                    inner: ".".concat(cx('Form-static'))
+                                }
+                            }
+                        },
+                        {
+                            key: 'itemLabelClassName',
+                            weights: {
+                                default: {
+                                    inner: ".".concat(cx('Form-label'))
+                                }
+                            }
+                        }
+                    ].filter(function (n) { return n; }),
+                    wrapperCustomStyle: wrapperCustomStyle,
+                    id: id
+                }, env: env }))));
     };
     Form.prototype.render = function () {
-        var _a = this.props; _a.$path; _a.$schema; var wrapWithPanel = _a.wrapWithPanel, render = _a.render, title = _a.title, store = _a.store, panelClassName = _a.panelClassName, headerClassName = _a.headerClassName, footerClassName = _a.footerClassName, footerWrapClassName = _a.footerWrapClassName, actionsClassName = _a.actionsClassName, bodyClassName = _a.bodyClassName, cx = _a.classnames, style = _a.style, affixFooter = _a.affixFooter, lazyLoad = _a.lazyLoad, __ = _a.translate, footer = _a.footer;
+        var _a = this.props; _a.$path; _a.$schema; var wrapWithPanel = _a.wrapWithPanel, render = _a.render, title = _a.title, store = _a.store, panelClassName = _a.panelClassName, headerClassName = _a.headerClassName, footerClassName = _a.footerClassName, footerWrapClassName = _a.footerWrapClassName, actionsClassName = _a.actionsClassName, bodyClassName = _a.bodyClassName, cx = _a.classnames, style = _a.style, affixFooter = _a.affixFooter, lazyLoad = _a.lazyLoad, __ = _a.translate, footer = _a.footer, id = _a.id, wrapperCustomStyle = _a.wrapperCustomStyle, themeCss = _a.themeCss;
         var body = this.renderBody();
         if (wrapWithPanel) {
             body = render('body', {
                 type: 'panel',
                 title: __(title)
             }, {
-                className: cx(panelClassName, 'Panel--form'),
+                className: cx(panelClassName, 'Panel--form', styleHelper.setThemeClassName(tslib.__assign(tslib.__assign({}, this.props), { name: 'wrapperCustomStyle', id: id, themeCss: wrapperCustomStyle })), styleHelper.setThemeClassName(tslib.__assign(tslib.__assign({}, this.props), { name: 'panelClassName', id: id, themeCss: themeCss }))),
                 style: style,
                 formStore: this.props.store,
                 children: body,
@@ -1295,11 +1389,15 @@ var Form = /** @class */ (function (_super) {
                 disabled: store.loading,
                 btnDisabled: store.loading || store.validating,
                 headerClassName: headerClassName,
+                headerControlClassName: styleHelper.setThemeClassName(tslib.__assign(tslib.__assign({}, this.props), { name: 'headerControlClassName', id: id, themeCss: themeCss })),
+                headerTitleControlClassName: styleHelper.setThemeClassName(tslib.__assign(tslib.__assign({}, this.props), { name: 'headerTitleControlClassName', id: id, themeCss: themeCss })),
                 footer: footer,
                 footerClassName: footerClassName,
                 footerWrapClassName: footerWrapClassName,
                 actionsClassName: actionsClassName,
+                actionsControlClassName: styleHelper.setThemeClassName(tslib.__assign(tslib.__assign({}, this.props), { name: 'actionsControlClassName', id: id, themeCss: themeCss })),
                 bodyClassName: bodyClassName,
+                bodyControlClassName: styleHelper.setThemeClassName(tslib.__assign(tslib.__assign({}, this.props), { name: 'bodyControlClassName', id: id, themeCss: themeCss })),
                 affixFooter: affixFooter
             });
         }

package/lib/renderers/Item.d.ts

@@ -5,6 +5,7 @@ import { IFormItemStore, IFormStore } from '../store/form';
 import { RendererProps, TestFunc, RendererConfig } from '../factory';
 import { FormHorizontal, FormSchemaBase } from './Form';
 import { ActionObject, BaseApiObject, BaseSchemaWithoutType, ClassName, Schema } from '../types';
+import { IScopedContext } from '../Scoped';
 export type LabelAlign = 'right' | 'left' | 'top' | 'inherit';
 export interface FormBaseControl extends BaseSchemaWithoutType {
     /**
@@ -303,6 +304,10 @@ export interface FormBaseControl extends BaseSchemaWithoutType {
          * 是否为参照录入模式，参照录入会展示候选值供用户选择，而不是直接填充。
          */
         showSuggestion?: boolean;
+        /**
+         * 参照录入时，默认选中的值
+         */
+        defaultSelection?: any;
         /**
          * 自动填充 api
          */
@@ -321,7 +326,7 @@ export interface FormBaseControl extends BaseSchemaWithoutType {
         /**
          * 触发条件，默认为 change
          */
-        trigger?: 'change' | 'foucs';
+        trigger?: 'change' | 'focus' | 'blur';
         /**
          * 弹窗方式，当为参照录入时用可以配置
          */
@@ -359,6 +364,10 @@ export interface FormItemBasicConfig extends Partial<RendererConfig> {
     storeType?: string;
     validations?: string;
     strictMode?: boolean;
+    /**
+     * 是否是瘦子
+     */
+    thin?: boolean;
     /**
      * schema变化使视图更新的属性白名单
      */
@@ -444,7 +453,76 @@ export declare class FormItemWrap extends React.Component<FormItemProps> {
     updateAutoFillData(context: any): void;
     syncApiAutoFill: import("lodash").DebouncedFunc<(term: any, forceLoad?: boolean, skipIfExits?: any) => Promise<void>>;
     syncOptionAutoFill(selectedOptions: Array<any>, skipIfExits?: boolean): void;
-    buildAutoFillSchema(): React.JSX.Element | {
+    /**
+     * 应用映射函数，根据给定的映射关系，更新数据对象
+     *
+     * @param mapping 映射关系，类型为任意类型
+     * @param ctx 上下文对象，类型为任意类型
+     * @param skipIfExits 是否跳过已存在的属性，默认为 false
+     */
+    applyMapping(mapping: any, ctx: any, skipIfExits?: boolean, ignoreSelf?: boolean): void;
+    buildAutoFillSchema(): {
+        popOverContainer: any;
+        popOverClassName: any;
+        placement: any;
+        offset: any;
+        body: {
+            type: string;
+            title: string;
+            className: string;
+            body: {
+                type: string;
+                embed: boolean;
+                joinValues: boolean;
+                strictMode: boolean;
+                label: boolean;
+                labelField: any;
+                valueField: any;
+                multiple: any;
+                name: string;
+                value: any;
+                options: never[];
+                required: boolean;
+                source: any;
+                pickerSchema: {
+                    type: string;
+                    bodyClassName: string;
+                    affixHeader: boolean;
+                    alwaysShowPagination: boolean;
+                    keepItemSelectionOnPageChange: boolean;
+                    headerToolbar: never[];
+                    footerToolbar: ({
+                        type: string;
+                        align: string;
+                        className?: undefined;
+                    } | {
+                        type: string;
+                        align: string;
+                        className: string;
+                    })[];
+                    multiple: any;
+                    filter: any;
+                    columns: any;
+                };
+            }[];
+            actions: ({
+                type: string;
+                actionType: string;
+                label: any;
+                level?: undefined;
+            } | {
+                type: string;
+                actionType: string;
+                level: string;
+                label: any;
+            })[];
+        };
+        type?: undefined;
+        className?: undefined;
+        title?: undefined;
+        size?: undefined;
+        actions?: undefined;
+    } | {
         type: any;
         className: string;
         title: any;
@@ -458,16 +536,19 @@ export declare class FormItemWrap extends React.Component<FormItemProps> {
                 type: string;
                 embed: boolean;
                 joinValues: boolean;
+                strictMode: boolean;
                 label: boolean;
                 labelField: any;
                 valueField: any;
                 multiple: any;
                 name: string;
+                value: any;
                 options: never[];
                 required: boolean;
                 source: any;
                 pickerSchema: {
                     type: string;
+                    bodyClassName: string;
                     affixHeader: boolean;
                     alwaysShowPagination: boolean;
                     keepItemSelectionOnPageChange: boolean;
@@ -485,7 +566,7 @@ export declare class FormItemWrap extends React.Component<FormItemProps> {
                     filter: any;
                     columns: any;
                 };
-            };
+            }[];
             actions: ({
                 type: string;
                 actionType: string;
@@ -509,10 +590,14 @@ export declare class FormItemWrap extends React.Component<FormItemProps> {
             level: string;
             label: any;
         })[];
+        popOverContainer?: undefined;
+        popOverClassName?: undefined;
+        placement?: undefined;
+        offset?: undefined;
     } | undefined;
-    handleSubmit(values: any): void;
-    handleAction(e: React.UIEvent<any>, action: ActionObject, data: object): void;
-    handleClose(): void;
+    handlePopOverConfirm(values: any): void;
+    handlePopOverAction(e: React.UIEvent<any>, action: ActionObject, data: object, throwErrors?: boolean, delegate?: IScopedContext): any;
+    closePopOver(): void;
     handleOpenDialog(schema: Schema, data: any): Promise<unknown>;
     handleDialogConfirm([values]: Array<any>): void;
     handleDialogClose(confirmed?: boolean): void;
@@ -558,10 +643,10 @@ export declare function asFormItem(config: Omit<FormItemConfig, 'component'>): (
         storeType: string;
     } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
         readonly fetcher: any;
-        readonly notify: any;
-        readonly isCancel: (value: any) => boolean; /**
-         * 当修改完的时候是否提交表单。
+        readonly notify: any; /**
+         * 显示一个小图标, 鼠标放上去的时候显示提示内容
          */
+        readonly isCancel: (value: any) => boolean;
         readonly __: import("..").TranslateFn<any>;
         getStoreById(id: string): {
             id: string;
@@ -724,10 +809,10 @@ export declare function asFormItem(config: Omit<FormItemConfig, 'component'>): (
         storeType: import("mobx-state-tree").IType<string | undefined, string, string>;
     }, {
         readonly fetcher: any;
-        readonly notify: any;
-        readonly isCancel: (value: any) => boolean; /**
-         * 当修改完的时候是否提交表单。
+        readonly notify: any; /**
+         * 显示一个小图标, 鼠标放上去的时候显示提示内容
          */
+        readonly isCancel: (value: any) => boolean;
         readonly __: import("..").TranslateFn<any>;
         getStoreById(id: string): {
             id: string;