@tachybase/client 0.23.48 → 0.23.58

package/lib/collection-manager/Configuration/ImportXlsx/xlsxImportAction.js

@@ -0,0 +1,235 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.n = function(module) {
+        var getter = module && module.__esModule ? function() {
+            return module['default'];
+        } : function() {
+            return module;
+        };
+        __webpack_require__.d(getter, {
+            a: getter
+        });
+        return getter;
+    };
+})();
+(()=>{
+    __webpack_require__.d = function(exports1, definition) {
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = function(obj, prop) {
+        return Object.prototype.hasOwnProperty.call(obj, prop);
+    };
+})();
+(()=>{
+    __webpack_require__.r = function(exports1) {
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    XlsxEditFieldAction: ()=>XlsxEditFieldAction
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_react_namespaceObject = require("react");
+const components_namespaceObject = require("@tachybase/components");
+const schema_namespaceObject = require("@tachybase/schema");
+const external_lodash_namespaceObject = require("lodash");
+const external_react_i18next_namespaceObject = require("react-i18next");
+const index_js_namespaceObject = require("../../../api-client/index.js");
+const external_record_provider_index_js_namespaceObject = require("../../../record-provider/index.js");
+const external_schema_component_index_js_namespaceObject = require("../../../schema-component/index.js");
+const external_action_hooks_js_namespaceObject = require("../../action-hooks.js");
+const external_hooks_index_js_namespaceObject = require("../../hooks/index.js");
+const useDialect_js_namespaceObject = require("../../hooks/useDialect.js");
+var useDialect_js_default = /*#__PURE__*/ __webpack_require__.n(useDialect_js_namespaceObject);
+const external_components_index_js_namespaceObject = require("../components/index.js");
+const external_setUpdateXlsxCollectionField_js_namespaceObject = require("./setUpdateXlsxCollectionField.js");
+const XlsxEditFieldAction = (props)=>{
+    const { scope, getContainer, record, parentItem: parentRecord, children, handleUiSchemaChange, ...otherProps } = props;
+    const { getInterface, collections, getCollection } = (0, external_hooks_index_js_namespaceObject.useCollectionManager_deprecated)();
+    const [visible, setVisible] = (0, external_react_namespaceObject.useState)(false);
+    const [schema, setSchema] = (0, external_react_namespaceObject.useState)({});
+    (0, index_js_namespaceObject.useAPIClient)();
+    const { t } = (0, external_react_i18next_namespaceObject.useTranslation)();
+    const compile = (0, external_schema_component_index_js_namespaceObject.useCompile)();
+    const [data, setData] = (0, external_react_namespaceObject.useState)({
+        record
+    });
+    const { isDialect } = useDialect_js_default()();
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_record_provider_index_js_namespaceObject.RecordProvider, {
+        record: record,
+        parent: parentRecord,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_schema_component_index_js_namespaceObject.ActionContextProvider, {
+            value: {
+                visible,
+                setVisible
+            },
+            children: [
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("a", {
+                    ...otherProps,
+                    onClick: async ()=>{
+                        setData(record);
+                        const interfaceConf = getInterface(record.interface);
+                        const defaultValues = (0, external_lodash_namespaceObject.cloneDeep)(record) || {};
+                        if (!(null == defaultValues ? void 0 : defaultValues.reverseField)) {
+                            var _interfaceConf_default;
+                            defaultValues.autoCreateReverseField = false;
+                            defaultValues.reverseField = null == interfaceConf ? void 0 : null === (_interfaceConf_default = interfaceConf.default) || void 0 === _interfaceConf_default ? void 0 : _interfaceConf_default.reverseField;
+                            (0, external_lodash_namespaceObject.set)(defaultValues.reverseField, 'name', record.name);
+                            (0, external_lodash_namespaceObject.set)(defaultValues, 'uiSchema.title', record.uiSchema.title);
+                        }
+                        const schema = getSchema({
+                            ...interfaceConf,
+                            default: defaultValues
+                        }, record, compile, getContainer);
+                        setSchema(schema);
+                        setVisible(true);
+                    },
+                    children: children || t('Edit')
+                }),
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_schema_component_index_js_namespaceObject.SchemaComponent, {
+                    schema: schema,
+                    components: {
+                        ...external_components_index_js_namespaceObject,
+                        ArrayTable: components_namespaceObject.ArrayTable
+                    },
+                    scope: {
+                        getContainer,
+                        useCancelAction: external_action_hooks_js_namespaceObject.useCancelAction,
+                        showReverseFieldConfig: !(null == data ? void 0 : data.reverseField),
+                        isDialect,
+                        setUpdateXlsxCollectionField: external_setUpdateXlsxCollectionField_js_namespaceObject.setUpdateXlsxCollectionField,
+                        disabledJSONB: true,
+                        createMainOnly: true,
+                        ...scope
+                    }
+                })
+            ]
+        })
+    });
+};
+const getSchema = (schema, record, compile, getContainer)=>{
+    if (!schema) return;
+    const properties = (0, external_lodash_namespaceObject.cloneDeep)(schema.properties);
+    if (null == properties ? void 0 : properties.name) properties.name['x-disabled'] = true;
+    if (true === schema.hasDefaultValue) {
+        properties['defaultValue'] = (0, external_lodash_namespaceObject.cloneDeep)(schema.default) || {};
+        properties.defaultValue.required = false;
+        properties['defaultValue']['title'] = compile('{{ t("Default value") }}');
+        properties['defaultValue']['x-decorator'] = 'FormItem';
+        properties['defaultValue']['x-reactions'] = [
+            {
+                dependencies: [
+                    'uiSchema.x-component-props.gmt',
+                    'uiSchema.x-component-props.showTime',
+                    'uiSchema.x-component-props.dateFormat',
+                    'uiSchema.x-component-props.timeFormat'
+                ],
+                fulfill: {
+                    state: {
+                        componentProps: {
+                            gmt: '{{$deps[0]}}',
+                            showTime: '{{$deps[1]}}',
+                            dateFormat: '{{$deps[2]}}',
+                            timeFormat: '{{$deps[3]}}'
+                        }
+                    }
+                }
+            },
+            {
+                dependencies: [
+                    'primaryKey',
+                    'unique',
+                    'autoIncrement'
+                ],
+                when: '{{$deps[0]||$deps[1]||$deps[2]}}',
+                fulfill: {
+                    state: {
+                        hidden: true,
+                        value: void 0
+                    }
+                },
+                otherwise: {
+                    state: {
+                        hidden: false
+                    }
+                }
+            }
+        ];
+    }
+    return {
+        type: 'object',
+        properties: {
+            [(0, schema_namespaceObject.uid)()]: {
+                type: 'void',
+                'x-component': 'Action.Drawer',
+                'x-component-props': {
+                    getContainer: getContainer
+                },
+                'x-decorator': 'Form',
+                'x-decorator-props': {
+                    useValues (options) {
+                        return (0, index_js_namespaceObject.useRequest)(()=>Promise.resolve({
+                                data: (0, external_lodash_namespaceObject.cloneDeep)((0, external_lodash_namespaceObject.omit)(schema.default, [
+                                    'uiSchema.rawTitle'
+                                ]))
+                            }), options);
+                    }
+                },
+                title: "".concat(compile(record.uiSchema.title), " - ").concat(compile('{{ t("Edit field") }}')),
+                properties: {
+                    summary: {
+                        type: 'void',
+                        'x-component': 'FieldSummary',
+                        'x-component-props': {
+                            schemaKey: schema.name
+                        }
+                    },
+                    ...properties,
+                    description: {
+                        type: 'string',
+                        title: '{{t("Description")}}',
+                        'x-decorator': 'FormItem',
+                        'x-component': 'Input.TextArea'
+                    },
+                    footer: {
+                        type: 'void',
+                        'x-component': 'Action.Drawer.Footer',
+                        properties: {
+                            action1: {
+                                title: '{{ t("Cancel") }}',
+                                'x-component': 'Action',
+                                'x-use-component-props': 'useCancelActionProps'
+                            },
+                            action2: {
+                                title: '{{ t("Submit") }}',
+                                'x-component': 'Action',
+                                'x-component-props': {
+                                    type: 'primary'
+                                },
+                                'x-use-component-props': 'setUpdateXlsxCollectionField'
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    };
+};
+var __webpack_export_target__ = exports;
+for(var __webpack_i__ in __webpack_exports__)__webpack_export_target__[__webpack_i__] = __webpack_exports__[__webpack_i__];
+if (__webpack_exports__.__esModule) Object.defineProperty(__webpack_export_target__, '__esModule', {
+    value: true
+});

package/lib/collection-manager/Configuration/ImportXlsx/xlsxPreviewTable.js

@@ -0,0 +1,64 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = function(exports1, definition) {
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = function(obj, prop) {
+        return Object.prototype.hasOwnProperty.call(obj, prop);
+    };
+})();
+(()=>{
+    __webpack_require__.r = function(exports1) {
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    xlsxPreviewTable: ()=>xlsxPreviewTable
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const schema_namespaceObject = require("@tachybase/schema");
+const external_antd_namespaceObject = require("antd");
+const external_react_i18next_namespaceObject = require("react-i18next");
+const xlsxPreviewTable = (0, schema_namespaceObject.observer)((props)=>{
+    const { filedata } = props;
+    const { t } = (0, external_react_i18next_namespaceObject.useTranslation)();
+    const previewTablecolumns = filedata.fields.map((field)=>({
+            title: field.uiSchema.title,
+            dataIndex: field.name,
+            key: field.name,
+            render: (text)=>text,
+            width: 200
+        }));
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_antd_namespaceObject.Table, {
+        bordered: true,
+        size: "small",
+        columns: previewTablecolumns,
+        dataSource: filedata.data,
+        scroll: {
+            y: 300,
+            x: 'max-content'
+        },
+        pagination: false,
+        rowKey: "name"
+    });
+}, {
+    displayName: 'PreviewTable'
+});
+var __webpack_export_target__ = exports;
+for(var __webpack_i__ in __webpack_exports__)__webpack_export_target__[__webpack_i__] = __webpack_exports__[__webpack_i__];
+if (__webpack_exports__.__esModule) Object.defineProperty(__webpack_export_target__, '__esModule', {
+    value: true
+});

package/lib/collection-manager/collectionPlugin.js

@@ -34,6 +34,7 @@ const DataSourceManager_js_namespaceObject = require("../data-source/data-source
 const index_js_namespaceObject = require("./interfaces/index.js");
 const InheritanceCollectionMixin_js_namespaceObject = require("./mixins/InheritanceCollectionMixin.js");
 const external_templates_index_js_namespaceObject = require("./templates/index.js");
+const xlsx_js_namespaceObject = require("./templates/xlsx.js");
 class MainDataSource extends DataSource_js_namespaceObject.DataSource {
     async getDataSource() {
         var _service_data;
@@ -152,7 +153,8 @@ class CollectionPlugin extends Plugin_js_namespaceObject.Plugin {
             external_templates_index_js_namespaceObject.SqlCollectionTemplate,
             external_templates_index_js_namespaceObject.TreeCollectionTemplate,
             external_templates_index_js_namespaceObject.ViewCollectionTemplate,
-            external_templates_index_js_namespaceObject.ImportCollectionTemplate
+            external_templates_index_js_namespaceObject.ImportCollectionTemplate,
+            xlsx_js_namespaceObject.ImportXlsxTemplate
         ]);
     }
 }

package/lib/collection-manager/templates/import.js

@@ -41,7 +41,7 @@ function _define_property(obj, key, value) {
 }
 class ImportCollectionTemplate extends CollectionTemplate_js_namespaceObject.CollectionTemplate {
     constructor(...args){
-        super(...args), _define_property(this, "name", 'import'), _define_property(this, "title", '{{t("Import collection")}}'), _define_property(this, "order", 5), _define_property(this, "color", 'blue'), _define_property(this, "divider", true), _define_property(this, "default", {
+        super(...args), _define_property(this, "name", 'import'), _define_property(this, "title", '{{t("Import json collection")}}'), _define_property(this, "order", 5), _define_property(this, "color", 'blue'), _define_property(this, "divider", true), _define_property(this, "default", {
             fields: []
         });
     }

package/lib/collection-manager/templates/xlsx.js

@@ -0,0 +1,53 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = function(exports1, definition) {
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = function(obj, prop) {
+        return Object.prototype.hasOwnProperty.call(obj, prop);
+    };
+})();
+(()=>{
+    __webpack_require__.r = function(exports1) {
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    ImportXlsxTemplate: ()=>ImportXlsxTemplate
+});
+const CollectionTemplate_js_namespaceObject = require("../../data-source/collection-template/CollectionTemplate.js");
+function _define_property(obj, key, value) {
+    if (key in obj) Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+    });
+    else obj[key] = value;
+    return obj;
+}
+class ImportXlsxTemplate extends CollectionTemplate_js_namespaceObject.CollectionTemplate {
+    constructor(...args){
+        super(...args), _define_property(this, "name", 'importXlsx'), _define_property(this, "title", '{{t("Import xlsx collection")}}'), _define_property(this, "order", 6), _define_property(this, "color", 'blue'), _define_property(this, "divider", false), _define_property(this, "default", {
+            fields: []
+        });
+    }
+}
+var __webpack_export_target__ = exports;
+for(var __webpack_i__ in __webpack_exports__)__webpack_export_target__[__webpack_i__] = __webpack_exports__[__webpack_i__];
+if (__webpack_exports__.__esModule) Object.defineProperty(__webpack_export_target__, '__esModule', {
+    value: true
+});

package/lib/locale/zh-CN.js

@@ -212,6 +212,7 @@ module.exports = {
   Constant: "\u5E38\u91CF",
   "Constant value": "\u9759\u6001\u503C",
   "Convert reference to duplicate": "\u6A21\u677F\u5F15\u7528\u8F6C\u4E3A\u590D\u5236",
+  "Converted to": "\u8F6C\u6362\u6210",
   "Copy into the form and continue to fill in": "\u590D\u5236\u5230\u8868\u5355\u5E76\u7EE7\u7EED\u586B\u5199",
   Create: "\u4EC5\u65B0\u589E",
   "Create an account": "\u6CE8\u518C\u8D26\u53F7",
@@ -413,7 +414,7 @@ module.exports = {
   "Field collection": "\u9009\u62E9\u6570\u636E",
   "Field component": "\u5B57\u6BB5\u7EC4\u4EF6",
   "Field display name": "\u5B57\u6BB5\u540D\u79F0",
-  "Field interface": "\u5B57\u6BB5\u7C7B\u578B",
+  "Field interface": "UI\u7C7B\u578B",
   "Field mode": "\u5B57\u6BB5\u7EC4\u4EF6",
   "Field name": "\u5B57\u6BB5\u6807\u8BC6",
   "Field permission": "\u5B57\u6BB5\u6743\u9650",
@@ -482,6 +483,8 @@ module.exports = {
   ImageSearch: "\u56FE\u7247\u641C\u7D22",
   Import: "\u5BFC\u5165",
   "Import collection": "\u5BFC\u5165\u6570\u636E\u8868",
+  "Import json collection": "\u5BFC\u5165json\u6570\u636E\u8868",
+  "Import xlsx collection": "\u5BFC\u5165xlsx\u6570\u636E\u8868",
   "Importable fields": "\u53EF\u5BFC\u5165\u5B57\u6BB5",
   "In configuration": "\u914D\u7F6E\u4E2D",
   Index: "\u7D22\u5F15",

package/lib/modules/blocks/data-blocks/table/hooks/useTableBlockProps.js

@@ -107,7 +107,7 @@ const useTableBlockProps = ()=>{
         },
         onChange (param, filters, sorter) {
             let { current, pageSize } = param;
-            var _fieldSchema_parent_xdecoratorprops_params, _fieldSchema_parent_xdecoratorprops, _fieldSchema_parent, _ctx_service_params;
+            var _fieldSchema_parent_xdecoratorprops_params, _fieldSchema_parent_xdecoratorprops, _fieldSchema_parent, _ctx_service_params_;
             const parentSort = null === (_fieldSchema_parent = fieldSchema.parent) || void 0 === _fieldSchema_parent ? void 0 : null === (_fieldSchema_parent_xdecoratorprops = _fieldSchema_parent['x-decorator-props']) || void 0 === _fieldSchema_parent_xdecoratorprops ? void 0 : null === (_fieldSchema_parent_xdecoratorprops_params = _fieldSchema_parent_xdecoratorprops['params']) || void 0 === _fieldSchema_parent_xdecoratorprops_params ? void 0 : _fieldSchema_parent_xdecoratorprops_params.sort;
             const sortParams = ctx.params.sort || [];
             const parentSortReal = [
@@ -122,10 +122,12 @@ const useTableBlockProps = ()=>{
                 "-".concat(sorter.field)
             ] : parentSortReal;
             ctx.service.run({
-                ...null === (_ctx_service_params = ctx.service.params) || void 0 === _ctx_service_params ? void 0 : _ctx_service_params[0],
+                ...ctx.service.params[0],
                 page: current,
                 pageSize,
                 sort
+            }, {
+                filters: null === (_ctx_service_params_ = ctx.service.params[1]) || void 0 === _ctx_service_params_ ? void 0 : _ctx_service_params_.filters
             });
         },
         onClickRow (record, setSelectedRow, selectedRow) {

package/lib/modules/fields/component/Radio/radioComponentFieldSettings.js

@@ -54,10 +54,6 @@ const radioComponentFieldSettings = new SchemaSettings_js_namespaceObject.Schema
                     {
                         label: t('Radio group'),
                         value: 'Radio group'
-                    },
-                    {
-                        label: t('Select'),
-                        value: 'Select'
                     }
                 ];
                 const { dn } = (0, index_js_namespaceObject.useDesignable)();

package/lib/schema-component/antd/action/Action.Designer.js

@@ -251,7 +251,7 @@ function AfterSuccess() {
     const openMode = findSchema(ctx.fieldSchema);
     const component = fieldSchema.parent.parent['x-component'];
     const schema = {
-        ...external_utils_js_namespaceObject.afterSuccessSchema
+        ...(0, external_utils_js_namespaceObject.afterSuccessSchema)(t)
     };
     if ((!openMode || 'page' === openMode) && component.includes('Form') || !component.includes('Form')) delete schema.properties.popupClose;
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(SchemaSettings_js_namespaceObject.SchemaSettingsModalItem, {
@@ -359,7 +359,10 @@ function WorkflowSelectComponent(param) {
                         'config.collection': noCollection ? void 0 : workflowCollection,
                         sync: void 0 === props.filterSync ? void 0 : props.filterSync,
                         key: void 0 === props.filterKey ? void 0 : props.filterKey
-                    }
+                    },
+                    sort: [
+                        '-updatedAt'
+                    ]
                 }
             },
             optionFilter: optionFilter,

package/lib/schema-component/antd/action/Action.Modal.js

@@ -49,10 +49,10 @@ const schema_namespaceObject = require("@tachybase/schema");
 const icons_namespaceObject = require("@ant-design/icons");
 const css_namespaceObject = require("@emotion/css");
 const external_antd_namespaceObject = require("antd");
-const external_antd_style_namespaceObject = require("antd-style");
 const external_classnames_namespaceObject = require("classnames");
 var external_classnames_default = /*#__PURE__*/ __webpack_require__.n(external_classnames_namespaceObject);
 const external_index_js_namespaceObject = require("./index.js");
+const external_Action_Modal_style_js_namespaceObject = require("./Action.Modal.style.js");
 require("./hooks/useSetAriaLabelForModal.js");
 function _tagged_template_literal(strings, raw) {
     if (!raw) raw = strings.slice(0);
@@ -64,7 +64,7 @@ function _tagged_template_literal(strings, raw) {
 }
 function _templateObject() {
     const data = _tagged_template_literal([
-        "\n      &.tb-action-popup {\n        .ant-modal-header {\n          // TODO: theme variables\n          margin-top: -20px;\n          margin-left: -24px;\n          margin-right: -24px;\n          padding-top: 20px;\n          padding-left: 24px;\n          padding-right: 24px;\n          padding-bottom: 20px;\n        }\n        .ant-modal-content {\n          background: var(--tb-box-bg);\n        }\n      }\n    "
+        "\n                  background: none;\n                  border: none;\n                "
     ]);
     _templateObject = function() {
         return data;
@@ -72,29 +72,14 @@ function _templateObject() {
     return data;
 }
 function _templateObject1() {
-    const data = _tagged_template_literal([
-        "\n                  background: none;\n                  border: none;\n                "
-    ]);
-    _templateObject1 = function() {
-        return data;
-    };
-    return data;
-}
-function _templateObject2() {
     const data = _tagged_template_literal([
         "\n        background: none;\n        border: none;\n      "
     ]);
-    _templateObject2 = function() {
+    _templateObject1 = function() {
         return data;
     };
     return data;
 }
-const useStyles = (0, external_antd_style_namespaceObject.createStyles)((param)=>{
-    let { css } = param;
-    return {
-        container: css(_templateObject())
-    };
-});
 const openSizeWidthMap = new Map([
     [
         'small',
@@ -111,7 +96,7 @@ const openSizeWidthMap = new Map([
 ]);
 const ActionModal = (0, schema_namespaceObject.observer)((props)=>{
     const { footerNodeName = 'Action.Modal.Footer', width, ...others } = props;
-    const { styles } = useStyles();
+    const { styles } = (0, external_Action_Modal_style_js_namespaceObject.useStyles)();
     const { visible, setVisible, openSize = 'middle', modalProps } = (0, external_index_js_namespaceObject.useActionContext)();
     const actualWidth = null != width ? width : openSizeWidthMap.get(openSize);
     const schema = (0, schema_namespaceObject.useFieldSchema)();
@@ -120,7 +105,13 @@ const ActionModal = (0, schema_namespaceObject.observer)((props)=>{
         if (s['x-component'] === footerNodeName) return s;
         return buf;
     });
+    console.log('%c Line:41 🍧 styles.container', 'font-size:18px;color:#e41a6a;background:#7f2b82', styles.container);
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_antd_namespaceObject.Modal, {
+        className: external_classnames_default()(others.className, null == modalProps ? void 0 : modalProps.className, styles.container, 'amplifier-block'),
+        style: {
+            ...null == modalProps ? void 0 : modalProps.style,
+            ...null == others ? void 0 : others.style
+        },
         width: actualWidth,
         title: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
             style: {
@@ -139,7 +130,7 @@ const ActionModal = (0, schema_namespaceObject.observer)((props)=>{
                         /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_antd_namespaceObject.Button, {
                             type: "text",
                             icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icons_namespaceObject.CloseOutlined, {}),
-                            className: (0, css_namespaceObject.css)(_templateObject1()),
+                            className: (0, css_namespaceObject.css)(_templateObject()),
                             onClick: ()=>setVisible(false, true)
                         })
                     ]
@@ -148,25 +139,23 @@ const ActionModal = (0, schema_namespaceObject.observer)((props)=>{
         }),
         ...others,
         ...modalProps,
-        style: {
-            ...null == modalProps ? void 0 : modalProps.style,
-            ...null == others ? void 0 : others.style
-        },
         destroyOnClose: true,
         open: visible,
         closable: false,
-        className: external_classnames_default()(others.className, null == modalProps ? void 0 : modalProps.className, styles.container, 'amplifier-block'),
         footer: !!footerSchema && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(schema_namespaceObject.RecursionField, {
             basePath: field.address,
             schema: schema,
             onlyRenderProperties: true,
             filterProperties: (s)=>s['x-component'] === footerNodeName
         }),
-        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(schema_namespaceObject.RecursionField, {
-            basePath: field.address,
-            schema: schema,
-            onlyRenderProperties: true,
-            filterProperties: (s)=>s['x-component'] !== footerNodeName
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+            className: styles.modalClassName,
+            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(schema_namespaceObject.RecursionField, {
+                basePath: field.address,
+                schema: schema,
+                onlyRenderProperties: true,
+                filterProperties: (s)=>s['x-component'] !== footerNodeName
+            })
         })
     });
 }, {
@@ -190,7 +179,7 @@ const Amplifier = ()=>{
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_antd_namespaceObject.Button, {
         icon: isAmplifier ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icons_namespaceObject.FullscreenExitOutlined, {}) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icons_namespaceObject.FullscreenOutlined, {}),
         type: "text",
-        className: (0, css_namespaceObject.css)(_templateObject2()),
+        className: (0, css_namespaceObject.css)(_templateObject1()),
         onClick: (e)=>{
             const element = e.target.closest('.ant-modal-content');
             const modal = document.querySelector('.ant-modal');

package/lib/schema-component/antd/action/Action.Modal.style.js

@@ -0,0 +1,69 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = function(exports1, definition) {
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = function(obj, prop) {
+        return Object.prototype.hasOwnProperty.call(obj, prop);
+    };
+})();
+(()=>{
+    __webpack_require__.r = function(exports1) {
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useStyles: ()=>useStyles
+});
+const external_antd_style_namespaceObject = require("antd-style");
+function _tagged_template_literal(strings, raw) {
+    if (!raw) raw = strings.slice(0);
+    return Object.freeze(Object.defineProperties(strings, {
+        raw: {
+            value: Object.freeze(raw)
+        }
+    }));
+}
+function _templateObject() {
+    const data = _tagged_template_literal([
+        "\n      &.tb-action-popup {\n        .ant-modal-header {\n          // TODO: theme variables\n          margin-top: -20px;\n          margin-left: -24px;\n          margin-right: -24px;\n          padding-top: 20px;\n          padding-left: 24px;\n          padding-right: 24px;\n          padding-bottom: 20px;\n        }\n        .ant-modal-content {\n          background: var(--tb-box-bg);\n        }\n      }\n    "
+    ]);
+    _templateObject = function() {
+        return data;
+    };
+    return data;
+}
+function _templateObject1() {
+    const data = _tagged_template_literal([
+        "\n      max-height: 80vh;\n      overflow: hidden;\n      .ant-tabs-content-holder {\n        height: 70vh;\n        overflow-y: scroll;\n        overflow-x: hidden;\n      }\n    "
+    ]);
+    _templateObject1 = function() {
+        return data;
+    };
+    return data;
+}
+const useStyles = (0, external_antd_style_namespaceObject.createStyles)((param)=>{
+    let { css } = param;
+    return {
+        container: css(_templateObject()),
+        modalClassName: css(_templateObject1())
+    };
+});
+var __webpack_export_target__ = exports;
+for(var __webpack_i__ in __webpack_exports__)__webpack_export_target__[__webpack_i__] = __webpack_exports__[__webpack_i__];
+if (__webpack_exports__.__esModule) Object.defineProperty(__webpack_export_target__, '__esModule', {
+    value: true
+});