@tachybase/client 1.3.24 → 1.4.0

package/lib/modules/fields/component/SubTable/subTablePopoverComponentFieldSettings.js

@@ -27,7 +27,8 @@ __webpack_require__.d(__webpack_exports__, {
     clickToSelect: ()=>clickToSelect,
     subTablePopoverComponentFieldSettings: ()=>subTablePopoverComponentFieldSettings,
     allowAddNewData: ()=>allowAddNewData,
-    setDefaultSortingRules: ()=>setDefaultSortingRules
+    setDefaultSortingRules: ()=>setDefaultSortingRules,
+    tablePagination: ()=>tablePagination
 });
 const external_react_namespaceObject = require("react");
 const schema_namespaceObject = require("@tachybase/schema");
@@ -426,6 +427,38 @@ const clickToSelect = {
         };
     }
 };
+const tablePagination = {
+    name: 'tablePagination',
+    type: 'switch',
+    useComponentProps () {
+        var _fieldSchema_xcomponentprops;
+        const { dn } = (0, external_schema_component_index_js_namespaceObject.useDesignable)();
+        const fieldSchema = (0, schema_namespaceObject.useFieldSchema)();
+        const { t } = (0, external_react_i18next_namespaceObject.useTranslation)();
+        const field = (0, schema_namespaceObject.useField)();
+        return {
+            title: t('Pagination'),
+            checked: (null == (_fieldSchema_xcomponentprops = fieldSchema['x-component-props']) ? void 0 : _fieldSchema_xcomponentprops.pagination) || false,
+            onChange (v) {
+                if (!fieldSchema['x-component-props'].pagination) fieldSchema['x-component-props'] = {
+                    ...fieldSchema['x-component-props'],
+                    pagination: false
+                };
+                fieldSchema['x-component-props'].pagination = v;
+                field.componentProps['pagination'] = v;
+                dn.emit('patch', {
+                    schema: {
+                        'x-uid': fieldSchema['x-uid'],
+                        'x-component-props': {
+                            ...null == fieldSchema ? void 0 : fieldSchema['x-component-props']
+                        }
+                    }
+                });
+                dn.refresh();
+            }
+        };
+    }
+};
 const subTablePopoverComponentFieldSettings = new SchemaSettings_js_namespaceObject.SchemaSettings({
     name: 'fieldSettings:component:SubTable',
     items: [
@@ -433,18 +466,21 @@ const subTablePopoverComponentFieldSettings = new SchemaSettings_js_namespaceObj
         allowAddNewData,
         allowSelectExistingRecord,
         setDefaultSortingRules,
-        clickToSelect
+        clickToSelect,
+        tablePagination
     ]
 });
 exports.allowAddNewData = __webpack_exports__.allowAddNewData;
 exports.clickToSelect = __webpack_exports__.clickToSelect;
 exports.setDefaultSortingRules = __webpack_exports__.setDefaultSortingRules;
 exports.subTablePopoverComponentFieldSettings = __webpack_exports__.subTablePopoverComponentFieldSettings;
