@aloudata/aloudata-design 0.2.7 → 0.3.0-beta.1

package/es/Tabs/style/index.less

@@ -1,39 +1,71 @@
 @import '../../style/index.less';
 
+//status- default
+@Tabs-color: @NL30;
+@Tabs-fontWeight: 400;
+//active
+@Tabs-color-active: @B60;
+@Tabs-fontWeight-active: 600;
+
+//middle - default
+@Tabs-fontSize: 14px;
+@Tabs-lineHeight: 20px;
+@Tabs-ink-link-bar-height: 2px;
+//large
+@Tabs-fontSize-large: 16px;
+@Tabs-lineHeight-large: 24px;
+@Tabs-ink-link-bar-height-large: 3px;
+// @Tabs-
 .ant-tabs.ald-tabs {
   &.ant-tabs {
     color: @NL30;
   }
 
   .ant-tabs-tab {
-    font-size: 14px;
-    line-height: 20px;
+    padding: 8px 0;
+    color: @Tabs-color;
+    font-weight: @Tabs-fontWeight;
+    font-size: @Tabs-fontSize;
+    line-height: @Tabs-lineHeight;
 
     &:hover {
       color: inherit;
     }
 
     &.ant-tabs-tab-active {
-      font-weight: 500;
+      font-weight: @Tabs-fontWeight-active;
     }
   }
 
   .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
+    color: @Tabs-color-active;
+    font-weight: @Tabs-fontWeight-active;
     text-shadow: none;
   }
 
+  .ant-tabs-ink-bar {
+    height: @Tabs-ink-link-bar-height;
+    background: @Tabs-color-active;
+    border-top-left-radius: 2px;
+    border-top-right-radius: 2px;
+  }
+
   /* large size */
   &.ant-tabs-large {
     .ant-tabs-tab {
-      font-size: 16px;
-      line-height: 24px;
+      font-size: @Tabs-fontSize-large;
+      line-height: @Tabs-lineHeight-large;
+    }
+
+    .ant-tabs-ink-bar {
+      height: @Tabs-ink-link-bar-height-large;
     }
   }
 
   &.ald-tabs-default {
     .ant-tabs-tab {
-      font-size: 14px;
-      line-height: 20px;
+      font-size: @Tabs-fontSize;
+      line-height: @Tabs-lineHeight;
     }
   }
 

package/es/Tooltip/style/index.less

