amis-core 6.6.0 → 6.7.0

package/lib/actions/CmptAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 
@@ -24,12 +24,12 @@ var CmptAction = /** @class */ (function () {
     function CmptAction() {
     }
     CmptAction.prototype.run = function (action, renderer, event) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5;
         return tslib.__awaiter(this, void 0, void 0, function () {
-            var key, dataMergeMode, path, beforeSetData, res, component, msg, _5, dispatchEvent_1, data, valid, e_1, result, e_2;
-            var _6, _7, _8, _9, _10;
-            return tslib.__generator(this, function (_11) {
-                switch (_11.label) {
+            var key, dataMergeMode, path, beforeSetData, res, component, msg, _6, dispatchEvent_1, data, valid, _7, e_1, result, e_2;
+            var _8, _9, _10, _11, _12;
+            return tslib.__generator(this, function (_13) {
+                switch (_13.label) {
                     case 0:
                         key = action.componentId || action.componentName;
                         dataMergeMode = action.dataMergeMode || 'merge';
@@ -39,11 +39,11 @@ var CmptAction = /** @class */ (function () {
                         if (!(beforeSetData && typeof beforeSetData === 'function')) return [3 /*break*/, 2];
                         return [4 /*yield*/, beforeSetData(renderer, action, event)];
                     case 1:
-                        res = _11.sent();
+                        res = _13.sent();
                         if (res === false) {
                             return [2 /*return*/];
                         }
-                        _11.label = 2;
+                        _13.label = 2;
                     case 2:
                         component = key
                             ? (_d = event.context.scoped) === null || _d === void 0 ? void 0 : _d[action.componentId ? 'getComponentById' : 'getComponentByName'](key)
@@ -71,70 +71,77 @@ var CmptAction = /** @class */ (function () {
                             return [2 /*return*/, (_l = component === null || component === void 0 ? void 0 : component.reload) === null || _l === void 0 ? void 0 : _l.call(component, undefined, action.data, event.data, undefined, dataMergeMode === 'override', action.args)];
                         }
                         if (!(action.actionType === 'validateFormItem' &&
-                            ((_o = factory.getRendererByName((_m = component === null || component === void 0 ? void 0 : component.props) === null || _m === void 0 ? void 0 : _m.type)) === null || _o === void 0 ? void 0 : _o.isFormItem))) return [3 /*break*/, 7];
-                        _5 = (component === null || component === void 0 ? void 0 : component.props) || {}, dispatchEvent_1 = _5.dispatchEvent, data = _5.data;
-                        _11.label = 3;
+                            ((_o = factory.getRendererByName((_m = component === null || component === void 0 ? void 0 : component.props) === null || _m === void 0 ? void 0 : _m.type)) === null || _o === void 0 ? void 0 : _o.isFormItem))) return [3 /*break*/, 9];
+                        _6 = (component === null || component === void 0 ? void 0 : component.props) || {}, dispatchEvent_1 = _6.dispatchEvent, data = _6.data;
+                        _13.label = 3;
                     case 3:
-                        _11.trys.push([3, 5, , 6]);
+                        _13.trys.push([3, 7, , 8]);
                         return [4 /*yield*/, ((_q = component === null || component === void 0 ? void 0 : (_p = component.props).onValidate) === null || _q === void 0 ? void 0 : _q.call(_p))];
                     case 4:
-                        valid = _11.sent();
+                        _7 = (_13.sent());
+                        if (_7) return [3 /*break*/, 6];
+                        return [4 /*yield*/, ((_r = component === null || component === void 0 ? void 0 : component.validate) === null || _r === void 0 ? void 0 : _r.call(component))];
+                    case 5:
+                        _7 = (_13.sent());
+                        _13.label = 6;
+                    case 6:
+                        valid = _7;
                         if (valid) {
-                            event.setData(object.createObject(event.data, (_6 = {},
-                                _6[action.outputVar || "".concat(action.actionType, "Result")] = {
+                            event.setData(object.createObject(event.data, (_8 = {},
+                                _8[action.outputVar || "".concat(action.actionType, "Result")] = {
                                     error: '',
-                                    value: (_s = (_r = component === null || component === void 0 ? void 0 : component.props) === null || _r === void 0 ? void 0 : _r.formItem) === null || _s === void 0 ? void 0 : _s.value
+                                    value: (_t = (_s = component === null || component === void 0 ? void 0 : component.props) === null || _s === void 0 ? void 0 : _s.formItem) === null || _t === void 0 ? void 0 : _t.value
                                 },
-                                _6)));
+                                _8)));
                             dispatchEvent_1 && dispatchEvent_1('formItemValidateSucc', data);
                         }
                         else {
-                            event.setData(object.createObject(event.data, (_7 = {},
-                                _7[action.outputVar || "".concat(action.actionType, "Result")] = {
-                                    error: (((_u = (_t = component === null || component === void 0 ? void 0 : component.props) === null || _t === void 0 ? void 0 : _t.formItem) === null || _u === void 0 ? void 0 : _u.errors) || []).join(','),
-                                    value: (_w = (_v = component === null || component === void 0 ? void 0 : component.props) === null || _v === void 0 ? void 0 : _v.formItem) === null || _w === void 0 ? void 0 : _w.value
+                            event.setData(object.createObject(event.data, (_9 = {},
+                                _9[action.outputVar || "".concat(action.actionType, "Result")] = {
+                                    error: (((_v = (_u = component === null || component === void 0 ? void 0 : component.props) === null || _u === void 0 ? void 0 : _u.formItem) === null || _v === void 0 ? void 0 : _v.errors) || []).join(','),
+                                    value: (_x = (_w = component === null || component === void 0 ? void 0 : component.props) === null || _w === void 0 ? void 0 : _w.formItem) === null || _x === void 0 ? void 0 : _x.value
                                 },
-                                _7)));
+                                _9)));
                             dispatchEvent_1 && dispatchEvent_1('formItemValidateError', data);
                         }
-                        return [3 /*break*/, 6];
-                    case 5:
-                        e_1 = _11.sent();
-                        event.setData(object.createObject(event.data, (_8 = {},
-                            _8[action.outputVar || "".concat(action.actionType, "Result")] = {
+                        return [3 /*break*/, 8];
+                    case 7:
+                        e_1 = _13.sent();
+                        event.setData(object.createObject(event.data, (_10 = {},
+                            _10[action.outputVar || "".concat(action.actionType, "Result")] = {
                                 error: e_1.message || '未知错误',
-                                value: (_y = (_x = component === null || component === void 0 ? void 0 : component.props) === null || _x === void 0 ? void 0 : _x.formItem) === null || _y === void 0 ? void 0 : _y.value
+                                value: (_z = (_y = component === null || component === void 0 ? void 0 : component.props) === null || _y === void 0 ? void 0 : _y.formItem) === null || _z === void 0 ? void 0 : _z.value
                             },
-                            _8)));
+                            _10)));
                         dispatchEvent_1 && dispatchEvent_1('formItemValidateError', data);
-                        return [3 /*break*/, 6];
-                    case 6: return [2 /*return*/];
-                    case 7:
-                        _11.trys.push([7, 9, , 10]);
-                        return [4 /*yield*/, ((_z = component === null || component === void 0 ? void 0 : component.doAction) === null || _z === void 0 ? void 0 : _z.call(component, action, event.data, true, action.args))];
-                    case 8:
-                        result = _11.sent();
+                        return [3 /*break*/, 8];
+                    case 8: return [2 /*return*/];
+                    case 9:
+                        _13.trys.push([9, 11, , 12]);
+                        return [4 /*yield*/, ((_0 = component === null || component === void 0 ? void 0 : component.doAction) === null || _0 === void 0 ? void 0 : _0.call(component, action, event.data, true, action.args))];
+                    case 10:
+                        result = _13.sent();
                         if (['validate', 'submit'].includes(action.actionType)) {
-                            event.setData(object.createObject(event.data, (_9 = {},
-                                _9[action.outputVar || "".concat(action.actionType, "Result")] = {
+                            event.setData(object.createObject(event.data, (_11 = {},
+                                _11[action.outputVar || "".concat(action.actionType, "Result")] = {
                                     error: '',
-                                    payload: (_0 = result === null || result === void 0 ? void 0 : result.__payload) !== null && _0 !== void 0 ? _0 : (_2 = (_1 = component === null || component === void 0 ? void 0 : component.props) === null || _1 === void 0 ? void 0 : _1.store) === null || _2 === void 0 ? void 0 : _2.data,
+                                    payload: (_1 = result === null || result === void 0 ? void 0 : result.__payload) !== null && _1 !== void 0 ? _1 : (_3 = (_2 = component === null || component === void 0 ? void 0 : component.props) === null || _2 === void 0 ? void 0 : _2.store) === null || _3 === void 0 ? void 0 : _3.data,
                                     responseData: result === null || result === void 0 ? void 0 : result.__response
                                 },
-                                _9)));
+                                _11)));
                         }
                         return [2 /*return*/, result];
-                    case 9:
-                        e_2 = _11.sent();
-                        event.setData(object.createObject(event.data, (_10 = {},
-                            _10[action.outputVar || "".concat(action.actionType, "Result")] = {
+                    case 11:
+                        e_2 = _13.sent();
+                        event.setData(object.createObject(event.data, (_12 = {},
+                            _12[action.outputVar || "".concat(action.actionType, "Result")] = {
                                 error: e_2.message,
                                 errors: e_2.name === 'ValidateError' ? e_2.detail : e_2,
-                                payload: (_4 = (_3 = component === null || component === void 0 ? void 0 : component.props) === null || _3 === void 0 ? void 0 : _3.store) === null || _4 === void 0 ? void 0 : _4.data
+                                payload: (_5 = (_4 = component === null || component === void 0 ? void 0 : component.props) === null || _4 === void 0 ? void 0 : _4.store) === null || _5 === void 0 ? void 0 : _5.data
                             },
-                            _10)));
-                        return [3 /*break*/, 10];
-                    case 10: return [2 /*return*/];
+                            _12)));
+                        return [3 /*break*/, 12];
+                    case 12: return [2 /*return*/];
                 }
             });
         });

package/lib/actions/ContinueAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/CopyAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/CustomAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 
@@ -64,7 +64,7 @@ var CustomAction = /** @class */ (function () {
     CustomAction.prototype.run = function (action, renderer, event) {
         var _a, _b;
         return tslib.__awaiter(this, void 0, void 0, function () {
-            var scriptFunc;
+            var scriptFunc, proxy;
             return tslib.__generator(this, function (_c) {
                 switch (_c.label) {
                     case 0:
@@ -72,7 +72,15 @@ var CustomAction = /** @class */ (function () {
                         if (typeof scriptFunc === 'string') {
                             scriptFunc = api.str2AsyncFunction(scriptFunc, 'context', 'doAction', 'event');
                         }
-                        return [4 /*yield*/, (scriptFunc === null || scriptFunc === void 0 ? void 0 : scriptFunc.call(null, renderer, function (action) { return Action.runActions(action, renderer, event); }, event, action))];
+                        proxy = new Proxy({}, {
+                            get: function (target, p, receiver) {
+                                var _a, _b;
+                                if (typeof p === 'string') {
+                                    return (_b = (_a = event.context.scoped) === null || _a === void 0 ? void 0 : _a.getComponentByName) === null || _b === void 0 ? void 0 : _b.call(_a, p);
+                                }
+                            }
+                        });
+                        return [4 /*yield*/, (scriptFunc === null || scriptFunc === void 0 ? void 0 : scriptFunc.call(proxy, renderer, function (action) { return Action.runActions(action, renderer, event); }, event, action))];
                     case 1:
                         _c.sent();
                         return [2 /*return*/];

package/lib/actions/DialogAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/DrawerAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/EmailAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/EventAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/LinkAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/LoopAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/PageAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/ParallelAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/PrintAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/StatusAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/SwitchAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/ToastAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/actions/WaitAction.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/components/CustomStyle.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/components/ErrorBoundary.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/components/LazyComponent.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/components/Overlay.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/components/PopOver.d.ts

@@ -6,6 +6,7 @@
 /// <reference types="hoist-non-react-statics" />
 import React from 'react';
 import { ClassNamesFn } from '../theme';
+import type { TestIdBuilder } from 'amis-core';
 export interface Offset {
     x: number;
     y: number;
@@ -24,6 +25,7 @@ export interface PopOverProps {
     onClick?: (e: React.MouseEvent<any>) => void;
     classPrefix: string;
     classnames: ClassNamesFn;
+    testIdBuilder?: TestIdBuilder;
     [propName: string]: any;
 }
 interface PopOverState {

package/lib/components/PopOver.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 
@@ -161,12 +161,12 @@ var PopOver = /** @class */ (function (_super) {
         });
     };
     PopOver.prototype.render = function () {
-        var _a = this.props; _a.placement; var activePlacement = _a.activePlacement, positionTop = _a.positionTop, positionLeft = _a.positionLeft; _a.arrowOffsetLeft; _a.arrowOffsetTop; var style = _a.style, children = _a.children; _a.offset; var overlay = _a.overlay, onHide = _a.onHide, ns = _a.classPrefix, cx = _a.classnames, className = _a.className; _a.componentId; var rest = tslib.__rest(_a, ["placement", "activePlacement", "positionTop", "positionLeft", "arrowOffsetLeft", "arrowOffsetTop", "style", "children", "offset", "overlay", "onHide", "classPrefix", "classnames", "className", "componentId"]);
+        var _a = this.props; _a.placement; var activePlacement = _a.activePlacement, positionTop = _a.positionTop, positionLeft = _a.positionLeft; _a.arrowOffsetLeft; _a.arrowOffsetTop; var style = _a.style, children = _a.children; _a.offset; var overlay = _a.overlay, onHide = _a.onHide, ns = _a.classPrefix, cx = _a.classnames, className = _a.className; _a.componentId; var testIdBuilder = _a.testIdBuilder, rest = tslib.__rest(_a, ["placement", "activePlacement", "positionTop", "positionLeft", "arrowOffsetLeft", "arrowOffsetTop", "style", "children", "offset", "overlay", "onHide", "classPrefix", "classnames", "className", "componentId", "testIdBuilder"]);
         var _b = this.state, xOffset = _b.xOffset, yOffset = _b.yOffset;
         var outerStyle = tslib.__assign(tslib.__assign({ display: 'block' }, style), { top: positionTop + yOffset, left: positionLeft + xOffset });
         var placements = typeof activePlacement === 'string' ? activePlacement.split('-') : [];
-        return (_J$X_("div", tslib.__assign({ ref: this.wrapperRef, role: "popover", className: cx("PopOver", className, "PopOver--".concat(helper.camel(activePlacement)), placements[3] ? "PopOver--v-".concat(placements[3]) : ''), style: outerStyle }, rest),
-            overlay ? (_J$X_("div", { className: "".concat(ns, "PopOver-overlay"), onClick: onHide })) : null,
+        return (_J$X_("div", tslib.__assign({ ref: this.wrapperRef, role: "popover", className: cx("PopOver", className, "PopOver--".concat(helper.camel(activePlacement)), placements[3] ? "PopOver--v-".concat(placements[3]) : ''), style: outerStyle }, testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getTestId(), rest),
+            overlay ? (_J$X_("div", tslib.__assign({ className: "".concat(ns, "PopOver-overlay"), onClick: onHide }, testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild('overlay').getTestId()))) : null,
             children));
     };
     PopOver.defaultProps = {

package/lib/env.d.ts

@@ -90,6 +90,10 @@ export interface RendererEnv {
      * 是否开启 testid 定位
      */
     enableTestid?: boolean;
+    /**
+     * pdfjs worker 地址，用于渲染 pdf
+     */
+    pdfjsWorkerSrc?: string;
     /**
      * 替换文本，用于实现 URL 替换、语言替换等
      */

package/lib/env.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/envOverwrite.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/factory.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/index.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 
@@ -139,7 +139,7 @@ var _J$X_ = (__react_jsx__["default"] || __react_jsx__).createElement;
 (__react_jsx__["default"] || __react_jsx__).Fragment;
 var classPrefix = theme.getClassPrefix();
 // @ts-ignore
-var version = '6.6.0';
+var version = '6.7.0';
 function render(schema, props, options, pathPrefix) {
     if (props === void 0) { props = {}; }
     if (options === void 0) { options = {}; }
@@ -371,6 +371,7 @@ exports.rmUndefined = helper.rmUndefined;
 exports.someTree = helper.someTree;
 exports.sortArray = helper.sortArray;
 exports.spliceTree = helper.spliceTree;
+exports.supportsMjs = helper.supportsMjs;
 exports.syncDataFromSuper = helper.syncDataFromSuper;
 exports.ucFirst = helper.ucFirst;
 exports.until = helper.until;

package/lib/locale.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/polyfills.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 

package/lib/renderers/Form.js

@@ -1,5 +1,5 @@
 /**
- * amis-core v6.6.0
+ * amis-core v6.7.0
  * Copyright 2018-2024 fex
  */
 
@@ -50,10 +50,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 +58,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 }; }
 
@@ -1238,14 +1236,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 +1279,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 +1363,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

@@ -523,7 +523,7 @@ export declare class FormItemWrap extends React.Component<FormItemProps> {
     static layoutRenderers: {
         [propsName: string]: (props: FormItemProps, renderControl: () => JSX.Element | null) => JSX.Element;
     };
-    render(): React.JSX.Element | null;
+    render(): JSX.Element | null;
 }
 export declare const detectProps: string[];
 export declare function asFormItem(config: Omit<FormItemConfig, 'component'>): (Control: FormControlComponent) => {