@jetlinks-web/components 3.3.11 → 3.3.13

package/es/Skeleton/style/index.js

@@ -6,9 +6,6 @@ var JSkeletonSizeLg = '36px';
 var JSkeletonSizeSm = '16px';
 var JSkeletonSize = '24px';
 var JSkeletonBorderRadius = '8px';
-var JSkeletonBg = '#f0f2f5';
-var JSkeletonBg1 = '#e6e8eb';
-var JSkeletonBorder = "4px solid ".concat(JSkeletonBg);
 var JSkeletonFlex = {
   display: 'flex',
   gap: '24px',
@@ -27,6 +24,10 @@ var genSkeletonStyle = function genSkeletonStyle(config) {
   var _$concat6;
   var componentCls = config.componentCls,
     token = config.token;
+  var JSkeletonBg = token.colorFillQuaternary;
+  var JSkeletonBg1 = token.colorFillSecondary;
+  var JSkeletonBorder = "".concat(token.lineWidth * 4, "px solid ").concat(JSkeletonBg);
+  var JSkeletonCardBorder = "".concat(token.lineWidth * 2, "px solid ").concat(token.colorBorderSecondary);
   return _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-flex"), JSkeletonFlex), "".concat(componentCls, "-flex-between"), _objectSpread(_objectSpread({}, JSkeletonFlex), {}, {
     background: JSkeletonBg,
     height: JSkeletonSize,
@@ -34,7 +35,12 @@ var genSkeletonStyle = function genSkeletonStyle(config) {
   })), "".concat(componentCls, "-flex-column"), _objectSpread(_objectSpread({}, JSkeletonFlex), {}, {
     justifyContent: 'space-between'
   })), "".concat(componentCls), (_$concat6 = {
-    height: '100%'
+    height: '100%',
+    '--j-skeleton-bg': JSkeletonBg,
+    '--j-skeleton-bg-active': JSkeletonBg1,
+    '--j-skeleton-border': JSkeletonBorder,
+    '--j-skeleton-card-border': JSkeletonCardBorder,
+    '--j-skeleton-table-header-bg': token.colorFillTertiary
   }, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_$concat6, "".concat(componentCls, "-item"), {
     background: "linear-gradient(90deg, ".concat(JSkeletonBg, " 25%, ").concat(JSkeletonBg1, " 50%, ").concat(JSkeletonBg, " 75%)"),
     backgroundSize: '400% 100%',
@@ -83,7 +89,7 @@ var genSkeletonStyle = function genSkeletonStyle(config) {
     padding: '12px 6px',
     borderRadius: '8px'
   }), "".concat(componentCls, "-table-header"), {
-    backgroundColor: 'lightgrey'
+    backgroundColor: token.colorFillTertiary
   }), _defineProperty(_defineProperty(_defineProperty(_$concat6, "".concat(componentCls, "-table-action"), {
     width: '200px',
     display: 'grid',
@@ -96,7 +102,7 @@ var genSkeletonStyle = function genSkeletonStyle(config) {
   }), "".concat(componentCls, "-card"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-card-content"), _defineProperty(_defineProperty({
     display: 'flex',
     gap: '16px',
-    border: '2px solid #f0f2f5',
+    border: JSkeletonCardBorder,
     borderRadius: '8px',
     padding: '24px',
     marginBottom: '16px'

package/es/Title/style/index.js

@@ -11,7 +11,7 @@ var genTitleStyle = function genTitleStyle(config) {
   }, "".concat(componentCls, "-content"), {
     position: 'relative',
     paddingLeft: '10px',
-    color: 'rgba(0, 0, 0, 0.8)',
+    color: token.colorTextHeading,
     fontWeight: 600,
     lineHeight: 1,
     '&::before': {
@@ -20,7 +20,7 @@ var genTitleStyle = function genTitleStyle(config) {
       left: 0,
       width: 4,
       height: '100%',
-      background: '#1890ff',
+      background: token.colorPrimary,
       borderRadius: '0 3px 3px 0',
       content: '""'
     }

package/es/VirtualTable/style/index.js

@@ -1,5 +1,8 @@
-import genCompoentStyle from "../../style/styleRegister";
-var genVirtualTableStyle = function genVirtualTableStyle() {
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import genCompoentStyle from '../../style/styleRegister';
+import { genTokenScrollbarStyle } from '../../style/scrollbar';
+var genVirtualTableStyle = function genVirtualTableStyle(config) {
+  var token = config.token;
   return {
     '.virtual-table-wrapper': {
       display: 'flex',
@@ -17,11 +20,11 @@ var genVirtualTableStyle = function genVirtualTableStyle() {
           }
         }
       },
-      '.virtual-table-body': {
+      '.virtual-table-body': _objectSpread({
         'overflow-y': 'auto',
         position: 'relative',
         'min-height': '100px'
-      },
+      }, genTokenScrollbarStyle(token)),
       '.virtual-table-header-fixed': {
         // 位移的容器，提升位移动画性能
         'will-change': 'transform'

package/es/style/scrollbar.js

@@ -0,0 +1,24 @@
+export var genTokenScrollbarStyle = function genTokenScrollbarStyle(token) {
+  return {
+    scrollbarWidth: 'thin',
+    scrollbarColor: "".concat(token.colorFillSecondary, " ").concat(token.colorFillQuaternary),
+    '&::-webkit-scrollbar': {
+      width: 10,
+      height: 10
+    },
+    '&::-webkit-scrollbar-track': {
+      backgroundColor: token.colorFillQuaternary
+    },
+    '&::-webkit-scrollbar-thumb': {
+      backgroundColor: token.colorFillSecondary,
+      borderRadius: token.borderRadiusLG,
+      border: "".concat(token.lineWidth * 2, "px solid ").concat(token.colorFillQuaternary)
+    },
+    '&::-webkit-scrollbar-thumb:hover': {
+      backgroundColor: token.colorFill
+    },
+    '&::-webkit-scrollbar-corner': {
+      backgroundColor: token.colorFillQuaternary
+    }
+  };
+};

package/es/style/styleRegister.js

@@ -1,17 +1,51 @@
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import { genComponentStyleHook } from 'ant-design-vue/es/theme/internal';
+import { computed, unref } from 'vue';
+import { theme } from 'ant-design-vue';
+import { useStyleRegister } from 'ant-design-vue/es/theme/internal';
+import { useConfigContextInject } from 'ant-design-vue/es/config-provider/context';
+import { genCommonStyle } from 'ant-design-vue/es/style';
 import variableToken from './variable';
 var genCompoentStyle = function genCompoentStyle(styleFn) {
-  return genComponentStyleHook('jetlinks-components', function (_token, info) {
-    var componentToken = {
-      token: _objectSpread(_objectSpread({}, _token), variableToken),
-      hashId: info.hashId,
-      componentCls: ".".concat(_token.prefixCls)
-    };
-    return _toConsumableArray(styleFn.map(function (item) {
-      return item(componentToken);
-    }));
-  });
+  return function (_prefixCls) {
+    var prefixCls = computed(function () {
+      return unref(_prefixCls);
+    });
+    var _theme$useToken = theme.useToken(),
+      themeRef = _theme$useToken.theme,
+      token = _theme$useToken.token,
+      hashId = _theme$useToken.hashId;
+    var _useConfigContextInje = useConfigContextInject(),
+      getPrefixCls = _useConfigContextInje.getPrefixCls,
+      iconPrefixCls = _useConfigContextInje.iconPrefixCls;
+    var rootPrefixCls = computed(function () {
+      return getPrefixCls();
+    });
+    var componentInfo = computed(function () {
+      return {
+        theme: themeRef.value,
+        token: token.value,
+        hashId: hashId.value,
+        path: ['jetlinks-components', prefixCls.value, rootPrefixCls.value, iconPrefixCls.value]
+      };
+    });
+    var wrapSSR = useStyleRegister(componentInfo, function () {
+      var componentCls = ".".concat(prefixCls.value);
+      var componentToken = {
+        token: _objectSpread(_objectSpread(_objectSpread({}, token.value), variableToken), {}, {
+          componentCls: componentCls,
+          prefixCls: prefixCls.value,
+          iconCls: ".".concat(iconPrefixCls.value),
+          antCls: ".".concat(rootPrefixCls.value)
+        }),
+        hashId: hashId.value,
+        componentCls: componentCls
+      };
+      return [genCommonStyle(token.value, prefixCls.value)].concat(_toConsumableArray(styleFn.map(function (item) {
+        return item(componentToken);
+      })));
+    });
+    return [wrapSSR, hashId];
+  };
 };
 export default genCompoentStyle;

package/es/style/variable.js

@@ -1,4 +1 @@
-export default {
-  textColorTitle: '#000',
-  textColorSubtitle: '#263237'
-};
+export default {};

package/lib/CardSelect/style/index.js

@@ -15,8 +15,8 @@ var genCardSelectStyle = function genCardSelectStyle(config) {
     gap: '12px'
   }, "".concat(componentCls, "-item"), (0, _defineProperty2.default)({
     padding: '12px',
-    border: '1px solid #e6e6e6',
-    borderRadius: '@border-radius-base',
+    border: "".concat(token.lineWidth, "px solid ").concat(token.colorBorderSecondary),
+    borderRadius: token.borderRadius,
     cursor: 'pointer',
     '&.active': {
       borderColor: token.colorPrimary
@@ -26,7 +26,7 @@ var genCardSelectStyle = function genCardSelectStyle(config) {
       opacity: 0.7
     }
   }, "".concat(componentCls, "-describe"), {
-    color: token.textColorSubtitle
+    color: token.colorTextDescription
   })));
 };
 var _default = exports.default = (0, _styleRegister.default)([genCardSelectStyle]);

package/lib/CheckButton/style/index.js

@@ -19,27 +19,27 @@ var genCheckButtonStyle = function genCheckButtonStyle(config) {
     minWidth: 0,
     padding: '8px',
     borderRadius: token.borderRadius,
-    backgroundColor: '#f2f3f5',
+    backgroundColor: token.colorFillTertiary,
     transition: 'all 0.3s',
-    color: '#333',
+    color: token.colorText,
     textAlign: 'center',
     cursor: 'pointer',
     '&:hover': {
-      backgroundColor: token.colorPrimary,
+      backgroundColor: token.colorPrimaryHover,
       opacity: 0.85,
-      color: '#fff'
+      color: token.colorTextLightSolid
     },
     '&.selected': {
       backgroundColor: token.colorPrimary,
-      color: '#fff'
+      color: token.colorTextLightSolid
     },
     '&.disabled': {
-      backgroundColor: '#f5f5f5',
-      color: '#ccc',
+      backgroundColor: token.colorBgContainerDisabled,
+      color: token.colorTextDisabled,
       cursor: 'not-allowed',
       '&:hover': {
-        backgroundColor: '#f5f5f5',
-        color: '#ccc',
+        backgroundColor: token.colorBgContainerDisabled,
+        color: token.colorTextDisabled,
         opacity: 1
       }
     }

package/lib/DragModal/style/index.js

@@ -21,19 +21,19 @@ var genDragModalStyle = function genDragModalStyle(config) {
     flexDirection: 'column',
     overflow: 'hidden',
     zIndex: 23456765435,
-    backgroundColor: '#ffffff',
+    backgroundColor: token.colorBgElevated,
     borderRadius: 4,
-    border: '1px solid #91CAFF',
-    boxShadow: '0 3px 8px 0 rgba(22, 119, 255, 0.24)',
+    border: "".concat(token.lineWidth, "px solid ").concat(token.colorPrimaryBorder),
+    boxShadow: token.boxShadowSecondary,
     header: {
       padding: '5px 15px',
       fontSize: 18,
       fontWeight: 700,
-      color: '#333',
+      color: token.colorTextHeading,
       display: 'flex',
       justifyContent: 'space-between',
       alignItems: 'center',
-      borderBottom: '1px solid #f0f0f0',
+      borderBottom: "".concat(token.lineWidth, "px solid ").concat(token.colorSplit),
       cursor: 'move'
     }
   }, "".concat(componentCls, "-body"), {
@@ -42,7 +42,7 @@ var genDragModalStyle = function genDragModalStyle(config) {
     overflowY: 'auto',
     padding: '24px 20px'
   }), "".concat(componentCls, "-footer"), {
-    borderTop: '1px solid #f0f0f0',
+    borderTop: "".concat(token.lineWidth, "px solid ").concat(token.colorSplit),
     padding: '5px 15px'
   })), "".concat(componentCls, "-range"), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
     position: 'absolute',

package/lib/EditTable/FormItem.js

@@ -30,6 +30,7 @@ function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]
   "Schema": "setup-maybe-ref",
   "useInjectError": "setup-maybe-ref",
   "useInjectForm": "setup-maybe-ref",
+  "useTableWrapper": "setup-maybe-ref",
   "TABLE_FORM_ITEM_ERROR": "setup-maybe-ref",
   "genEditTableStyle": "setup-maybe-ref",
   "fieldPool": "setup-maybe-ref",
@@ -41,6 +42,7 @@ function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]
   "visible": "setup-ref",
   "context": "setup-maybe-ref",
   "globalErrorMessage": "setup-maybe-ref",
+  "tableWrapperRef": "setup-maybe-ref",
   "hideTimer": "setup-let",
   "cachedSchema": "setup-let",
   "cachedRulesHash": "setup-let",
@@ -76,7 +78,7 @@ import { onBeforeUnmount, computed, shallowReactive, watch, provide, toRaw, onMo
 import { get, isArray } from 'lodash-es';
 import { useProvideFormItemContext } from 'ant-design-vue/lib/form/FormItemContext';
 import Schema from 'async-validator';
-import { useInjectError, useInjectForm } from "./hooks";
+import { useInjectError, useInjectForm, useTableWrapper } from "./hooks";
 import { TABLE_FORM_ITEM_ERROR } from "./consts";
 import genEditTableStyle from './style';
 import { fieldPool } from './fieldPool';
@@ -98,6 +100,7 @@ const __sfc_main__ = _defineComponent({
         const visible = ref(false);
         const context = useInjectForm();
         const globalErrorMessage = useInjectError();
+        const tableWrapperRef = useTableWrapper();
         let hideTimer = null;
         // 缓存 Schema 实例，避免重复创建
         let cachedSchema = null;
@@ -145,7 +148,7 @@ const __sfc_main__ = _defineComponent({
         });
         // 向下提供错误状态
         provide(TABLE_FORM_ITEM_ERROR, errorState);
-        const popContainer = (e) => e;
+        const popContainer = (e) => _optionalChain([tableWrapperRef, 'optionalAccess', _4 => _4.value]) || e.parentElement || document.body;
         const removeTimer = () => {
             if (hideTimer) {
                 clearTimeout(hideTimer);
@@ -171,7 +174,7 @@ const __sfc_main__ = _defineComponent({
                 return props.rules;
             }
             // 从 context 中获取规则
-            if (_optionalChain([context, 'access', _4 => _4.rules, 'optionalAccess', _5 => _5.value]) && fieldName.value) {
+            if (_optionalChain([context, 'access', _5 => _5.rules, 'optionalAccess', _6 => _6.value]) && fieldName.value) {
                 const rules = context.rules.value[fieldName.value];
                 if (Array.isArray(rules)) {
                     return rules;
@@ -210,7 +213,7 @@ const __sfc_main__ = _defineComponent({
                 const schema = getSchema();
                 if (!schema) {
                     hideErrorTip();
-                    _optionalChain([context, 'access', _6 => _6.removeFieldError, 'optionalCall', _7 => _7(eventKey.value)]);
+                    _optionalChain([context, 'access', _7 => _7.removeFieldError, 'optionalCall', _8 => _8(eventKey.value)]);
                     resolve();
                     return;
                 }
@@ -221,12 +224,12 @@ const __sfc_main__ = _defineComponent({
                     if (errors && errors.length > 0) {
                         const errorMsg = errors[0].message || '校验失败';
                         showErrorTip(errorMsg);
-                        _optionalChain([context, 'access', _8 => _8.addFieldError, 'optionalCall', _9 => _9(eventKey.value, errorMsg)]);
+                        _optionalChain([context, 'access', _9 => _9.addFieldError, 'optionalCall', _10 => _10(eventKey.value, errorMsg)]);
                         reject(errors);
                     }
                     else {
                         hideErrorTip();
-                        _optionalChain([context, 'access', _10 => _10.removeFieldError, 'optionalCall', _11 => _11(eventKey.value)]);
+                        _optionalChain([context, 'access', _11 => _11.removeFieldError, 'optionalCall', _12 => _12(eventKey.value)]);
                         resolve();
                     }
                 });
@@ -239,18 +242,18 @@ const __sfc_main__ = _defineComponent({
                 const promise = context.validateItem({ [fieldName.value]: fieldValue.value }, rowIndex.value);
                 promise.then(() => {
                     hideErrorTip();
-                    _optionalChain([context, 'access', _12 => _12.removeFieldError, 'optionalCall', _13 => _13(eventKey.value)]);
+                    _optionalChain([context, 'access', _13 => _13.removeFieldError, 'optionalCall', _14 => _14(eventKey.value)]);
                 }).catch((res) => {
-                    const error = _optionalChain([res, 'optionalAccess', _14 => _14.filter, 'call', _15 => _15((item) => item.field === fieldName.value)]) || [];
+                    const error = _optionalChain([res, 'optionalAccess', _15 => _15.filter, 'call', _16 => _16((item) => item.field === fieldName.value)]) || [];
                     if (error.length === 0) {
                         hideErrorTip();
-                        _optionalChain([context, 'access', _16 => _16.removeFieldError, 'optionalCall', _17 => _17(eventKey.value)]);
+                        _optionalChain([context, 'access', _17 => _17.removeFieldError, 'optionalCall', _18 => _18(eventKey.value)]);
                     }
                     else {
                         removeTimer();
-                        errorState.message = _optionalChain([error, 'access', _18 => _18[0], 'optionalAccess', _19 => _19.message]) || errorState.message;
+                        errorState.message = _optionalChain([error, 'access', _19 => _19[0], 'optionalAccess', _20 => _20.message]) || errorState.message;
                         errorState.visible = !!error.length;
-                        _optionalChain([context, 'access', _20 => _20.addFieldError, 'optionalCall', _21 => _21(eventKey.value, errorState.message)]);
+                        _optionalChain([context, 'access', _21 => _21.addFieldError, 'optionalCall', _22 => _22(eventKey.value, errorState.message)]);
                     }
                 });
                 return promise;
@@ -272,7 +275,7 @@ const __sfc_main__ = _defineComponent({
         }, { immediate: true });
         watch(() => {
             const key = currentEventKey.value;
-            return key ? _optionalChain([globalErrorMessage, 'optionalAccess', _22 => _22.value, 'optionalAccess', _23 => _23[key]]) : undefined;
+            return key ? _optionalChain([globalErrorMessage, 'optionalAccess', _23 => _23.value, 'optionalAccess', _24 => _24[key]]) : undefined;
         }, (errorMsg) => {
             if (errorMsg) {
                 showErrorTip(errorMsg);
@@ -294,7 +297,7 @@ const __sfc_main__ = _defineComponent({
             onFieldChange,
             onFieldBlur,
         }, computed(() => {
-            return get(_optionalChain([context, 'access', _24 => _24.dataSource, 'optionalAccess', _25 => _25.value]), props.name);
+            return get(_optionalChain([context, 'access', _25 => _25.dataSource, 'optionalAccess', _26 => _26.value]), props.name);
         }));
         // 注册字段到父组件 - 使用字段池复用
         let isRegistered = false;
@@ -307,7 +310,7 @@ const __sfc_main__ = _defineComponent({
                     validateRules,
                     showErrorTip
                 });
-                _optionalChain([context, 'access', _26 => _26.addField, 'optionalCall', _27 => _27(eventKey.value, fieldInfo)]);
+                _optionalChain([context, 'access', _27 => _27.addField, 'optionalCall', _28 => _28(eventKey.value, fieldInfo)]);
                 isRegistered = true;
             }
         };
@@ -318,7 +321,7 @@ const __sfc_main__ = _defineComponent({
         onBeforeUnmount(() => {
             removeTimer();
             if (isRegistered) {
-                _optionalChain([context, 'access', _28 => _28.removeField, 'optionalCall', _29 => _29(eventKey.value)]);
+                _optionalChain([context, 'access', _29 => _29.removeField, 'optionalCall', _30 => _30(eventKey.value)]);
                 fieldPool.release(eventKey.value);
                 isRegistered = false;
             }

package/lib/EditTable/components/Search/sort.js

@@ -22,16 +22,21 @@ function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]
   "active": "props",
   "useTableTool": "setup-maybe-ref",
   "useTableWrapper": "setup-maybe-ref",
+  "computed": "setup-const",
   "ref": "setup-const",
   "reactive": "setup-const",
+  "theme": "setup-maybe-ref",
   "useLocaleReceiver": "setup-maybe-ref",
   "props": "setup-reactive-const",
   "emit": "setup-const",
   "contextLocale": "setup-maybe-ref",
   "tableWrapperRef": "setup-maybe-ref",
   "tableTool": "setup-maybe-ref",
+  "token": "setup-maybe-ref",
   "visible": "setup-ref",
   "mySelectedRowKeys": "setup-ref",
+  "sortIconColor": "setup-ref",
+  "sortIconActiveColor": "setup-ref",
   "columns": "setup-reactive-const",
   "visibleChange": "setup-const",
   "onSelectChange": "setup-const",
@@ -40,13 +45,15 @@ function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]
   "onAsc": "setup-const",
   "onDesc": "setup-const"
 } */
+import { useCssVars as _useCssVars } from 'vue';
 import { unref as _unref, toDisplayString as _toDisplayString, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, createTextVNode as _createTextVNode, withCtx as _withCtx, createVNode as _createVNode, normalizeClass as _normalizeClass } from "vue";
 const _hoisted_1 = { class: "jetlinks-table-sort-content" };
 const _hoisted_2 = { class: "jetlinks-table-sort-title" };
 const _hoisted_3 = { class: "table-sort-body" };
 const _hoisted_4 = { class: "jetlinks-table-sort-footer" };
 import { useTableTool, useTableWrapper } from "../../context";
-import { ref, reactive } from 'vue';
+import { computed, ref, reactive } from 'vue';
+import { theme } from 'ant-design-vue';
 import { useLocaleReceiver } from "../../../LocaleReciver";
 const __sfc_main__ = Object.assign({
     name: 'JEditTableSearchSort'
@@ -75,14 +82,21 @@ const __sfc_main__ = Object.assign({
     },
     emits: ['click'],
     setup(__props, { emit: __emit }) {
+        _useCssVars(_ctx => ({
+            "1787815589180-sortIconColor": (sortIconColor.value),
+            "1787815589180-sortIconActiveColor": (sortIconActiveColor.value)
+        }));
         const props = __props;
         const emit = __emit;
         const [contextLocale] = useLocaleReceiver('EditTable');
         const tableWrapperRef = useTableWrapper();
         const tableTool = useTableTool();
+        const { token } = theme.useToken();
         const visible = ref(false);
         const dataSource = ref([]);
         const mySelectedRowKeys = ref([]);
+        const sortIconColor = computed(() => token.value.colorTextDisabled);
+        const sortIconActiveColor = computed(() => token.value.colorPrimary);
         const columns = reactive([
             {
                 dataIndex: 'name',

package/lib/EditTable/style/body.js

@@ -6,15 +6,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.genEditTableBodyStyle = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectSpread3 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _scrollbar = require("../../style/scrollbar");
 var genEditTableBodyStyle = exports.genEditTableBodyStyle = function genEditTableBodyStyle(config) {
   var componentCls = config.componentCls,
     token = config.token;
-  return (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, '.jetlinks-edit-table-body-viewport', (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
+  return (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, '.jetlinks-edit-table-body-viewport', (0, _objectSpread3.default)((0, _objectSpread3.default)({
     maxHeight: '100%',
     width: '100%',
     overflow: 'hidden auto',
     position: 'relative'
-  }, '.jetlinks-edit-scrollbar', {
+  }, (0, _scrollbar.genTokenScrollbarStyle)(token)), {}, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, '.jetlinks-edit-scrollbar', {
     position: 'absolute',
     left: 0,
     top: 0,
@@ -33,14 +35,14 @@ var genEditTableBodyStyle = exports.genEditTableBodyStyle = function genEditTabl
     display: 'flex',
     alignItems: 'center',
     transition: 'top .2s, height .2s, background-color .1s',
-    borderBottom: '1px solid #eebebeb'
+    borderBottom: "".concat(token.lineWidth, "px solid ").concat(token.colorBorderSecondary)
   }, '.jetlinks-edit-table-cell', {
     position: 'absolute',
     minWidth: 0
   }), '&:hover', {
-    backgroundColor: 'rgb(248, 248, 248)'
+    backgroundColor: token.colorFillQuaternary
   }), '&.jetlinks-edit-table-row-selected', {
-    backgroundColor: 'var(--ant-primary-1)'
+    backgroundColor: token.colorPrimaryBg
   }), '.body-cell-box', {
     padding: '0 12px',
     position: 'relative'
@@ -51,7 +53,7 @@ var genEditTableBodyStyle = exports.genEditTableBodyStyle = function genEditTabl
     right: 0,
     bottom: 0,
     zIndex: 4
-  }))), '.jetlinks-edit-table-body-empty', {
+  })))), '.jetlinks-edit-table-body-empty', {
     display: 'flex',
     width: '100%',
     justifyContent: 'center',

package/lib/EditTable/style/group.js

@@ -14,12 +14,12 @@ var genEditTableGroupStyle = exports.genEditTableGroupStyle = function genEditTa
     overflow: 'hidden',
     position: 'relative'
   }), '.ant-tabs-tab-active', {
-    backgroundColor: '#BAE0FF !important',
-    borderColor: '#91CAFF !important'
+    backgroundColor: "".concat(token.colorPrimaryBg, " !important"),
+    borderColor: "".concat(token.colorPrimaryBorder, " !important")
   }), '.ant-tabs-nav-add', {
     border: 'none'
   }))), '.jetlinks-table-group-error-wrap', (0, _defineProperty2.default)({
-    color: '#1a1a1a !important'
+    color: "".concat(token.colorText, " !important")
   }, '.table-group-error-target', {
     position: 'absolute',
     right: 0,

package/lib/EditTable/style/header.js

@@ -17,7 +17,7 @@ var genEditTableHeaderStyle = exports.genEditTableHeaderStyle = function genEdit
     float: 'left',
     overflow: 'visible',
     position: 'absolute',
-    background: '#fafafa',
+    background: token.colorFillQuaternary,
     top: 0
   }, '.jetlinks-edit-table-header-cell-box', (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
     padding: '0 12px',
@@ -46,7 +46,7 @@ var genEditTableHeaderStyle = exports.genEditTableHeaderStyle = function genEdit
     width: '1px',
     height: '1.6em',
     pointerEvents: 'none',
-    backgroundColor: 'rgba(0,0,0,.06)',
+    backgroundColor: token.colorSplit,
     transform: 'translateY(-50%)',
     transition: 'background-color .3s',
     content: '""'
@@ -60,6 +60,6 @@ var genEditTableHeaderStyle = exports.genEditTableHeaderStyle = function genEdit
   }, '.jetlinks-drag-modal-footer', {
     display: 'none'
   }), '.jetlinks-table-search-result-total', {
-    color: '@primary-color'
+    color: token.colorPrimary
   })));
 };

package/lib/EditTable/style/menu.js

@@ -9,12 +9,12 @@ var genMenuStyle = exports.genMenuStyle = function genMenuStyle(config) {
   return {
     '.jetlinks-edit-table-context-menu': {
       position: 'fixed',
-      boxShadow: '0 0 12px rgba(0, 0, 0 ,.2)',
       borderRadius: '4px',
       overflow: 'hidden',
       width: '192px',
       padding: '4px',
-      backgroundColor: '#fff',
+      backgroundColor: token.colorBgElevated,
+      boxShadow: token.boxShadowSecondary,
       '.ant-menu': {
         borderRight: 'none',
         '.ant-menu-item': {
@@ -26,7 +26,7 @@ var genMenuStyle = exports.genMenuStyle = function genMenuStyle(config) {
         }
       },
       '.ant-menu-item-active': {
-        backgroundColor: 'var(--ant-primary-1)'
+        backgroundColor: token.colorPrimaryBg
       }
     }
   };

package/lib/EditTable/style/table.js

@@ -8,7 +8,7 @@ var genTableStyle = exports.genTableStyle = function genTableStyle(config) {
   var token = config.token;
   return {
     '.jetlinks-edit-table-wrapper': {
-      background: '#fff',
+      background: token.colorBgContainer,
       height: '100%',
       position: 'relative',
       '&.table-full-screen': {
@@ -19,7 +19,7 @@ var genTableStyle = exports.genTableStyle = function genTableStyle(config) {
         flexDirection: 'column',
         flexGrow: 0,
         flexShrink: 0,
-        background: '#fafafa',
+        background: token.colorFillQuaternary,
         transition: 'background-color .3s ease',
         overflow: 'auto hidden',
         '.jetlinks-edit-table-header': {
@@ -28,7 +28,7 @@ var genTableStyle = exports.genTableStyle = function genTableStyle(config) {
           position: 'relative'
         },
         '.jetlinks-edit-table-body': {
-          backgroundColor: '#fff',
+          backgroundColor: token.colorBgContainer,
           overflowY: 'hidden',
           position: 'relative',
           height: '100%',