@@ -3,8 +3,9 @@
 .ald-tooltip-overlay {
   .ant-tooltip-inner {
     padding: 6px 12px;
+    line-height: 20px;
     background: @BG10;
-    border-radius: @ald-border-radius-base;
+    border-radius: @border-radius-base;
     box-shadow: none;
   }
 

package/es/index.d.ts

@@ -12,12 +12,12 @@ export { default as Tabs } from './Tabs';
 export type { ITabsProps as TabsProps, TabsSize } from './Tabs';
 export { default as Tooltip } from './Tooltip';
 export type { ITooltipProps as TooltipProps, ActionType as TooltipActionType } from './Tooltip';
+export type { SelectProps } from './Select';
 export { default as Select } from './Select';
-export type { ISelectProps as SelectProps, IOption } from './Select/interface';
 export { default as Table } from './Table';
 export type { ISort, TSortOrder, ITableProps, IColumn } from './Table/interface';
 export { default as Navigator } from './Navigator';
-export type { INavigatorProps as NavigatorProps, IMenuItem as NavigatorMenu } from './Navigator';
+export type { INavigatorProps as NavigatorProps, IMenuItem as NavigatorMenu, ISelectedMenuInfo as SelectedMenuInfo, } from './Navigator';
 export { default as Alert } from './Alert';
 export type { AlertProps } from './Alert';
 export { default as Col } from './Col';
@@ -56,3 +56,15 @@ export { default as Radio } from './Radio';
 export type { RadioProps, RadioChangeEvent, RadioGroupProps } from './Radio';
 export { default as Checkbox } from './Checkbox';
 export type { CheckboxProps, CheckboxOptionType } from './Checkbox';
+export { default as Modal } from './Modal';
+export type { ModalProps, ModalFuncProps } from './Modal';
+export { default as Popover } from './Popover';
+export type { PopoverProps } from './Popover';
+export type { InputNumberProps } from './InputNumber';
+export { default as InputNumber } from './InputNumber';
+export { default as Breadcrumb } from './Breadcrumb';
+export type { BreadcrumbProps, BreadcrumbItemProps } from './Breadcrumb';
+export { default as Empty } from './Empty';
+export type { IEmptyProps as EmptyProps } from './Empty';
+export { default as Avatar } from './Avatar';
+export type { IAvatarProps as AvatarProps } from './Avatar';

package/es/index.js

@@ -27,4 +27,10 @@ export { default as Steps } from './Steps';
 export { default as Form } from './Form';
 export { default as Divider } from './Divider';
 export { default as Radio } from './Radio';
-export { default as Checkbox } from './Checkbox';
+export { default as Checkbox } from './Checkbox';
+export { default as Modal } from './Modal';
+export { default as Popover } from './Popover';
+export { default as InputNumber } from './InputNumber';
+export { default as Breadcrumb } from './Breadcrumb';
+export { default as Empty } from './Empty';
+export { default as Avatar } from './Avatar';

package/es/style/index.less

@@ -1,3 +1,4 @@
 @root-entry-name: default;
 @import './mixins/index.less';
-@import './themes/default/index.less';
+@import './themes/default/index.less';
+@import './mixins/index.less';

package/es/style/mixins/index.less

@@ -0,0 +1,8 @@
+// 1. 字体样式
+.textStyle(@color: @NL50, @font-size: 14px, @line-height: 20px, @font-weight: normal, @font-style: normal) {
+  color: @color;
+  font-weight: @font-weight;
+  font-size: @font-size;
+  font-style: @font-style;
+  line-height: @line-height;
+}

package/es/style/themes/default/index.less

@@ -1,20 +1,20 @@
 @import './themeColor.module.less';
-@font-family:sans-serif,-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol','Noto Color Emoji';
+@font-family:Inter, -apple-system, PingFang SC, BlinkMacSystemFont,"Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji","Segoe UI Emoji", "Segoe UI Symbol";
 @ald-prefix: ant;
 
 
 // height rules
-@ald-height-base: 28px;
-@ald-height-lg: 32px;
-@ald-height-sm: 22px;
+@height-base: 28px;
+@height-lg: 32px;
+@height-sm: 22px;
 
 
-@ald-border-radius-base: 8px;
-@ald-border-radius-sm: 6px;
-@ald-border-color-base: #e7e8e9; // 边框的基础色
+@border-radius-base: 8px;
+@border-radius-sm: 6px;
+@border-color-base: #e7e8e9; // 边框的基础色
 
 // color
-@primary-color: @B60; // 主色调
+@primary-color: @B40; // 主色调
 @error-color: @SC40; // 错误色
 @success-color: @SA40; // 成功色
 @warning-color: @SB40; // 警告色
@@ -32,5 +32,5 @@
 
 //Select
 
-@ald-select-placeholder-color: @NL50;
-@ald-select-label-margin-right:4px;
+@select-placeholder-color: @NL50;
+@select-label-margin-right:4px;

package/es/style/themes/default/themeColor.module.less

@@ -2,7 +2,7 @@
 *中性浅色背景 Neutral Light
 * 主要用于文字颜色
 **/
-@NL0: #121212;
+@NL0: #001A33;
 @NL97: fade(@NL0, 3%);
 @NL95: fade(@NL0, 5%);
 @NL90: fade(@NL0, 10%);
@@ -36,101 +36,84 @@
 * 品牌色 Brand
 * 用作主操作强调、文字链、品牌传递
 **/
-@B10: #00127B;
-@B20: #1029BC;
-@B30: #2944D7;
-@B40: #435CF0;
-@B50: #6077FF;
-@B60: #7F92FF;
-@B70: #9FADFF;
-@B80: #BDC9FF;
-@B90: #DFE3FE;
-@B95: #EFF1FF;
-@B98: #F8F9FF;
+@B10: #001252;
+@B20: #071E6A;
+@B30: #0F2B7F;
+@B40: #0F38A6;
+@B50: #1945B3;
+@B60: #1552DF;
+@B70: #5588F6;
+@B80: #79A5FE;
+@B90: #ABC8FE;
+@B95: #D4E4FF;
+@B98: #EFF5FF;
 
 /**
 * 辅助A Secondary A
 * 表达完成、成功
 **/
-@SA10: #00270F;
-@SA20: #024F20;
-@SA30: #007830;
-@SA40: #059F41;
-@SA50: #08C552;
-@SA60: #1BDE6D;
-@SA70: #35F886;
-@SA80: #70FFAB;
-@SA90: #B8FFD5;
-@SA95: #DBFFEA;
-@SA98: #EFFFF5;
+@SA10: #003331;
+@SA20: #00493F;
+@SA30: #015844;
+@SA40: #026E4A;
+@SA50: #03834C;
+@SA60: #05994A;
+@SA70: #35C168;
+@SA80: #5EE080;
+@SA90: #96F4A5;
+@SA95: #C9F9CC;
+@SA98: #F0FFF0;
 
 /**
 * 辅助B Secondary B
 * 表达提醒、警告
 **/
-@SB10: #261600;
-@SB20: #542B00;
-@SB30: #7E4100;
-@SB40: #A85700;
-@SB50: #D26E00;
-@SB60: #F48500;
-@SB70: #FFA000;
-@SB80: #FFBF5B;
-@SB90: #FFDEB0;
-@SB95: #FFF0D9;
-@SB98: #FFF8EE;
+@SB10: #472800;
+@SB20: #7A4C07;
+@SB30: #93610D;
+@SB40: #B77F14;
+@SB50: #DB9F1D;
+@SB60: #FFC229;
+@SB70: #FFD55E;
+@SB80: #FFE17E;
+@SB90: #FFEEA9;
+@SB95: #FFF7D4;
+@SB98: #FFFCEB;
 
 /**
 * 辅助C Secondary C
 * 表达错误、失败
 **/
-@SC10: #550005;
-@SC20: #AF0001;
-@SC30: #EC0011;
-@SC40: #FF0033;
-@SC50: #FF2755;
-@SC60: #FF5B78;
-@SC70: #FF879A;
-@SC80: #FFAFBB;
-@SC90: #FFD7DE;
-@SC95: #FFEBEE;
-@SC98: #FFF6F7;
+@SC10: #4D000B;
+@SC20: #76070F;
+@SC30: #8F0C0C;
+@SC40: #B11E13;
+@SC50: #D4361B;
+@SC60: #F75426;
+@SC70: #FA895B;
+@SC80: #FCAB7C;
+@SC90: #FECDA8;
+@SC95: #FEE9D3;
+@SC98: #FFF8F0;
 
 /**
 * 背景色 Background
 * 主要用于背景色
 **/
 @BG0: #121212;
-@BG10: #2A2A2A;
-@BG20: #414141;
-@BG30: #595959;
-@BG40: #717171;
-@BG50: #88888B;
-@BG60: #A0A0A0;
-@BG70: #B7B7B7;
-@BG80: #D0D0D0;
-@BG90: #E7E8E8;
-@BG95: #F3F3F3;
-@BG97: #F8F8F8;
+@BG10: #0F1524;
+@BG20: #1F2B47;
+@BG30: #314168;
+@BG40: #455987;
+@BG50: #5C71A3;
+@BG60: #7A8DB8;
+@BG70: #9CA9C9;
+@BG80: #BDC6DB;
+@BG90: #E7EBF3;
+@BG95: #F5F6FA;
+@BG97: #FBFCFE;
 @BG100: #FFFFFF;
 
-/**
-* 品牌背景 Brand Background
-* 品牌色衍生灰调背景
-**/
-@BBG10: #061B3B;
-@BBG15: #112645;
-@BBG20: #203555;
-@BBG30: #3B4F6E;
-@BBG40: #536788;
-@BBG50: #6C82A3;
-@BBG60: #869BBB;
-@BBG70: #A0B5D5;
-@BBG80: #BACDEE;
-@BBG90: #D7E7FE;
-@BBG95: #EBF3FF;
-@BBG97: #F3F8FF;
-@BBG98: #F7F8FF;
 
 /***
 * 黑白
@@ -147,10 +130,7 @@
 /***
 * 投影
 ***/
-@shadow-option: 0 1px 1px rgba(0, 0, 0, 0.12);
-@shadow-card: 0 1px 3px rgba(0, 0, 0, 0.1), 0 2px 1px rgba(0, 0, 0, 0.06), 0 1px 1px rgba(0, 0, 0, 0.08);
-@shadow-actionsheet: 0 3px 5px rgba(0, 0, 0, 0.1), 0 1px 18px rgba(0, 0, 0, 0.06), 0 6px 10px rgba(0, 0, 0, 0.08);
-@shadow-notification: 0 11px 15px rgba(0, 0, 0, 0.1), 0 9px 46px rgba(0, 0, 0, 0.08), 0 24px 38px rgba(0, 0, 0, 0.04);
+@shadow-L:0px 11px 15px rgba(0, 26, 51, 0.1), 0px 9px 46px rgba(0, 26, 51, 0.05), 0px 24px 38px rgba(0, 26, 51, 0.03);
 
 // 用css module的能力，将less变量输出给js，供js文件中使用
 :export {
@@ -235,25 +215,9 @@
   BG95: @BG95;
   BG97: @BG97;
   BG100: @BG100;
-  BBG10: @BBG10;
-  BBG15: @BBG15;
-  BBG20: @BBG20;
-  BBG30: @BBG30;
-  BBG40: @BBG40;
-  BBG50: @BBG50;
-  BBG60: @BBG60;
-  BBG70: @BBG70;
-  BBG80: @BBG80;
-  BBG90: @BBG90;
-  BBG95: @BBG95;
-  BBG97: @BBG97;
-  BBG98: @BBG98;
   WHITE: @white;
   BLACK: @black;
   IMAGE_HOLDER: @imageholder;
   MATE: @mate;
-  SHADOW_OPTION: @shadow-option;
-  SHADOW_CARD: @shadow-card;
-  SHADOW_ACTIONSHEET: @shadow-actionsheet;
-  SHADOW_NOTIFICATION: @shadow-notification;
+  SHADOW_L: @shadow-L;
 }

package/es/style/themes/default/themeColor.module.less.d.ts

@@ -12,19 +12,6 @@ interface CssExports {
   'B90': string;
   'B95': string;
   'B98': string;
-  'BBG10': string;
-  'BBG15': string;
-  'BBG20': string;
-  'BBG30': string;
-  'BBG40': string;
-  'BBG50': string;
-  'BBG60': string;
-  'BBG70': string;
-  'BBG80': string;
-  'BBG90': string;
-  'BBG95': string;
-  'BBG97': string;
-  'BBG98': string;
   'BG0': string;
   'BG10': string;
   'BG100': string;
@@ -98,10 +85,7 @@ interface CssExports {
   'SC90': string;
   'SC95': string;
   'SC98': string;
-  'SHADOW_ACTIONSHEET': string;
-  'SHADOW_CARD': string;
-  'SHADOW_NOTIFICATION': string;
-  'SHADOW_OPTION': string;
+  'SHADOW_L': string;
   'WHITE': string;
 }
 export const cssExports: CssExports;

package/lib/Avatar/index.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { AvatarProps as antdAvatarProps } from 'antd/es/avatar/avatar';
+import Group from 'antd/es/avatar/group';
+export type { GroupProps } from 'antd/es/avatar/group';
+declare type TSize = 'large' | 'middle' | 'small' | 'mini' | number;
+interface IAvatarProps extends Omit<antdAvatarProps, 'size'> {
+    size?: TSize;
+}
+export type { IAvatarProps };
+interface ICompoundedComponent extends React.ForwardRefExoticComponent<IAvatarProps & React.RefAttributes<HTMLElement>> {
+    Group: typeof Group;
+}
+declare const Avatar: ICompoundedComponent;
+export { Group };
+export default Avatar;

package/lib/Avatar/index.js

@@ -0,0 +1,57 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Group", {
+  enumerable: true,
+  get: function get() {
+    return _group.default;
+  }
+});
+exports.default = void 0;
+
+var React = _interopRequireWildcard(require("react"));
+
+var _avatar = _interopRequireDefault(require("antd/es/avatar/avatar"));
+
+var _group = _interopRequireDefault(require("antd/es/avatar/group"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _excluded = ["size"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+var Avatar = function A(props) {
+  var _props$size = props.size,
+      size = _props$size === void 0 ? 'middle' : _props$size,
+      restProps = _objectWithoutProperties(props, _excluded);
+
+  var getSizeClass = function getSizeClass(avatarSize) {
+    if (['large', 'small', 'mini'].includes("".concat(avatarSize))) {
+      return (0, _classnames.default)('ald-avatar', "ald-avatar-".concat(avatarSize));
+    }
+
+    return (0, _classnames.default)('ald-avatar', 'ald-avatar-middle');
+  };
+
+  return /*#__PURE__*/React.createElement(_avatar.default, Object.assign({
+    size: typeof size === 'number' ? size : undefined,
+    className: getSizeClass(size)
+  }, restProps));
+};
+
+Avatar.Group = _group.default;
+var _default = Avatar;
+exports.default = _default;

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

@@ -0,0 +1,2 @@
+import '../../style';
+import './index.less';

package/lib/Avatar/style/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+require("../../style");
+
+require("./index.less");

package/lib/Avatar/style/index.less

@@ -0,0 +1,34 @@
+@import '../../style/index.less';
+
+.ald-avatar.ald-avatar {
+  color: @ND0;
+  background-color: @B60;
+
+  &-large {
+    width: 40px;
+    height: 40px;
+    font-size: 20px;
+    line-height: 40px;
+  }
+
+  &-middle {
+    width: 32px;
+    height: 32px;
+    font-size: 16px;
+    line-height: 32px;
+  }
+
+  &-small {
+    width: 28px;
+    height: 28px;
+    font-size: 14px;
+    line-height: 28px;
+  }
+
+  &-mini {
+    width: 24px;
+    height: 24px;
+    font-size: 12px;
+    line-height: 24px;
+  }
+}

package/lib/Breadcrumb/index.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { BreadcrumbItemProps, BreadcrumbProps } from 'antd';
+export type { BreadcrumbItemProps, BreadcrumbProps };
+declare const Breadcrumb: {
+    (props: BreadcrumbProps): JSX.Element;
+    Item(props: BreadcrumbItemProps): JSX.Element;
+};
+export default Breadcrumb;

package/lib/Breadcrumb/index.js

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/breadcrumb/style");
+
+var _breadcrumb = _interopRequireDefault(require("antd/es/breadcrumb"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _excluded = ["className", "separator"],
+    _excluded2 = ["className"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+var BreadcrumbItem = _breadcrumb.default.Item;
+
+var Breadcrumb = function Breadcrumb(props) {
+  var className = props.className,
+      separator = props.separator,
+      restProps = _objectWithoutProperties(props, _excluded);
+
+  return /*#__PURE__*/_react.default.createElement(_breadcrumb.default, Object.assign({}, restProps, {
+    separator: separator || /*#__PURE__*/_react.default.createElement("span", {
+      className: "default-separator"
+    }),
+    className: (0, _classnames.default)('ald-breadcrumb', className)
+  }));
+};
+
+Breadcrumb.Item = function (props) {
+  var className = props.className,
+      restProps = _objectWithoutProperties(props, _excluded2);
+
+  return /*#__PURE__*/_react.default.createElement(BreadcrumbItem, Object.assign({}, restProps, {
+    className: (0, _classnames.default)('ald-breadcrumb-item', className)
+  }));
+};
+
+var _default = Breadcrumb;
+exports.default = _default;

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

@@ -0,0 +1,2 @@
+import '../../style';
+import './index.less';

package/lib/Breadcrumb/style/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+require("../../style");
+
+require("./index.less");

package/lib/Breadcrumb/style/index.less

@@ -0,0 +1,28 @@
+@import '../../style/index.less';
+
+.ald-breadcrumb {
+  color: @NL50;
+  font-weight: 600;
+  font-size: 24px;
+  line-height: 32px;
+
+  .default-separator {
+    display: inline-block;
+    width: 10px;
+    height: 20px;
+    margin: 0 7px;
+    background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAxMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjQ0NzE5IDAuMTA1NzkyQzkuOTQxMTcgMC4zNTI3ODEgMTAuMTQxNCAwLjk1MzQ1NCA5Ljg5NDQgMS40NDc0M0wxLjg5NDQgMTkuNDQ3NEMxLjY0NzQxIDE5Ljk0MTQgMS4wNDY3NCAyMC4xNDE2IDAuNTUyNzYxIDE5Ljg5NDZDMC4wNTg3ODI5IDE5LjY0NzcgLTAuMTQxNDQyIDE5LjA0NyAwLjEwNTU0OCAxOC41NTNMOC4xMDU1NSAwLjU1MzAwNkM4LjM1MjU0IDAuMDU5MDI3IDguOTUzMjEgLTAuMTQxMTk3IDkuNDQ3MTkgMC4xMDU3OTJaIiBmaWxsPSIjMDAxQTMzIiBmaWxsLW9wYWNpdHk9IjAuNSIvPgo8L3N2Zz4=');
+  }
+
+  .ant-breadcrumb-separator {
+    margin: 0;
+  }
+
+  & > span {
+    color: @NL50;
+
+    &:last-child {
+      color: @NL0;
+    }
+  }
+}

package/lib/Button/index.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
 import type { ButtonProps as AntdButtonProps } from 'antd/lib/button';
-export declare type ButtonType = 'primary' | 'secondary' | 'danger' | 'text' | 'link';
-export declare type Size = 'small' | 'default' | 'large';
-export interface IButtonProps extends Omit<AntdButtonProps, 'type' | 'size' | 'danger' | 'shape' | 'icon' | 'href' | 'target' | 'onClick' | 'loading'> {
+export declare type ButtonType = 'primary' | 'secondary' | 'dangerous' | 'text' | 'link';
+export declare type Size = 'mini' | 'small' | 'default' | 'large';
+export interface IButtonProps extends Omit<AntdButtonProps, 'type' | 'size' | 'dangerous' | 'shape' | 'icon' | 'href' | 'target' | 'onClick' | 'loading'> {
     /**
      * @description 类型
-     * @type 'primary' | 'secondary' | 'danger' | 'text' | 'link'
+     * @type 'primary' | 'secondary' | 'dangerous' | 'text' | 'link'
      * @default primary
      */
     type?: ButtonType;