@oceanbase/design 0.4.0 → 0.4.2

package/lib/slider/index.js

@@ -1,7 +1,13 @@
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
 var __copyProps = (to, from, except, desc) => {
   if (from && typeof from === "object" || typeof from === "function") {
     for (let key of __getOwnPropNames(from))
@@ -11,12 +17,43 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// src/slider/index.ts
+// src/slider/index.tsx
 var slider_exports = {};
+__export(slider_exports, {
+  default: () => slider_default
+});
 module.exports = __toCommonJS(slider_exports);
+var import_antd = require("antd");
+var import_classnames = __toESM(require("classnames"));
+var import_react = __toESM(require("react"));
+var import_config_provider = __toESM(require("../config-provider"));
+var import_style = __toESM(require("./style"));
 __reExport(slider_exports, require("antd/es/slider"), module.exports);
+var Slider = import_react.default.forwardRef(
+  ({ prefixCls: customizePrefixCls, className, ...restProps }, ref) => {
+    const { getPrefixCls } = (0, import_react.useContext)(import_config_provider.default.ConfigContext);
+    const prefixCls = getPrefixCls("slider", customizePrefixCls);
+    const { wrapSSR } = (0, import_style.default)(prefixCls);
+    const sliderCls = (0, import_classnames.default)(className);
+    return wrapSSR(
+      /* @__PURE__ */ import_react.default.createElement(import_antd.Slider, { ref, prefixCls: customizePrefixCls, className: sliderCls, ...restProps })
+    );
+  }
+);
+if (process.env.NODE_ENV !== "production") {
+  Slider.displayName = import_antd.Slider.displayName;
+}
+var slider_default = Slider;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ...require("antd/es/slider")

package/lib/slider/style/index.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { FullToken, GenerateStyle } from 'antd/es/theme/internal';
+export type SliderToken = FullToken<'Slider'>;
+export declare const genSliderStyle: GenerateStyle<SliderToken>;
+declare const _default: (prefixCls: string) => {
+    wrapSSR: (node: import("react").ReactNode) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+    hashId: string;
+};
+export default _default;

package/lib/slider/style/index.js

@@ -0,0 +1,51 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/slider/style/index.ts
+var style_exports = {};
+__export(style_exports, {
+  default: () => style_default,
+  genSliderStyle: () => genSliderStyle
+});
+module.exports = __toCommonJS(style_exports);
+var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
+var genSliderStyle = (token) => {
+  const { componentCls, dotSize = 8 } = token;
+  return {
+    [`${componentCls}${componentCls}-horizontal`]: {
+      [`${componentCls}-mark`]: {
+        [`${componentCls}-mark-text[style*="left: 0%;"]`]: {
+          transform: `translateX(calc(0% - ${dotSize / 2}px)) !important`
+        },
+        [`${componentCls}-mark-text[style*="left: 100%;"]`]: {
+          transform: `translateX(calc(-100% + ${dotSize / 2}px)) !important`
+        }
+      }
+    }
+  };
+};
+var style_default = (prefixCls) => {
+  const useStyle = (0, import_genComponentStyleHook.genComponentStyleHook)("Slider", (token) => {
+    return [genSliderStyle(token)];
+  });
+  return useStyle(prefixCls);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  genSliderStyle
+});

package/lib/switch/index.d.ts

@@ -1 +1,5 @@
+import type { SwitchProps as AntSwitchProps } from 'antd/es/switch';
+import React from 'react';
 export * from 'antd/es/switch';
+declare const Switch: React.ForwardRefExoticComponent<AntSwitchProps & React.RefAttributes<HTMLButtonElement>>;
+export default Switch;

package/lib/switch/index.js

@@ -1,7 +1,13 @@
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
 var __copyProps = (to, from, except, desc) => {
   if (from && typeof from === "object" || typeof from === "function") {
     for (let key of __getOwnPropNames(from))
@@ -11,12 +17,45 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// src/switch/index.ts
+// src/switch/index.tsx
 var switch_exports = {};
+__export(switch_exports, {
+  default: () => switch_default
+});
 module.exports = __toCommonJS(switch_exports);
+var import_antd = require("antd");
+var import_classnames = __toESM(require("classnames"));
+var import_react = __toESM(require("react"));
+var import_config_provider = __toESM(require("../config-provider"));
+var import_style = __toESM(require("./style"));
 __reExport(switch_exports, require("antd/es/switch"), module.exports);
+var InternalSwitch = import_react.default.forwardRef(
+  ({ prefixCls: customizePrefixCls, className, ...restProps }, ref) => {
+    const { getPrefixCls } = (0, import_react.useContext)(import_config_provider.default.ConfigContext);
+    const prefixCls = getPrefixCls("switch", customizePrefixCls);
+    const { wrapSSR } = (0, import_style.default)(prefixCls);
+    const switchCls = (0, import_classnames.default)(className);
+    return wrapSSR(
+      /* @__PURE__ */ import_react.default.createElement(import_antd.Switch, { ref, prefixCls: customizePrefixCls, className: switchCls, ...restProps })
+    );
+  }
+);
+var Switch = InternalSwitch;
+Switch.__ANT_SWITCH = import_antd.Switch.__ANT_SWITCH;
+if (process.env.NODE_ENV !== "production") {
+  Switch.displayName = import_antd.Switch.displayName;
+}
+var switch_default = Switch;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ...require("antd/es/switch")

package/lib/switch/style/index.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { FullToken, GenerateStyle } from 'antd/es/theme/internal';
+export type SwitchToken = FullToken<'Switch'>;
+export declare const genSwitchStyle: GenerateStyle<SwitchToken>;
+declare const _default: (prefixCls: string) => {
+    wrapSSR: (node: import("react").ReactNode) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+    hashId: string;
+};
+export default _default;

package/lib/switch/style/index.js

@@ -0,0 +1,44 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/switch/style/index.ts
+var style_exports = {};
+__export(style_exports, {
+  default: () => style_default,
+  genSwitchStyle: () => genSwitchStyle
+});
+module.exports = __toCommonJS(style_exports);
+var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
+var genSwitchStyle = (token) => {
+  const { componentCls } = token;
+  return {
+    [`${componentCls}:not(${componentCls}-checked):not(${componentCls}-disabled):not(${componentCls}-loading)`]: {
+      background: token.colorTextTertiary
+    }
+  };
+};
+var style_default = (prefixCls) => {
+  const useStyle = (0, import_genComponentStyleHook.genComponentStyleHook)("Switch", (token) => {
+    return [genSwitchStyle(token)];
+  });
+  return useStyle(prefixCls);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  genSwitchStyle
+});

package/lib/table/index.js

@@ -39,6 +39,7 @@ var import_lodash = require("lodash");
 var import_react = __toESM(require("react"));
 var import_config_provider = __toESM(require("../config-provider"));
 var import_typography = __toESM(require("../typography"));
+var import_empty = __toESM(require("../empty"));
 var import_style = __toESM(require("./style"));
 var import_useDefaultPagination = __toESM(require("./hooks/useDefaultPagination"));
 var import_useMergedState = __toESM(require("rc-util/lib/hooks/useMergedState"));
@@ -49,6 +50,7 @@ function Table(props, ref) {
   const {
     locale: customLocale,
     columns,
+    footer,
     pagination: customPagination,
     rowSelection,
     toolAlertRender,
@@ -65,7 +67,11 @@ function Table(props, ref) {
   const extendedContext = (0, import_react.useContext)(import_config_provider.default.ExtendedConfigContext);
   const pagination = (0, import_useDefaultPagination.default)(customPagination);
   const { getPrefixCls, locale, table } = (0, import_react.useContext)(import_config_provider.default.ConfigContext);
-  const { batchOperationBar, ...restLocale } = {
+  const {
+    batchOperationBar,
+    emptyText = /* @__PURE__ */ import_react.default.createElement(import_empty.default, { image: import_empty.default.PRESENTED_IMAGE_SIMPLE }),
+    ...restLocale
+  } = {
     ...customLocale,
     batchOperationBar: {
       ...(_a = import_en_US.default.Table) == null ? void 0 : _a.batchOperationBar,
@@ -77,7 +83,9 @@ function Table(props, ref) {
   const { wrapSSR } = (0, import_style.default)(prefixCls);
   const tableCls = (0, import_classnames.default)(
     {
-      [`${prefixCls}-expandable`]: !(0, import_lodash.isEmpty)(expandable)
+      [`${prefixCls}-expandable`]: !(0, import_lodash.isEmpty)(expandable),
+      [`${prefixCls}-selectable`]: !!rowSelection,
+      [`${prefixCls}-has-footer`]: !!footer
     },
     className
   );
@@ -170,8 +178,15 @@ function Table(props, ref) {
         ref,
         prefixCls: customizePrefixCls,
         className: tableCls,
-        locale: restLocale,
+        locale: {
+          ...restLocale,
+          emptyText: /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixCls}-empty-wrapper` }, typeof emptyText === "function" ? emptyText() : emptyText)
+        },
         columns: newColumns,
+        expandable: expandable ? {
+          columnWidth: 32,
+          ...expandable
+        } : void 0,
         rowSelection: rowSelection ? {
           columnWidth: table == null ? void 0 : table.selectionColumnWidth,
           ...rowSelection,
@@ -181,6 +196,7 @@ function Table(props, ref) {
             (_a2 = rowSelection == null ? void 0 : rowSelection.onChange) == null ? void 0 : _a2.call(rowSelection, selectedRowKeys, selectedRows, info);
           }
         } : void 0,
+        footer,
         pagination: pagination === false ? false : {
           ...pagination,
           hideOnSinglePage: toolAlertRender || toolOptionsRender || toolSelectedContent || (pagination == null ? void 0 : pagination.showSizeChanger) ? false : (pagination == null ? void 0 : pagination.hideOnSinglePage) !== void 0 ? pagination == null ? void 0 : pagination.hideOnSinglePage : extendedContext.hideOnSinglePage,

package/lib/table/style/index.js

@@ -36,12 +36,9 @@ var genTableStyle = (token) => {
     colorLink,
     borderRadiusLG,
     colorBorderSecondary,
-    paddingSM,
     padding,
-    paddingLG,
     marginLG,
-    marginXS,
-    marginSM
+    marginXS
   } = token;
   return {
     // 表格通用样式
@@ -49,19 +46,32 @@ var genTableStyle = (token) => {
       color: colorText,
       backgroundColor: colorBgBase,
       borderRadius: borderRadiusLG,
+      [`${componentCls}-footer`]: {
+        borderBottom: `1px solid ${colorBorderSecondary}`
+      },
+      // 单元格通用样式
+      [`${componentCls}-thead, ${componentCls}-tbody`]: {
+        ["td, th"]: {
+          [`&${componentCls}-row-expand-icon-cell`]: {
+            backgroundColor: colorBgBase,
+            padding: `${token.paddingSM}px ${token.paddingXS}px`
+          },
+          // 内容第一列，左侧间距减小为 8px
+          [`&:not(:first-child):not(${componentCls}-selection-column):not(${componentCls}-row-expand-icon-cell)`]: {
+            paddingLeft: token.paddingXS
+          }
+        }
+      },
       // head 样式
       [`${componentCls}-thead > tr`]: {
-        ["td, th"]: {
+        ["th"]: {
           // 弱化列标题
           color: colorTextSecondary,
           fontWeight: "normal",
           backgroundColor: colorBgBase
         },
-        [`td${componentCls}-row-expand-icon-cell`]: {
-          backgroundColor: colorBgBase
-        },
         // 去掉排序列表头的灰色背景
-        [`th${componentCls}-column-sort`]: {
+        [`th${componentCls}-column-has-sorters`]: {
           backgroundColor: colorBgBase
         },
         [`${componentCls}-cell-scrollbar`]: {
@@ -85,39 +95,56 @@ var genTableStyle = (token) => {
         [`tr${componentCls}-row-selected > td`]: {
           backgroundColor: `${colorPrimaryBg} !important`
         },
-        // 展开行样式
-        [`${componentCls}-expanded-row > td`]: {
-          padding: `${paddingSM}px ${paddingLG}px ${paddingSM}px ${padding + paddingLG}px !important`,
-          backgroundColor: colorBgBase,
-          // 除内嵌子表格外，设置其他内嵌元素样式
-          [`& > *:not(${componentCls}-wrapper)`]: {
-            marginTop: -marginSM,
-            padding: `${paddingSM}px ${padding}px`,
-            backgroundColor: colorFillQuaternary,
-            borderRadius: borderRadiusLG
+        [`${componentCls}-tbody-virtual-scrollbar ${componentCls}-tbody-virtual-scrollbar-thumb`]: {
+          background: `${token.colorFillSecondary} !important`
+        },
+        // 去掉可展开行在展开时的底部 border
+        [`tr > td:has(${componentCls}-row-expand-icon-expanded)`]: {
+          borderBottom: "none",
+          [`& ~ td`]: {
+            borderBottom: "none"
           }
         },
+        // 为了避免行展开/收起时出现 border 动画，覆盖 antd 默认配置，仅设置背景色动画
+        [`tr > td`]: {
+          transition: `background ${token.motionDurationMid}`
+        },
+        // empty style
+        [`${componentCls}-placeholder td`]: {
+          borderBottom: "none"
+        },
+        [`${componentCls}-empty-wrapper`]: {
+          minHeight: 360,
+          display: "flex",
+          justifyContent: "center",
+          alignItems: "center"
+        },
         // 嵌套子表格样式
         [`tr > td > ${componentCls}-wrapper:only-child ${componentCls}`]: {
-          // 调整嵌套子表格的间距
-          marginBlock: "0 !important",
-          marginInline: "0 !important",
-          // 设置嵌套子表格的单元格背景色
+          borderBottom: "none",
+          // 设置嵌套子表格的表头背景色
           [`${componentCls}-thead > tr > th`]: {
-            backgroundColor: `${colorFillQuaternary} !important`
+            backgroundColor: token.colorFillQuaternary
           },
-          [`${componentCls}-tbody ${componentCls}-row td`]: {
-            backgroundColor: `${colorFillQuaternary} !important`
+          // 去掉表头左右单元格的圆角
+          [`${componentCls}-thead > tr:first-child > th:first-child`]: {
+            borderRadius: 0
           },
-          // 设置最后一行左右两列的圆角
-          [`${componentCls}-tbody > tr:last-child`]: {
-            ["td:first-child, td:last-child"]: {
-              borderRadius: borderRadiusLG
-            }
+          [`${componentCls}-thead > tr:first-child > th:last-child`]: {
+            borderRadius: 0
+          },
+          // empty wrapper style
+          [`${componentCls}-empty-wrapper`]: {
+            minHeight: "auto"
           }
         }
       }
     },
+    // 非可展开表格、带 footer 表格、空表格、带边框表格: 底部添加分隔线
+    [`${componentCls}-wrapper:not(${componentCls}-expandable):not(${componentCls}-has-footer) ${componentCls}:not(${componentCls}-bordered):not(${componentCls}-empty)`]: {
+      borderBottom: `1px solid ${colorBorderSecondary}`,
+      borderRadius: 0
+    },
     // 滚动表格样式
     // 由于滚动表格会在 tbody 下最前面多一个 tr 元素，因此需要设置相反的斑马条样式
     // .ant-table-scroll-horizontal: 水平滚动
@@ -133,16 +160,6 @@ var genTableStyle = (token) => {
         }
       }
     },
-    // 去掉非展开表格的边框
-    [`${componentCls}-wrapper:not(${componentCls}-expandable)`]: {
-      [`${componentCls}:not(${componentCls}-bordered)`]: {
-        [`${componentCls}-tbody`]: {
-          [`tr:not(${componentCls}-measure-row) > td`]: {
-            border: "none"
-          }
-        }
-      }
-    },
     // 可展开表格样式
     [`${componentCls}-wrapper${componentCls}-expandable`]: {
       [`${componentCls}`]: {
@@ -157,13 +174,44 @@ var genTableStyle = (token) => {
                 backgroundColor: colorPrimaryBg
               }
             }
+          },
+          // 嵌套子表格和父表格第一列对齐
+          [`tr > td > ${componentCls}-wrapper:only-child ${componentCls}`]: {
+            marginLeft: token.marginXS + token.lineWidth * 2
           }
         }
       },
-      // Remove pagination borderTop for expandable Table
-      [`${componentCls}-pagination`]: {
-        [`&${antCls}-pagination`]: {
-          borderTop: "none"
+      [`${componentCls}-middle, ${componentCls}-small`]: {
+        [`${componentCls}-tbody`]: {
+          // 嵌套子表格和父表格第一列对齐
+          [`tr > td > ${componentCls}-wrapper:only-child ${componentCls}`]: {
+            marginLeft: token.marginXS + token.lineWidth * 2 + token.margin
+          }
+        }
+      }
+    },
+    // 可展开表格 + 可选择表格样式
+    [`${componentCls}-wrapper${componentCls}-expandable${componentCls}-selectable`]: {
+      [`${componentCls}`]: {
+        [`${componentCls}-tbody`]: {
+          [`${componentCls}-expanded-row > td`]: {
+            // 除内嵌子表格外，设置其他内嵌元素样式
+            [`& > *:not(${componentCls}-wrapper)`]: {
+              marginLeft: token.marginLG + token.marginXL + token.lineWidth * 2
+            }
+          },
+          // 嵌套子表格和父表格第一列对齐
+          [`tr > td > ${componentCls}-wrapper:only-child ${componentCls}`]: {
+            marginLeft: token.marginXS + token.marginXL + token.lineWidth * 2
+          }
+        }
+      },
+      [`${componentCls}-middle, ${componentCls}-small`]: {
+        [`${componentCls}-tbody`]: {
+          // 嵌套子表格和父表格第一列对齐
+          [`tr > td > ${componentCls}-wrapper:only-child ${componentCls}`]: {
+            marginLeft: token.marginXS + token.marginXL + token.lineWidth * 2 + token.margin
+          }
         }
       }
     },
@@ -181,8 +229,7 @@ var genTableStyle = (token) => {
       [`${componentCls}-pagination`]: {
         [`&${antCls}-pagination`]: {
           padding: `${padding}px 0`,
-          margin: "0 !important",
-          borderTop: `1px solid ${colorBorderSecondary}`
+          margin: "0 !important"
         },
         // 批量操作栏样式
         [`${componentCls}-batch-operation-bar`]: {
@@ -199,14 +246,6 @@ var genTableStyle = (token) => {
             }
           }
         }
-      },
-      // Remove pagination borderTop for bordered Table
-      [`${componentCls}${componentCls}-bordered`]: {
-        [`&+${componentCls}-pagination`]: {
-          [`&${antCls}-pagination`]: {
-            borderTop: "none"
-          }
-        }
       }
     },
     // 批量操作栏中的弹出层样式

package/lib/theme/default.js

@@ -30,16 +30,6 @@ var defaultTheme = {
   token: {
     fontFamily: `-apple-system, 'Noto Sans', BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'`,
     fontFamilyCode: `Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace`,
-    fontSizeHeading1: 32,
-    fontSizeHeading2: 24,
-    fontSizeHeading3: 20,
-    fontSizeHeading4: 16,
-    fontSizeHeading5: 14,
-    lineHeightHeading1: 40 / 32,
-    lineHeightHeading2: 32 / 24,
-    lineHeightHeading3: 28 / 20,
-    lineHeightHeading4: 24 / 16,
-    lineHeightHeading5: 22 / 14,
     colorPrimaryBg: "#EAF1FF",
     colorPrimary: "#006AFF",
     colorPrimaryBgHover: "#EAF1FF",
@@ -110,14 +100,17 @@ var defaultTheme = {
     boxShadowSecondary: "0 6px 16px 0 rgba(54, 69, 99, 0.08), 0 3px 6px -4px rgba(54, 69, 99, 0.12), 0 9px 28px 8px rgba(54, 69, 99, 0.05)",
     boxShadow: "0 1px 2px 0 rgba(54, 69, 99, 0.03), 0 1px 6px -1px rgba(54, 69, 99, 0.02), 0 2px 4px 0 rgba(54, 69, 99, 0.02)",
     borderRadius: 6,
-    wireframe: false
+    wireframe: false,
+    // Remove focus outline
+    lineWidthFocus: 0
   },
   components: {
     Breadcrumb: {
       fontSize: 12,
       // @ts-ignore
       // fontHeight is internal token
-      fontHeight: 20
+      fontHeight: 20,
+      lastItemColor: "#5c6b8a"
     },
     InputNumber: {
       handleVisible: true
@@ -132,6 +125,14 @@ var defaultTheme = {
       multipleItemBorderColor: tagColorBorder,
       multipleItemBorderColorDisabled: tagColorBorder
     },
+    Slider: {
+      trackBg: "#006AFF",
+      trackHoverBg: "#5189fb",
+      trackBgDisabled: "#b3ccff",
+      handleColor: "#006AFF",
+      handleActiveColor: "#5189fb",
+      handleColorDisabled: "#b3ccff"
+    },
     Tag: {
       defaultColor: "#5c6b8a",
       colorBorder: tagColorBorder

package/lib/theme/style/aliyun.less

@@ -312,6 +312,9 @@
 @colorFillSecondary: rgba(0, 0, 0, 0.06);
 @colorFillTertiary: rgba(0, 0, 0, 0.04);
 @colorFillQuaternary: rgba(0, 0, 0, 0.02);
+@colorBgSolid: rgb(0, 0, 0);
+@colorBgSolidHover: rgba(0, 0, 0, 0.75);
+@colorBgSolidActive: rgba(0, 0, 0, 0.95);
 @colorBgLayout: #f2f3f5;
 @colorBgContainer: #ffffff;
 @colorBgElevated: #ffffff;
@@ -339,6 +342,7 @@
 @colorSuccessTextActive: #009c6d;
 @colorErrorBg: #fff2f0;
 @colorErrorBgHover: #ffe2de;
+@colorErrorBgFilledHover: #ffd7d3;
 @colorErrorBgActive: #ffbcb5;
 @colorErrorBorder: #ffbcb5;
 @colorErrorBorderHover: #ff948c;
@@ -430,7 +434,7 @@
 @colorErrorOutline: rgba(255, 38, 5, 0.06);
 @colorWarningOutline: rgba(255, 195, 5, 0.1);
 @fontSizeIcon: 12;
-@lineWidthFocus: 4;
+@lineWidthFocus: 3;
 @controlInteractiveSize: 16;
 @controlItemBgHover: rgba(0, 0, 0, 0.04);
 @controlItemBgActive: #e6f4ff;

package/lib/theme/style/compact.less

@@ -312,6 +312,9 @@
 @colorFillSecondary: #e2e8f3;
 @colorFillTertiary: #f3f6fc;
 @colorFillQuaternary: #f8fafe;
+@colorBgSolid: rgb(0, 0, 0);
+@colorBgSolidHover: rgba(0, 0, 0, 0.75);
+@colorBgSolidActive: rgba(0, 0, 0, 0.95);
 @colorBgLayout: #f3f6fc;
 @colorBgContainer: #ffffff;
 @colorBgElevated: #ffffff;
@@ -339,6 +342,7 @@
 @colorSuccessTextActive: #00b378;
 @colorErrorBg: #ffebeb;
 @colorErrorBgHover: #ffd6d6;
+@colorErrorBgFilledHover: #ffd7d3;
 @colorErrorBgActive: #ffbcb5;
 @colorErrorBorder: #ffb3b3;
 @colorErrorBorderHover: #ff7575;
@@ -373,7 +377,7 @@
 @fontSizeLG: 14;
 @fontSizeXL: 16;
 @fontSizeHeading1: 32;
-@fontSizeHeading2: 24;
+@fontSizeHeading2: 26;
 @fontSizeHeading3: 20;
 @fontSizeHeading4: 16;
 @fontSizeHeading5: 14;
@@ -384,7 +388,7 @@
 @fontHeightLG: 22;
 @fontHeightSM: 18;
 @lineHeightHeading1: 1.25;
-@lineHeightHeading2: 1.3333333333333333;
+@lineHeightHeading2: 1.3076923076923077;
 @lineHeightHeading3: 1.4;
 @lineHeightHeading4: 1.5;
 @lineHeightHeading5: 1.5714285714285714;
@@ -410,6 +414,7 @@
 @borderRadiusOuter: 4;
 @boxShadowSecondary: 0 6px 16px 0 rgba(54, 69, 99, 0.08), 0 3px 6px -4px rgba(54, 69, 99, 0.12), 0 9px 28px 8px rgba(54, 69, 99, 0.05);
 @boxShadow: 0 1px 2px 0 rgba(54, 69, 99, 0.03), 0 1px 6px -1px rgba(54, 69, 99, 0.02), 0 2px 4px 0 rgba(54, 69, 99, 0.02);
+@lineWidthFocus: 3;
 @colorFillContent: #e2e8f3;
 @colorFillContentHover: #cdd5e4;
 @colorFillAlter: #f8fafe;
@@ -430,7 +435,6 @@
 @colorErrorOutline: rgba(255, 5, 5, 0.08);
 @colorWarningOutline: rgba(255, 164, 19, 0.11);
 @fontSizeIcon: 10;
-@lineWidthFocus: 4;
 @controlOutlineWidth: 2;
 @controlInteractiveSize: 14;
 @controlItemBgHover: #f3f6fc;