+exports.tablePagination = __webpack_exports__.tablePagination;
 for(var __webpack_i__ in __webpack_exports__)if (-1 === [
     "allowAddNewData",
     "clickToSelect",
     "setDefaultSortingRules",
-    "subTablePopoverComponentFieldSettings"
+    "subTablePopoverComponentFieldSettings",
+    "tablePagination"
 ].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
 Object.defineProperty(exports, '__esModule', {
     value: true

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

@@ -90,14 +90,14 @@ const ActionAreaPlayer = (param)=>{
     return visible && ref.current ? /*#__PURE__*/ (0, external_react_dom_namespaceObject.createPortal)(children, ref.current) : null;
 };
 const ActionArea = (0, schema_namespaceObject.observer)((props)=>{
-    const { footerNodeName = 'ActionArea.Footer' } = props;
+    const { footerNodeName = 'ActionArea.Footer', stickyFooter = false } = props;
     const schema = (0, schema_namespaceObject.useFieldSchema)();
     const field = (0, schema_namespaceObject.useField)();
     const { styles } = (0, external_Action_Area_style_js_namespaceObject.useStyles)();
     const Current = ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
             children: [
                 /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
-                    className: styles.footer,
+                    className: "".concat(styles.footer, " ").concat(stickyFooter ? styles.stickyFooter : ''),
                     children: [
                         /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
                             className: "title",

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

@@ -58,11 +58,22 @@ function _templateObject1() {
     };
     return data;
 }
+function _templateObject2() {
+    const data = _tagged_template_literal([
+        "\n      position: sticky !important;\n      top: 0 !important;\n      z-index: 100 !important;\n      background: #fff !important;\n      background-color: #fff !important;\n      padding: ",
+        "px 0;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n      border-bottom: 1px solid rgba(5, 5, 5, 0.06);\n      margin: 0 -16px;\n      padding-left: 16px;\n      padding-right: 16px;\n\n      /* \u786E\u4FDD\u5B8C\u5168\u906E\u6321 */\n      &::before {\n        content: '';\n        position: absolute;\n        top: 0;\n        left: -100vw;\n        right: -100vw;\n        bottom: 0;\n        background: #fff;\n        z-index: -1;\n      }\n    "
+    ]);
+    _templateObject2 = function() {
+        return data;
+    };
+    return data;
+}
 const useStyles = (0, external_antd_style_namespaceObject.createStyles)((param)=>{
     let { css, token } = param;
     return {
         container: css(_templateObject(), token.padding),
-        footer: css(_templateObject1(), token.padding, token.margin, token.fontSizeHeading3, token.lineHeightHeading3)
+        footer: css(_templateObject1(), token.padding, token.margin, token.fontSizeHeading3, token.lineHeightHeading3),
+        stickyFooter: css(_templateObject2(), token.padding)
     };
 });
 exports.useStyles = __webpack_exports__.useStyles;

package/lib/schema-component/antd/association-field/InternalNester.js

@@ -88,7 +88,7 @@ const InternalNester = (0, schema_namespaceObject.observer)(()=>{
     const { options: collectionField } = (0, external_hooks_js_namespaceObject.useAssociationFieldContext)();
     var _fieldSchema_xdecoratorprops_showTitle;
     const showTitle = null != (_fieldSchema_xdecoratorprops_showTitle = null == (_fieldSchema_xdecoratorprops = fieldSchema['x-decorator-props']) ? void 0 : _fieldSchema_xdecoratorprops.showTitle) ? _fieldSchema_xdecoratorprops_showTitle : true;
-    const { actionName } = (0, index_js_namespaceObject.useACLActionParamsContext)();
+    const { params } = (0, index_js_namespaceObject.useACLActionParamsContext)();
     const { styles } = useStyles();
     (0, external_react_namespaceObject.useEffect)(()=>{
         insertNester(external_schema_js_default().Nester);
@@ -96,7 +96,7 @@ const InternalNester = (0, schema_namespaceObject.observer)(()=>{
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_collection_manager_index_js_namespaceObject.CollectionProvider_deprecated, {
         name: collectionField.target,
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_js_namespaceObject.ACLCollectionProvider, {
-            actionPath: "".concat(collectionField.target, ":").concat(actionName),
+            actionPath: "".concat(collectionField.target, ":").concat(null == params ? void 0 : params.actionName),
             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(client_namespaceObject.FormLayout, {
                 layout: 'vertical',
                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {

package/lib/schema-component/antd/association-field/InternalSubTable.js

@@ -79,7 +79,7 @@ const InternalSubTable = (0, schema_namespaceObject.observer)(()=>{
     const insert = (0, external_hooks_js_namespaceObject.useInsertSchema)('SubTable');
     const insertSelector = (0, external_hooks_js_namespaceObject.useInsertSchema)('Selector');
     const { options } = (0, external_hooks_js_namespaceObject.useAssociationFieldContext)();
-    const { actionName } = (0, index_js_namespaceObject.useACLActionParamsContext)();
+    const { params, actionName } = (0, index_js_namespaceObject.useACLActionParamsContext)();
     (0, external_react_namespaceObject.useEffect)(()=>{
         insert(external_schema_js_default().SubTable);
         field.required = fieldSchema['required'];
@@ -104,7 +104,7 @@ const InternalSubTable = (0, schema_namespaceObject.observer)(()=>{
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_collection_manager_index_js_namespaceObject.CollectionProvider_deprecated, {
         name: options.target,
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_js_namespaceObject.ACLCollectionProvider, {
-            actionPath: "".concat(options.target, ":").concat(actionName || 'view'),
+            actionPath: "".concat(options.target, ":").concat(actionName || (null == params ? void 0 : params.actionName) || 'view'),
             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(client_namespaceObject.FormLayout, {
                 className: styles.container,
                 layout: 'vertical',

package/lib/schema-component/antd/association-field/SubTable.js

@@ -112,9 +112,11 @@ const useStyles = (0, external_antd_style_namespaceObject.createStyles)((param)=
     };
 });
 const SubTable = (0, schema_namespaceObject.observer)((props)=>{
+    var _subTableField_componentProps_pagination, _subTableField_componentProps, _subTableField_componentProps_pagination1, _subTableField_componentProps1, _field_value;
     const { openSize } = props;
     const { styles } = useStyles();
     const { field, options: collectionField } = (0, external_hooks_js_namespaceObject.useAssociationFieldContext)();
+    const subTableField = (0, schema_namespaceObject.useField)();
     const { t } = (0, external_react_i18next_namespaceObject.useTranslation)();
     const [visibleSelector, setVisibleSelector] = (0, external_react_namespaceObject.useState)(false);
     const [selectedRows, setSelectedRows] = (0, external_react_namespaceObject.useState)([]);
@@ -139,6 +141,7 @@ const SubTable = (0, schema_namespaceObject.observer)((props)=>{
             return field.onInput(field.value);
         });
     };
+    const { dn } = (0, external_hooks_index_js_namespaceObject.useDesignable)();
     field.move = move;
     const options = (0, external_react_namespaceObject.useMemo)(()=>{
         if (field.value && Object.keys(field.value).length > 0) {
@@ -201,6 +204,23 @@ const SubTable = (0, schema_namespaceObject.observer)((props)=>{
         fieldValue,
         setFieldValue
     };
+    const paginationProps = {
+        pageSize: (null == (_subTableField_componentProps = subTableField.componentProps) ? void 0 : null == (_subTableField_componentProps_pagination = _subTableField_componentProps.pagination) ? void 0 : _subTableField_componentProps_pagination.pageSize) || 5,
+        current: (null == (_subTableField_componentProps1 = subTableField.componentProps) ? void 0 : null == (_subTableField_componentProps_pagination1 = _subTableField_componentProps1.pagination) ? void 0 : _subTableField_componentProps_pagination1.current) || 1,
+        total: (null == (_field_value = field.value) ? void 0 : _field_value.length) || 0
+    };
+    const onChange = (props)=>{
+        if (subTableField && fieldSchema) {
+            subTableField['componentProps'] = {
+                ...subTableField.componentProps,
+                pagination: props
+            };
+            fieldSchema['x-component-props'] = {
+                ...fieldSchema['x-component-props'],
+                pagination: props
+            };
+        }
+    };
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
         className: styles.container,
         children: [
@@ -218,13 +238,14 @@ const SubTable = (0, schema_namespaceObject.observer)((props)=>{
                             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Table_js_namespaceObject.Table, {
                                 className: styles.table,
                                 bordered: true,
+                                onChange: onChange,
                                 size: 'small',
                                 field: field,
                                 showIndex: true,
                                 dragSort: field.editable,
                                 showDel: field.editable,
                                 setFieldValue: setFieldValue,
-                                pagination: !!field.componentProps.pagination,
+                                pagination: field.componentProps.pagination ? paginationProps : false,
                                 rowSelection: {
                                     type: 'none',
                                     hideSelectAll: true

package/lib/schema-component/antd/association-field/hooks.js

@@ -194,11 +194,15 @@ const useSubFormValue = ()=>{
 };
 const useCustomTitle = (record, schema, fieldNames)=>{
     var _schema_xcomponentprops, _schema_xcomponentprops_fieldNames, _schema_xcomponentprops1;
+    if (schema) return {
+        formulaRecord: {},
+        fieldNames
+    };
     if ((null == (_schema_xcomponentprops = schema['x-component-props']) ? void 0 : _schema_xcomponentprops.mode) === 'CustomTitle' && (null == (_schema_xcomponentprops1 = schema['x-component-props']) ? void 0 : null == (_schema_xcomponentprops_fieldNames = _schema_xcomponentprops1.fieldNames) ? void 0 : _schema_xcomponentprops_fieldNames.formula)) {
-        if (Array.isArray(record[schema['name']])) record[schema['name']].forEach((recordItem)=>{
+        if (Array.isArray(record[null == schema ? void 0 : schema['name']])) record[null == schema ? void 0 : schema['name']].forEach((recordItem)=>{
             recordItem['customLabel'] = getCustomLabel(recordItem, schema);
         });
-        else record[schema['name']]['customLabel'] = getCustomLabel(record[schema['name']], schema);
+        else record[null == schema ? void 0 : schema['name']]['customLabel'] = getCustomLabel(record[null == schema ? void 0 : schema['name']], schema);
         return {
             formulaRecord: record,
             fieldNames: {

package/lib/schema-component/antd/icon-picker/IconFilterInput.js

@@ -36,19 +36,20 @@ __webpack_require__.d(__webpack_exports__, {
     IconFilterInput: ()=>IconFilterInput
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
-require("react");
 const external_antd_namespaceObject = require("antd");
 const external_lodash_namespaceObject = require("lodash");
 var external_lodash_default = /*#__PURE__*/ __webpack_require__.n(external_lodash_namespaceObject);
+const external_react_i18next_namespaceObject = require("react-i18next");
 const IconFilterInput = (props)=>{
     const { changeFilterKey } = props;
+    const { t } = (0, external_react_i18next_namespaceObject.useTranslation)();
     const onChange = external_lodash_default().debounce((e)=>{
         const inputValue = e.target.value;
         changeFilterKey(inputValue);
     }, 100);
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_antd_namespaceObject.Input, {
         allowClear: true,
-        placeholder: 'Antd\u7684key,\u4F8B\u5982"ApiOutlined",\u5FFD\u7565\u5927\u5C0F\u5199',
+        placeholder: t("The key in Antd, such as 'ApiOutlined', ignoring case"),
         onChange: onChange
     });
 };

package/lib/schema-component/antd/icon-picker/index.js

@@ -1,5 +1,11 @@
 "use strict";
 var __webpack_modules__ = {
+    "./IconFilterInput": function(module) {
+        module.exports = require("./IconFilterInput.js");
+    },
+    "./IconList": function(module) {
+        module.exports = require("./IconList.js");
+    },
     "./IconPicker": function(module) {
         module.exports = require("./IconPicker.js");
     }
@@ -53,6 +59,18 @@ var __webpack_exports__ = {};
         return _IconPicker__WEBPACK_IMPORTED_MODULE_0__[key];
     }).bind(0, __WEBPACK_IMPORT_KEY__);
     __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
+    var _IconList__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("./IconList");
+    var __WEBPACK_REEXPORT_OBJECT__ = {};
+    for(var __WEBPACK_IMPORT_KEY__ in _IconList__WEBPACK_IMPORTED_MODULE_1__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
+        return _IconList__WEBPACK_IMPORTED_MODULE_1__[key];
+    }).bind(0, __WEBPACK_IMPORT_KEY__);
+    __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
+    var _IconFilterInput__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("./IconFilterInput");
+    var __WEBPACK_REEXPORT_OBJECT__ = {};
+    for(var __WEBPACK_IMPORT_KEY__ in _IconFilterInput__WEBPACK_IMPORTED_MODULE_2__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
+        return _IconFilterInput__WEBPACK_IMPORTED_MODULE_2__[key];
+    }).bind(0, __WEBPACK_IMPORT_KEY__);
+    __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
 })();
 for(var __webpack_i__ in __webpack_exports__)exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
 Object.defineProperty(exports, '__esModule', {

package/lib/schema-component/antd/menu/Menu.js

@@ -29,8 +29,8 @@ __webpack_require__.d(__webpack_exports__, {
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const external_react_namespaceObject = require("react");
 const schema_namespaceObject = require("@tachybase/schema");
-const core_namespaceObject = require("@dnd-kit/core");
 const client_namespaceObject = require("@tego/client");
+const core_namespaceObject = require("@dnd-kit/core");
 const external_antd_namespaceObject = require("antd");
 const external_react_dom_namespaceObject = require("react-dom");
 const external_index_js_namespaceObject = require("../../index.js");

package/lib/schema-component/antd/page/Page.js

@@ -38,10 +38,10 @@ __webpack_require__.d(__webpack_exports__, {
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const external_react_namespaceObject = require("react");
 const schema_namespaceObject = require("@tachybase/schema");
+const client_namespaceObject = require("@tego/client");
 const icons_namespaceObject = require("@ant-design/icons");
 const pro_layout_namespaceObject = require("@ant-design/pro-layout");
 const core_namespaceObject = require("@dnd-kit/core");
-const client_namespaceObject = require("@tego/client");
 const external_antd_namespaceObject = require("antd");
 const external_antd_style_namespaceObject = require("antd-style");
 const external_classnames_namespaceObject = require("classnames");

package/lib/schema-component/antd/page/Page.style.js

@@ -37,7 +37,7 @@ function _tagged_template_literal(strings, raw) {
 }
 function _templateObject() {
     const data = _tagged_template_literal([
-        "\n      .ant-tabs-nav-wrap.ant-tabs-nav-wrap {\n        flex: none;\n      }\n      .ant-tabs-tab.ant-tabs-tab {\n        border: none;\n        background-color: #ffffff;\n      }\n\n      .ant-tabs-tab-active.ant-tabs-tab-active.ant-tabs-tab-active.ant-tabs-tab-active {\n        border-radius: 8px 8px 0 0;\n        box-shadow: none;\n        text-shadow: none;\n        background-color: var(--tb-box-bg);\n      }\n      .ant-tabs-extra-content {\n        flex: 1;\n      }\n    "
+        "\n      .ant-tabs-nav-wrap.ant-tabs-nav-wrap {\n        flex: none;\n      }\n      .ant-tabs-tab.ant-tabs-tab.ant-tabs-tab {\n        padding: 0;\n        border: none;\n        background-color: #ffffff;\n      }\n\n      .ant-tabs-tab-active.ant-tabs-tab-active.ant-tabs-tab-active.ant-tabs-tab-active {\n        border-radius: 8px 8px 0 0;\n        box-shadow: none;\n        text-shadow: none;\n        background-color: var(--tb-box-bg);\n      }\n      .ant-tabs-extra-content {\n        flex: 1;\n      }\n    "
     ]);
     _templateObject = function() {
         return data;
@@ -46,7 +46,7 @@ function _templateObject() {
 }
 function _templateObject1() {
     const data = _tagged_template_literal([
-        "\n      display: flex;\n      flex-direction: row;\n      justify-content: flex-end;\n\n      &.designable {\n        justify-content: space-between;\n      }\n\n      .scroll-area-extra-content {\n        align-self: flex-end;\n      }\n    "
+        "\n      display: flex;\n      flex-direction: row;\n      justify-content: flex-end;\n      &.designable {\n        justify-content: space-between;\n      }\n      .add-tab-btn {\n        border-radius: 8px 8px 0 0;\n      }\n\n      .scroll-area-extra-content {\n        align-self: flex-end;\n      }\n    "
     ]);
     _templateObject1 = function() {
         return data;
@@ -55,7 +55,7 @@ function _templateObject1() {
 }
 function _templateObject2() {
     const data = _tagged_template_literal([
-        "\n      position: relative;\n      &:hover {\n        .tab-designer-wrapper {\n          display: block;\n        }\n      }\n      .tab-designer-wrapper {\n        display: none;\n        position: absolute;\n        top: 0;\n        right: 0;\n        padding: 0 2px;\n        border-radius: 3px;\n        color: #000000;\n        background-color: #ffffff;\n\n        &:hover {\n          color: #ffffff;\n          background-color: var(--colorSettings);\n        }\n      }\n    "
+        "\n      position: relative;\n      border-radius: 8px 8px 0 0;\n      &:hover {\n        .tab-designer-wrapper {\n          display: block;\n        }\n      }\n      .tab-designer-wrapper {\n        display: none;\n        position: absolute;\n        top: 0;\n        right: 0;\n        padding: 0 2px;\n        border-radius: 3px;\n        color: #000000;\n        background-color: #ffffff;\n\n        &:hover {\n          color: #ffffff;\n          background-color: var(--colorSettings);\n        }\n      }\n    "
     ]);
     _templateObject2 = function() {
         return data;

package/lib/schema-component/antd/page/components/AddTabForm.js

@@ -0,0 +1,69 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (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 = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (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__, {
+    AddTabForm: ()=>AddTabForm
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const client_namespaceObject = require("@tego/client");
+const external_react_i18next_namespaceObject = require("react-i18next");
+const index_js_namespaceObject = require("../../../core/index.js");
+const AddTabForm = (props)=>{
+    const { options } = props;
+    const { t } = (0, external_react_i18next_namespaceObject.useTranslation)();
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_js_namespaceObject.SchemaComponentOptions, {
+        scope: options.scope,
+        components: {
+            ...options.components
+        },
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(client_namespaceObject.FormLayout, {
+            layout: 'vertical',
+            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_js_namespaceObject.SchemaComponent, {
+                schema: {
+                    properties: {
+                        title: {
+                            title: t('Tab name'),
+                            'x-component': 'Input',
+                            'x-decorator': 'FormItem',
+                            required: true
+                        },
+                        icon: {
+                            title: t('Icon'),
+                            'x-component': 'IconPicker',
+                            'x-decorator': 'FormItem'
+                        }
+                    }
+                }
+            })
+        })
+    });
+};
+exports.AddTabForm = __webpack_exports__.AddTabForm;
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "AddTabForm"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/lib/schema-component/antd/table-v2/Table.js

@@ -39,9 +39,9 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const external_react_namespaceObject = require("react");
 var external_react_default = /*#__PURE__*/ __webpack_require__.n(external_react_namespaceObject);
 const schema_namespaceObject = require("@tachybase/schema");
+const client_namespaceObject = require("@tego/client");
 const icons_namespaceObject = require("@ant-design/icons");
 const sortable_namespaceObject = require("@dnd-kit/sortable");
-const client_namespaceObject = require("@tego/client");
 const external_ahooks_namespaceObject = require("ahooks");
 const external_antd_namespaceObject = require("antd");
 const external_classnames_namespaceObject = require("classnames");
@@ -277,7 +277,7 @@ const Table = (0, withDynamicSchemaProps_js_namespaceObject.withDynamicSchemaPro
     const { styles } = (0, external_Table_styles_js_namespaceObject.useStyles)();
     const { pagination: pagination1, useProps, ...others1 } = props;
     const { pagination: pagination2, ...others2 } = (null == useProps ? void 0 : useProps()) || {};
-    const { dragSort = false, showIndex = true, onRowSelectionChange, onChange: onTableChange, rowSelection, rowKey, required, onExpand, onClickRow, ...others } = {
+    const { dragSort: tableDragSort, showIndex = true, onRowSelectionChange, onChange: onTableChange, rowSelection, rowKey, required, onExpand, onClickRow, ...others } = {
         ...others1,
         ...others2
     };
@@ -295,6 +295,7 @@ const Table = (0, withDynamicSchemaProps_js_namespaceObject.withDynamicSchemaPro
     const [selectedRow, setSelectedRow] = (0, external_react_namespaceObject.useState)([]);
     const dataSource = (null == field ? void 0 : null == (_field_value = field.value) ? void 0 : null == (_field_value_slice1 = _field_value.slice) ? void 0 : null == (_field_value_slice = _field_value_slice1.call(_field_value)) ? void 0 : null == (_field_value_slice_filter = _field_value_slice.filter) ? void 0 : _field_value_slice_filter.call(_field_value_slice, Boolean)) || [];
     const isRowSelect = (null == rowSelection ? void 0 : rowSelection.type) !== 'none';
+    const dragSort = tableDragSort || field.componentProps.dragSort || false;
     const defaultRowKeyMap = (0, external_react_namespaceObject.useRef)(new Map());
     let onRow = null, highlightRow = '';
     if (onClickRow) {

package/lib/schema-component/antd/table-v2/Table.styles.js

@@ -100,7 +100,7 @@ function _templateObject5() {
 }
 function _templateObject6() {
     const data = _tagged_template_literal([
-        "\n      max-width: 300px;\n      white-space: nowrap;\n      .tb-read-pretty-input-number {\n        text-align: right;\n      }\n      .ant-color-picker-trigger {\n        position: absolute;\n        top: 50%;\n        transform: translateY(-50%);\n      }\n    "
+        "\n      max-width: 300px;\n      white-space: nowrap;\n      .ant-color-picker-trigger {\n        position: absolute;\n        top: 50%;\n        transform: translateY(-50%);\n      }\n    "
     ]);
     _templateObject6 = function() {
         return data;

package/lib/schema-component/common/sortable-item/DragHandlePageTab.js

@@ -28,6 +28,7 @@ __webpack_require__.d(__webpack_exports__, {
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const external_react_namespaceObject = require("react");
+const utilities_namespaceObject = require("@dnd-kit/utilities");
 const external_antd_style_namespaceObject = require("antd-style");
 const index_js_namespaceObject = require("../../hooks/index.js");
 const external_DragHandlePageTab_style_js_namespaceObject = require("./DragHandlePageTab.style.js");
@@ -36,46 +37,16 @@ const DragHandlePageTab = (props)=>{
     const { isSubMenu, children, className: overStyle, isAdminMenu } = props;
     const { draggable } = (0, external_react_namespaceObject.useContext)(external_SortableItem_js_namespaceObject.SortableContext);
     const { designable } = (0, index_js_namespaceObject.useDesignable)();
-    const { attributes, listeners, setNodeRef, transform, isDragging } = draggable;
+    const { attributes, listeners, setNodeRef, isDragging, transform, transition } = draggable;
     const { styles } = (0, external_DragHandlePageTab_style_js_namespaceObject.useStyles)();
-    const ref = (0, external_react_namespaceObject.useRef)(null);
-    const [dimensions, setDimensions] = (0, external_react_namespaceObject.useState)({
-        width: 0,
-        height: 0
-    });
-    const [initialPosition, setInitialPosition] = (0, external_react_namespaceObject.useState)({
-        x: 0,
-        y: 0
-    });
-    const style = {
-        position: isDragging ? 'fixed' : 'static',
-        top: isDragging ? initialPosition.y - 5 * dimensions.height : 0,
-        left: isDragging ? initialPosition.x - dimensions.width : 0,
-        width: isDragging ? 'max-content' : '100%',
-        height: isDragging ? 'max-content' : '100%',
-        zIndex: isDragging ? 999 : 'auto',
-        pointerEvents: isDragging ? 'none' : 'auto',
-        transform: transform ? "translate3d(".concat(transform.x, "px, ").concat(transform.y, "px, 0) scale(").concat(isDragging ? 1.05 : 1, ")") : void 0,
-        boxShadow: isDragging ? '0 8px 24px 4px rgba(0,0,0,0.18)' : 'none',
-        WebkitTransform: transform ? "translate3d(".concat(transform.x, "px, ").concat(transform.y, "px, 0) scale(").concat(isDragging ? 1.05 : 1, ")") : void 0,
-        WebkitPerspective: isDragging ? 1000 : void 0,
-        isolation: isDragging ? 'isolate' : void 0
-    };
-    const handleMouseDown = (event)=>{
-        if (ref.current) {
-            const { width, height } = ref.current.getBoundingClientRect();
-            const { clientX, clientY } = event;
-            setDimensions({
-                width,
-                height
-            });
-            setInitialPosition({
-                x: clientX,
-                y: clientY
-            });
-        }
-    };
     if (!designable) return children;
+    ({
+        ...props.style,
+        transform: utilities_namespaceObject.CSS.Translate.toString(transform),
+        transition,
+        cursor: 'move',
+        zIndex: isDragging ? 999 : 'auto'
+    });
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
         ref: setNodeRef,
         className: (0, external_antd_style_namespaceObject.cx)(styles.dragHandleMenu, {
@@ -83,16 +54,10 @@ const DragHandlePageTab = (props)=>{
             leftBorder: isSubMenu && isDragging,
             adminMenu: isAdminMenu && isDragging
         }, overStyle),
-        style: style,
         ...listeners,
         ...attributes,
         role: "none",
-        onMouseDown: handleMouseDown,
-        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-            ref: ref,
-            className: 'wrapper',
-            children: children
-        })
+        children: children
     });
 };
 exports.DragHandlePageTab = __webpack_exports__.DragHandlePageTab;

package/lib/schema-component/common/sortable-item/DragHandlePageTab.style.js

@@ -37,7 +37,7 @@ function _tagged_template_literal(strings, raw) {
 }
 function _templateObject() {
     const data = _tagged_template_literal([
-        "\n      position: relative;\n      width: 100%;\n      height: 100%;\n\n      &.draggable {\n        cursor: move;\n        padding: 0 10px;\n        border-radius: 5px;\n        background: #f0f0f0;\n      }\n\n      .wrapper {\n        display: flex;\n        flex-direction: row;\n        justify-content: space-around;\n      }\n    "
+        "\n      position: relative;\n      width: 100%;\n      height: 100%;\n      padding: 6px 16px;\n      border-radius: 8px 8px 0 0;\n      &.draggable {\n        cursor: move;\n        padding: 0 10px;\n        border-radius: 5px;\n        background: #f0f0f0;\n      }\n    "
     ]);
     _templateObject = function() {
         return data;