amis 2.5.2-beta.0 → 2.5.3-beta.0

package/esm/compat.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/index.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/preset.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/renderers/Action.d.ts

@@ -335,22 +335,22 @@ declare const _default: {
         componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
         getSnapshotBeforeUpdate?(prevProps: Readonly<Omit<ActionProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, prevState: Readonly<{}>): any;
         componentDidUpdate?(prevProps: Readonly<Omit<ActionProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, prevState: Readonly<{}>, snapshot?: any): void;
-        componentWillMount?(): void;
+        componentWillMount?(): void; /**
+         * 指定为打开弹窗，抽出式弹窗
+         */
         UNSAFE_componentWillMount?(): void;
         componentWillReceiveProps?(nextProps: Readonly<Omit<ActionProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, nextContext: any): void;
         UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Omit<ActionProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, nextContext: any): void;
         componentWillUpdate?(nextProps: Readonly<Omit<ActionProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): void;
-        UNSAFE_componentWillUpdate?(nextProps: Readonly<Omit<ActionProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<Omit<ActionProps, keyof ThemeProps> & import("amis-core/lib/theme").ThemeOutterProps>, nextState: Readonly<{}>, nextContext: any): void; /**
+         * 跳转到哪？支持配置相对路径。
+         */
     };
-    displayName: string; /**
-     * 跳转到哪？支持配置相对路径。
-     */
+    displayName: string;
     contextType: React.Context<string>;
     ComposedComponent: React.ComponentType<typeof Action>;
 } & import("hoist-non-react-statics").NonReactStatics<typeof Action, {}> & {
-    ComposedComponent: typeof Action; /**
-     * 指定目标组件。
-     */
+    ComposedComponent: typeof Action;
 };
 export default _default;
 export type ActionRendererProps = RendererProps & Omit<ActionProps, 'onAction' | 'isCurrentUrl' | 'tooltipContainer'> & {

package/esm/renderers/Action.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -227,10 +227,10 @@ var Action = /** @class */ (function (_super) {
     };
     Action.prototype.render = function () {
         var _a;
-        var _b = this.props, type = _b.type, icon = _b.icon, iconClassName = _b.iconClassName, rightIcon = _b.rightIcon, rightIconClassName = _b.rightIconClassName, loadingClassName = _b.loadingClassName, primary = _b.primary, size = _b.size, level = _b.level, countDownTpl = _b.countDownTpl, block = _b.block, className = _b.className, componentClass = _b.componentClass, tooltip = _b.tooltip, disabledTip = _b.disabledTip, tooltipPlacement = _b.tooltipPlacement, actionType = _b.actionType, link = _b.link, data = _b.data, __ = _b.translate, activeClassName = _b.activeClassName, isCurrentUrl = _b.isCurrentUrl, isMenuItem = _b.isMenuItem, active = _b.active, activeLevel = _b.activeLevel, tooltipTrigger = _b.tooltipTrigger, tooltipContainer = _b.tooltipContainer, tooltipRootClose = _b.tooltipRootClose, loading = _b.loading, body = _b.body, render = _b.render, onMouseEnter = _b.onMouseEnter, onMouseLeave = _b.onMouseLeave, cx = _b.classnames, ns = _b.classPrefix;
+        var _b = this.props, type = _b.type, icon = _b.icon, iconClassName = _b.iconClassName, rightIcon = _b.rightIcon, rightIconClassName = _b.rightIconClassName, loadingClassName = _b.loadingClassName, primary = _b.primary, size = _b.size, level = _b.level, countDownTpl = _b.countDownTpl, block = _b.block, className = _b.className, style = _b.style, componentClass = _b.componentClass, tooltip = _b.tooltip, disabledTip = _b.disabledTip, tooltipPlacement = _b.tooltipPlacement, actionType = _b.actionType, link = _b.link, data = _b.data, __ = _b.translate, activeClassName = _b.activeClassName, isCurrentUrl = _b.isCurrentUrl, isMenuItem = _b.isMenuItem, active = _b.active, activeLevel = _b.activeLevel, tooltipTrigger = _b.tooltipTrigger, tooltipContainer = _b.tooltipContainer, tooltipRootClose = _b.tooltipRootClose, loading = _b.loading, body = _b.body, render = _b.render, onMouseEnter = _b.onMouseEnter, onMouseLeave = _b.onMouseLeave, cx = _b.classnames, ns = _b.classPrefix;
         if (actionType !== 'email' && body) {
             return (React.createElement(TooltipWrapper, { classPrefix: ns, classnames: cx, placement: tooltipPlacement, tooltip: tooltip, container: tooltipContainer, trigger: tooltipTrigger, rootClose: tooltipRootClose },
-                React.createElement("div", { className: cx('Action', className), onClick: this.handleAction, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, render('body', body))));
+                React.createElement("div", { className: cx('Action', className), style: style, onClick: this.handleAction, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, render('body', body))));
         }
         var label = this.props.label;
         var disabled = this.props.disabled;
@@ -247,7 +247,7 @@ var Action = /** @class */ (function (_super) {
         var rightIconElement = generateIcon(cx, rightIcon, 'Button-icon', rightIconClassName);
         return (React.createElement(Button, { className: cx(className, (_a = {},
                 _a[activeClassName || 'is-active'] = isActive,
-                _a)), size: size, level: activeLevel && isActive
+                _a)), style: style, size: size, level: activeLevel && isActive
                 ? activeLevel
                 : level || (primary ? 'primary' : undefined), loadingClassName: loadingClassName, loading: loading, onClick: this.handleAction, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, type: type && ~allowedType.indexOf(type) ? type : 'button', disabled: disabled, componentClass: isMenuItem ? 'a' : componentClass, overrideClassName: isMenuItem, tooltip: filterContents(tooltip, data), disabledTip: filterContents(disabledTip, data), tooltipPlacement: tooltipPlacement, tooltipContainer: tooltipContainer, tooltipTrigger: tooltipTrigger, tooltipRootClose: tooltipRootClose, block: block, iconOnly: !!(icon && !label && level !== 'link') },
             !loading ? iconElement : '',

package/esm/renderers/Alert.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/renderers/AnchorNav.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -46,7 +46,7 @@ var AnchorNav = /** @class */ (function (_super) {
     };
     AnchorNav.prototype.render = function () {
         var _this = this;
-        var _a = this.props, cx = _a.classnames, ns = _a.classPrefix, className = _a.className, linkClassName = _a.linkClassName, sectionClassName = _a.sectionClassName, direction = _a.direction, sectionRender = _a.sectionRender, render = _a.render, data = _a.data;
+        var _a = this.props, cx = _a.classnames, ns = _a.classPrefix, className = _a.className, style = _a.style, linkClassName = _a.linkClassName, sectionClassName = _a.sectionClassName, direction = _a.direction, sectionRender = _a.sectionRender, render = _a.render, data = _a.data;
         var links = this.props.links;
         if (!links) {
             return null;
@@ -60,7 +60,7 @@ var AnchorNav = /** @class */ (function (_super) {
                     ? sectionRender(section, _this.props, index)
                     : render("section/".concat(index), section.body || ''))) : null;
         });
-        return (React.createElement(AnchorNav$1, { classPrefix: ns, classnames: cx, className: className, linkClassName: linkClassName, sectionClassName: sectionClassName, onSelect: this.handleSelect, active: this.state.active, direction: direction }, children));
+        return (React.createElement(AnchorNav$1, { classPrefix: ns, classnames: cx, className: className, style: style, linkClassName: linkClassName, sectionClassName: sectionClassName, onSelect: this.handleSelect, active: this.state.active, direction: direction }, children));
     };
     AnchorNav.defaultProps = {
         className: '',

package/esm/renderers/App.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/renderers/Audio.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -241,9 +241,9 @@ var Audio = /** @class */ (function (_super) {
     };
     Audio.prototype.render = function () {
         var _this = this;
-        var _a = this.props, className = _a.className, inline = _a.inline, autoPlay = _a.autoPlay, loop = _a.loop, controls = _a.controls, cx = _a.classnames;
+        var _a = this.props, className = _a.className, style = _a.style, inline = _a.inline, autoPlay = _a.autoPlay, loop = _a.loop, controls = _a.controls, cx = _a.classnames;
         var _b = this.state, muted = _b.muted, src = _b.src;
-        return (React.createElement("div", { className: cx('Audio', className, inline ? 'Audio--inline' : '') },
+        return (React.createElement("div", { className: cx('Audio', className, inline ? 'Audio--inline' : ''), style: style },
             React.createElement("audio", { className: cx('Audio-original'), ref: this.audioRef, onCanPlay: this.load, autoPlay: autoPlay, controls: true, muted: muted, loop: loop },
                 React.createElement("source", { src: src })),
             React.createElement("div", { className: cx('Audio-controls') }, controls &&

package/esm/renderers/Avatar.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/renderers/BarCode.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -14,10 +14,10 @@ var BarCodeField = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     BarCodeField.prototype.render = function () {
-        var _a = this.props, className = _a.className; _a.width; _a.height; var cx = _a.classnames, options = _a.options;
+        var _a = this.props, className = _a.className, style = _a.style; _a.width; _a.height; var cx = _a.classnames, options = _a.options;
         var value = getPropValue(this.props);
         return (React.createElement(Suspense, { fallback: React.createElement("div", null, "...") },
-            React.createElement("div", { "data-testid": "barcode", className: cx('BarCode', className) },
+            React.createElement("div", { "data-testid": "barcode", className: cx('BarCode', className), style: style },
                 React.createElement(BarCode, { value: value, options: options }))));
     };
     return BarCodeField;

package/esm/renderers/Breadcrumb.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/renderers/ButtonGroup.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/renderers/CRUD.d.ts

@@ -245,6 +245,8 @@ export default class CRUD extends React.Component<CRUDProps, any> {
     lastData: any;
     timer: ReturnType<typeof setTimeout>;
     mounted: boolean;
+    /** 父容器, 主要用于定位CRUD内部popover的挂载点 */
+    parentContainer: Element | null;
     constructor(props: CRUDProps);
     componentDidMount(): void;
     componentDidUpdate(prevProps: CRUDProps): void;

package/esm/renderers/CRUD.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -76,6 +76,7 @@ var CRUD = /** @class */ (function (_super) {
         if (this.props.pickerMode && (val = getPropValue(this.props))) {
             store.setSelectedItems(val);
         }
+        this.parentContainer = this.getClosestParentContainer();
     };
     CRUD.prototype.componentDidUpdate = function (prevProps) {
         var props = this.props;
@@ -878,7 +879,6 @@ var CRUD = /** @class */ (function (_super) {
             !alwaysShowPagination) {
             return null;
         }
-        var container = this.getClosestParentContainer();
         var extraProps = {};
         /** 优先级：showPageInput显性配置 > (lastPage > 9) */
         if (typeof toolbar !== 'string') {
@@ -894,7 +894,7 @@ var CRUD = /** @class */ (function (_super) {
         }
         return (React.createElement("div", { className: cx('Crud-pager') }, render('pagination', {
             type: 'pagination'
-        }, __assign(__assign({}, extraProps), { activePage: page, lastPage: lastPage, hasNext: store.hasNext, mode: store.mode, perPage: store.perPage, popOverContainer: container, onPageChange: this.handleChangePage }))));
+        }, __assign(__assign({}, extraProps), { activePage: page, lastPage: lastPage, hasNext: store.hasNext, mode: store.mode, perPage: store.perPage, popOverContainer: this.parentContainer, onPageChange: this.handleChangePage }))));
     };
     CRUD.prototype.renderStatistics = function () {
         var _a = this.props, store = _a.store, cx = _a.classnames, __ = _a.translate, alwaysShowPagination = _a.alwaysShowPagination;
@@ -918,10 +918,9 @@ var CRUD = /** @class */ (function (_super) {
             label: item,
             value: item + ''
         }); });
-        var container = this.getClosestParentContainer();
         return (React.createElement("div", { className: cx('Crud-pageSwitch') },
             React.createElement("span", null, __('CRUD.perPage')),
-            React.createElement(Select, { classPrefix: ns, searchable: false, placeholder: __('Select.placeholder'), options: perPages, value: store.perPage + '', onChange: function (value) { return _this.handleChangePage(1, value.value); }, clearable: false, popOverContainer: container })));
+            React.createElement(Select, { classPrefix: ns, searchable: false, placeholder: __('Select.placeholder'), options: perPages, value: store.perPage + '', onChange: function (value) { return _this.handleChangePage(1, value.value); }, clearable: false, popOverContainer: this.parentContainer })));
     };
     CRUD.prototype.renderLoadMore = function () {
         var _this = this;
@@ -1100,10 +1099,10 @@ var CRUD = /** @class */ (function (_super) {
     };
     CRUD.prototype.render = function () {
         var _a;
-        var _b = this.props, className = _b.className, bodyClassName = _b.bodyClassName, filter = _b.filter, render = _b.render, store = _b.store, mode = _b.mode; _b.syncLocation; _b.children; var bulkActions = _b.bulkActions, pickerMode = _b.pickerMode, multiple = _b.multiple, valueField = _b.valueField, primaryField = _b.primaryField; _b.value; var hideQuickSaveBtn = _b.hideQuickSaveBtn, itemActions = _b.itemActions, cx = _b.classnames, keepItemSelectionOnPageChange = _b.keepItemSelectionOnPageChange, maxKeepItemSelectionLength = _b.maxKeepItemSelectionLength; _b.onAction; var popOverContainer = _b.popOverContainer, __ = _b.translate; _b.onQuery; var autoGenerateFilter = _b.autoGenerateFilter; _b.onSelect; var autoFillHeight = _b.autoFillHeight; _b.onEvent; var rest = __rest(_b, ["className", "bodyClassName", "filter", "render", "store", "mode", "syncLocation", "children", "bulkActions", "pickerMode", "multiple", "valueField", "primaryField", "value", "hideQuickSaveBtn", "itemActions", "classnames", "keepItemSelectionOnPageChange", "maxKeepItemSelectionLength", "onAction", "popOverContainer", "translate", "onQuery", "autoGenerateFilter", "onSelect", "autoFillHeight", "onEvent"]);
+        var _b = this.props, className = _b.className, style = _b.style, bodyClassName = _b.bodyClassName, filter = _b.filter, render = _b.render, store = _b.store, mode = _b.mode; _b.syncLocation; _b.children; var bulkActions = _b.bulkActions, pickerMode = _b.pickerMode, multiple = _b.multiple, valueField = _b.valueField, primaryField = _b.primaryField; _b.value; var hideQuickSaveBtn = _b.hideQuickSaveBtn, itemActions = _b.itemActions, cx = _b.classnames, keepItemSelectionOnPageChange = _b.keepItemSelectionOnPageChange, maxKeepItemSelectionLength = _b.maxKeepItemSelectionLength; _b.onAction; var popOverContainer = _b.popOverContainer, __ = _b.translate; _b.onQuery; var autoGenerateFilter = _b.autoGenerateFilter; _b.onSelect; var autoFillHeight = _b.autoFillHeight; _b.onEvent; var rest = __rest(_b, ["className", "style", "bodyClassName", "filter", "render", "store", "mode", "syncLocation", "children", "bulkActions", "pickerMode", "multiple", "valueField", "primaryField", "value", "hideQuickSaveBtn", "itemActions", "classnames", "keepItemSelectionOnPageChange", "maxKeepItemSelectionLength", "onAction", "popOverContainer", "translate", "onQuery", "autoGenerateFilter", "onSelect", "autoFillHeight", "onEvent"]);
         return (React.createElement("div", { className: cx('Crud', className, {
                 'is-loading': store.loading
-            }) },
+            }), style: style },
             filter && (!store.filterTogggable || store.filterVisible)
                 ? render('filter', __assign(__assign({ title: __('CRUD.filter'), mode: 'inline', submitText: __('search') }, filter), { type: 'form', api: null }), {
                     key: 'filter',

package/esm/renderers/CRUD2.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -571,10 +571,10 @@ var CRUD2 = /** @class */ (function (_super) {
             React.createElement("a", { onClick: this.clearSelection, className: cx('Crud-selectionClear') }, __('clear'))));
     };
     CRUD2.prototype.render = function () {
-        var _a = this.props, columns = _a.columns, className = _a.className, bodyClassName = _a.bodyClassName, filter = _a.filter, render = _a.render, store = _a.store, _b = _a.mode, mode = _b === void 0 ? 'table2' : _b; _a.syncLocation; _a.children; _a.bulkActions; var pickerMode = _a.pickerMode, selectable = _a.selectable, multiple = _a.multiple, valueField = _a.valueField, primaryField = _a.primaryField; _a.value; _a.hideQuickSaveBtn; var itemActions = _a.itemActions, cx = _a.classnames, keepItemSelectionOnPageChange = _a.keepItemSelectionOnPageChange, maxKeepItemSelectionLength = _a.maxKeepItemSelectionLength; _a.onAction; var popOverContainer = _a.popOverContainer; _a.translate; _a.onQuery; var autoGenerateFilter = _a.autoGenerateFilter; _a.onSelect; var autoFillHeight = _a.autoFillHeight, showSelection = _a.showSelection, headerToolbar = _a.headerToolbar, footerToolbar = _a.footerToolbar, rest = __rest(_a, ["columns", "className", "bodyClassName", "filter", "render", "store", "mode", "syncLocation", "children", "bulkActions", "pickerMode", "selectable", "multiple", "valueField", "primaryField", "value", "hideQuickSaveBtn", "itemActions", "classnames", "keepItemSelectionOnPageChange", "maxKeepItemSelectionLength", "onAction", "popOverContainer", "translate", "onQuery", "autoGenerateFilter", "onSelect", "autoFillHeight", "showSelection", "headerToolbar", "footerToolbar"]);
+        var _a = this.props, columns = _a.columns, className = _a.className, style = _a.style, bodyClassName = _a.bodyClassName, filter = _a.filter, render = _a.render, store = _a.store, _b = _a.mode, mode = _b === void 0 ? 'table2' : _b; _a.syncLocation; _a.children; _a.bulkActions; var pickerMode = _a.pickerMode, selectable = _a.selectable, multiple = _a.multiple, valueField = _a.valueField, primaryField = _a.primaryField; _a.value; _a.hideQuickSaveBtn; var itemActions = _a.itemActions, cx = _a.classnames, keepItemSelectionOnPageChange = _a.keepItemSelectionOnPageChange, maxKeepItemSelectionLength = _a.maxKeepItemSelectionLength; _a.onAction; var popOverContainer = _a.popOverContainer; _a.translate; _a.onQuery; var autoGenerateFilter = _a.autoGenerateFilter; _a.onSelect; var autoFillHeight = _a.autoFillHeight, showSelection = _a.showSelection, headerToolbar = _a.headerToolbar, footerToolbar = _a.footerToolbar, rest = __rest(_a, ["columns", "className", "style", "bodyClassName", "filter", "render", "store", "mode", "syncLocation", "children", "bulkActions", "pickerMode", "selectable", "multiple", "valueField", "primaryField", "value", "hideQuickSaveBtn", "itemActions", "classnames", "keepItemSelectionOnPageChange", "maxKeepItemSelectionLength", "onAction", "popOverContainer", "translate", "onQuery", "autoGenerateFilter", "onSelect", "autoFillHeight", "showSelection", "headerToolbar", "footerToolbar"]);
         return (React.createElement("div", { className: cx('Crud2', className, {
                 'is-loading': store.loading
-            }) },
+            }), style: style },
             React.createElement("div", { className: cx('Crud2-filter') }, this.renderFilter(filter)),
             React.createElement("div", { className: cx('Crud2-toolbar') }, this.renderToolbar('headerToolbar', headerToolbar)),
             showSelection && keepItemSelectionOnPageChange && multiple !== false

package/esm/renderers/Calendar.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/renderers/Card.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/renderers/Card2.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/renderers/Cards.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -464,7 +464,7 @@ var Cards = /** @class */ (function (_super) {
     };
     Cards.prototype.render = function () {
         var _this = this;
-        var _a = this.props, className = _a.className, store = _a.store, columnsCount = _a.columnsCount, itemClassName = _a.itemClassName, placeholder = _a.placeholder, card = _a.card, render = _a.render, affixHeader = _a.affixHeader, masonryLayout = _a.masonryLayout, itemsClassName = _a.itemsClassName, cx = _a.classnames, __ = _a.translate, _b = _a.loading, loading = _b === void 0 ? false : _b;
+        var _a = this.props, className = _a.className, style = _a.style, store = _a.store, columnsCount = _a.columnsCount, itemClassName = _a.itemClassName, placeholder = _a.placeholder, card = _a.card, render = _a.render, affixHeader = _a.affixHeader, masonryLayout = _a.masonryLayout, itemsClassName = _a.itemsClassName, cx = _a.classnames, __ = _a.translate, _b = _a.loading, loading = _b === void 0 ? false : _b;
         this.renderedToolbars = []; // 用来记录哪些 toolbar 已经渲染了，已经渲染了就不重复渲染了。
         var itemFinalClassName = columnsCount
             ? "Grid-col--sm".concat(Math.round(12 / columnsCount))
@@ -488,7 +488,7 @@ var Cards = /** @class */ (function (_super) {
         }
         return (React.createElement("div", { ref: this.bodyRef, className: cx('Cards', className, {
                 'Cards--unsaved': !!store.modified || !!store.moved
-            }) },
+            }), style: style },
             affixHeader ? (React.createElement("div", { className: cx('Cards-fixedTop') },
                 header,
                 heading)) : null,

package/esm/renderers/Carousel.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -197,10 +197,10 @@ var Carousel = /** @class */ (function (_super) {
     };
     Carousel.prototype.render = function () {
         var _this = this;
-        var _a = this.props, render = _a.render, className = _a.className, cx = _a.classnames, itemSchema = _a.itemSchema, animation = _a.animation, width = _a.width, height = _a.height, controls = _a.controls, controlsTheme = _a.controlsTheme, placeholder = _a.placeholder, data = _a.data, name = _a.name;
+        var _a = this.props, render = _a.render, className = _a.className, style = _a.style, cx = _a.classnames, itemSchema = _a.itemSchema, animation = _a.animation, width = _a.width, height = _a.height, controls = _a.controls, controlsTheme = _a.controlsTheme, placeholder = _a.placeholder, data = _a.data, name = _a.name;
         var _b = this.state, options = _b.options, current = _b.current, nextAnimation = _b.nextAnimation;
         var body = null;
-        var carouselStyles = {};
+        var carouselStyles = style || {};
         width ? (carouselStyles.width = width + 'px') : '';
         height ? (carouselStyles.height = height + 'px') : '';
         var _c = [

package/esm/renderers/Chart.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/renderers/Code.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -149,7 +149,7 @@ var Code = /** @class */ (function (_super) {
     };
     Code.prototype.render = function () {
         var sourceCode = getPropValue(this.props);
-        var _a = this.props, className = _a.className, cx = _a.classnames, editorTheme = _a.editorTheme, customLang = _a.customLang, wordWrap = _a.wordWrap, wrapperComponent = _a.wrapperComponent;
+        var _a = this.props, className = _a.className, style = _a.style, cx = _a.classnames, editorTheme = _a.editorTheme, customLang = _a.customLang, wordWrap = _a.wordWrap, wrapperComponent = _a.wrapperComponent;
         var language = this.resolveLanguage();
         var isMultiLine = typeof sourceCode === 'string' && sourceCode.split(/\r?\n/).length > 1;
         var Component = wrapperComponent || (isMultiLine ? 'pre' : 'code');
@@ -161,7 +161,7 @@ var Code = /** @class */ (function (_super) {
                 'Code--dark': editorTheme && ['vs-dark', 'hc-black'].includes(editorTheme),
                 'Code-pre-wrap': Component === 'pre',
                 'word-break': wordWrap
-            }, className), "data-lang": language }, sourceCode));
+            }, className), style: style, "data-lang": language }, sourceCode));
     };
     Code.propsList = [
         'language',

package/esm/renderers/Collapse.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -14,8 +14,8 @@ var Collapse = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     Collapse.prototype.render = function () {
-        var _a = this.props, id = _a.id, ns = _a.classPrefix, cx = _a.classnames, size = _a.size, wrapperComponent = _a.wrapperComponent, headingComponent = _a.headingComponent, className = _a.className, headingClassName = _a.headingClassName, children = _a.children, titlePosition = _a.titlePosition, headerPosition = _a.headerPosition, title = _a.title, collapseTitle = _a.collapseTitle, collapseHeader = _a.collapseHeader, header = _a.header, body = _a.body, bodyClassName = _a.bodyClassName, render = _a.render, collapsable = _a.collapsable; _a.translate; var mountOnEnter = _a.mountOnEnter, unmountOnExit = _a.unmountOnExit, showArrow = _a.showArrow, expandIcon = _a.expandIcon, disabled = _a.disabled, collapsed = _a.collapsed, propsUpdate = _a.propsUpdate, onCollapse = _a.onCollapse;
-        return (React.createElement(Collapse$1, { id: id, classnames: cx, classPrefix: ns, mountOnEnter: mountOnEnter, unmountOnExit: unmountOnExit, size: size, wrapperComponent: wrapperComponent, headingComponent: headingComponent, className: className, headingClassName: headingClassName, bodyClassName: bodyClassName, headerPosition: titlePosition || headerPosition, collapsable: collapsable, collapsed: collapsed, showArrow: showArrow, disabled: disabled, propsUpdate: propsUpdate, expandIcon: expandIcon
+        var _a = this.props, id = _a.id, ns = _a.classPrefix, cx = _a.classnames, size = _a.size, wrapperComponent = _a.wrapperComponent, headingComponent = _a.headingComponent, className = _a.className, style = _a.style, headingClassName = _a.headingClassName, children = _a.children, titlePosition = _a.titlePosition, headerPosition = _a.headerPosition, title = _a.title, collapseTitle = _a.collapseTitle, collapseHeader = _a.collapseHeader, header = _a.header, body = _a.body, bodyClassName = _a.bodyClassName, render = _a.render, collapsable = _a.collapsable; _a.translate; var mountOnEnter = _a.mountOnEnter, unmountOnExit = _a.unmountOnExit, showArrow = _a.showArrow, expandIcon = _a.expandIcon, disabled = _a.disabled, collapsed = _a.collapsed, propsUpdate = _a.propsUpdate, onCollapse = _a.onCollapse;
+        return (React.createElement(Collapse$1, { id: id, classnames: cx, classPrefix: ns, mountOnEnter: mountOnEnter, unmountOnExit: unmountOnExit, size: size, wrapperComponent: wrapperComponent, headingComponent: headingComponent, className: className, style: style, headingClassName: headingClassName, bodyClassName: bodyClassName, headerPosition: titlePosition || headerPosition, collapsable: collapsable, collapsed: collapsed, showArrow: showArrow, disabled: disabled, propsUpdate: propsUpdate, expandIcon: expandIcon
                 ? typeof expandIcon.icon === 'object'
                     ? generateIcon(cx, expandIcon.icon)
                     : render('arrow-icon', expandIcon || '', {

package/esm/renderers/CollapseGroup.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -14,8 +14,8 @@ var CollapseGroupRender = /** @class */ (function (_super) {
         return _super.call(this, props) || this;
     }
     CollapseGroupRender.prototype.render = function () {
-        var _a = this.props, defaultActiveKey = _a.defaultActiveKey, accordion = _a.accordion, expandIcon = _a.expandIcon, expandIconPosition = _a.expandIconPosition, body = _a.body, className = _a.className, render = _a.render;
-        return (React.createElement(CollapseGroup, { defaultActiveKey: defaultActiveKey, accordion: accordion, expandIcon: expandIcon, expandIconPosition: expandIconPosition, className: className }, render('body', body || '')));
+        var _a = this.props, defaultActiveKey = _a.defaultActiveKey, accordion = _a.accordion, expandIcon = _a.expandIcon, expandIconPosition = _a.expandIconPosition, body = _a.body, className = _a.className, style = _a.style, render = _a.render;
+        return (React.createElement(CollapseGroup, { defaultActiveKey: defaultActiveKey, accordion: accordion, expandIcon: expandIcon, expandIconPosition: expandIconPosition, className: className, style: style }, render('body', body || '')));
     };
     return CollapseGroupRender;
 }(React.Component));

package/esm/renderers/Color.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -13,9 +13,9 @@ var ColorField = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     ColorField.prototype.render = function () {
-        var _a = this.props, className = _a.className, cx = _a.classnames, defaultColor = _a.defaultColor, showValue = _a.showValue;
+        var _a = this.props, className = _a.className, style = _a.style, cx = _a.classnames, defaultColor = _a.defaultColor, showValue = _a.showValue;
         var color = getPropValue(this.props);
-        return (React.createElement("div", { className: cx('ColorField', className) },
+        return (React.createElement("div", { className: cx('ColorField', className), style: style },
             React.createElement("i", { className: cx('ColorField-previewIcon'), style: { backgroundColor: color || defaultColor } }),
             showValue ? (React.createElement("span", { className: cx('ColorField-value') }, color || defaultColor)) : null));
     };

package/esm/renderers/Container.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -23,9 +23,9 @@ var Container = /** @class */ (function (_super) {
                 : null));
     };
     Container.prototype.render = function () {
-        var _a = this.props, className = _a.className, wrapperComponent = _a.wrapperComponent; _a.size; var cx = _a.classnames, style = _a.style, data = _a.data;
+        var _a = this.props, className = _a.className, wrapperComponent = _a.wrapperComponent, size = _a.size, cx = _a.classnames, style = _a.style, data = _a.data;
         var Component = wrapperComponent || 'div';
-        return (React.createElement(Component, { className: cx('Container', className), style: buildStyle(style, data) }, this.renderBody()));
+        return (React.createElement(Component, { className: cx('Container', size && size !== 'none' ? "Container--".concat(size) : '', className), style: buildStyle(style, data) }, this.renderBody()));
     };
     Container.propsList = ['body', 'className'];
     Container.defaultProps = {

package/esm/renderers/Copyable.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 

package/esm/renderers/Custom.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -138,9 +138,9 @@ var Custom = /** @class */ (function (_super) {
         return childEleCont;
     };
     Custom.prototype.render = function () {
-        var _a = this.props, className = _a.className, html = _a.html, id = _a.id, wrapperComponent = _a.wrapperComponent, inline = _a.inline; _a.translate; var cx = _a.classnames;
+        var _a = this.props, className = _a.className, style = _a.style, html = _a.html, id = _a.id, wrapperComponent = _a.wrapperComponent, inline = _a.inline; _a.translate; var cx = _a.classnames;
         var Component = wrapperComponent || inline ? 'span' : 'div';
-        return (React.createElement(Component, { ref: this.dom, className: cx(className), id: id, dangerouslySetInnerHTML: { __html: html ? html : '' } }));
+        return (React.createElement(Component, { ref: this.dom, className: cx(className), style: style, id: id, dangerouslySetInnerHTML: { __html: html ? html : '' } }));
     };
     Custom.defaultProps = {
         inline: false

package/esm/renderers/Date.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -33,7 +33,7 @@ var DateField = /** @class */ (function (_super) {
         clearInterval(this.refreshInterval);
     };
     DateField.prototype.render = function () {
-        var _a = this.props, valueFormat = _a.valueFormat, format = _a.format, placeholder = _a.placeholder, fromNow = _a.fromNow, className = _a.className, cx = _a.classnames, __ = _a.translate;
+        var _a = this.props, valueFormat = _a.valueFormat, format = _a.format, placeholder = _a.placeholder, fromNow = _a.fromNow, className = _a.className, style = _a.style, cx = _a.classnames, __ = _a.translate;
         var viewValue = (React.createElement("span", { className: "text-muted" }, placeholder));
         var value = getPropValue(this.props);
         // 主要是给 fromNow 用的
@@ -54,7 +54,7 @@ var DateField = /** @class */ (function (_super) {
             viewValue = moment(viewValue).fromNow();
         }
         viewValue = !viewValue ? (React.createElement("span", { className: "text-danger" }, __('Date.invalid'))) : (viewValue);
-        return (React.createElement("span", { className: cx('DateField', className), title: fromNow ? date : undefined }, viewValue));
+        return (React.createElement("span", { className: cx('DateField', className), style: style, title: fromNow ? date : undefined }, viewValue));
     };
     DateField.defaultProps = {
         placeholder: '-',

package/esm/renderers/DateRange.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.5.2-beta.0
+ * amis v2.5.3-beta.0
  * Copyright 2018-2022 baidu
  */
 
@@ -14,7 +14,7 @@ var DateRangeField = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     DateRangeField.prototype.render = function () {
-        var _a = this.props, _b = _a.delimiter, delimiter = _b === void 0 ? ',' : _b, _c = _a.connector, connector = _c === void 0 ? '~' : _c, value = _a.value, valueFormat = _a.valueFormat, _d = _a.format, format = _d === void 0 ? 'YYYY-MM-DD' : _d, cx = _a.classnames, className = _a.className;
+        var _a = this.props, _b = _a.delimiter, delimiter = _b === void 0 ? ',' : _b, _c = _a.connector, connector = _c === void 0 ? '~' : _c, value = _a.value, valueFormat = _a.valueFormat, _d = _a.format, format = _d === void 0 ? 'YYYY-MM-DD' : _d, cx = _a.classnames, className = _a.className, style = _a.style;
         if (!value) {
             return null;
         }
@@ -32,7 +32,7 @@ var DateRangeField = /** @class */ (function (_super) {
         }
         startTime = startTime.isValid() ? startTime.format(format) : '';
         endTime = endTime.isValid() ? endTime.format(format) : '';
-        return (React.createElement("span", { className: cx('DateRangeField', className) }, [startTime, endTime].join(" ".concat(connector, " "))));
+        return (React.createElement("span", { className: cx('DateRangeField', className), style: style }, [startTime, endTime].join(" ".concat(connector, " "))));
     };
     DateRangeField.defaultProps = {
         format: 'YYYY-MM-DD',