@aloudata/aloudata-design 0.4.0-beta.1 → 0.4.0-beta.11

package/lib/Avatar/index.d.ts

@@ -1,15 +1,3 @@
-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;
-}
+import Avatar, { IAvatarProps } from './component/Avatar';
 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

@@ -1,57 +1,16 @@
 "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"];
+var _Avatar = _interopRequireDefault(require("./component/Avatar"));
 
 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;
+_Avatar.default.Group = _group.default;
+var _default = _Avatar.default;
 exports.default = _default;

package/lib/Avatar/style/index.less

@@ -2,7 +2,7 @@
 
 .ald-avatar.ald-avatar {
   color: @ND0;
-  background-color: @B60;
+  background-color: @B40;
 
   &-large {
     width: 40px;

package/lib/Breadcrumb/index.d.ts

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

package/lib/Breadcrumb/index.js

@@ -22,29 +22,38 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 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", {
+  var getSeparator = function getSeparator() {
+    if (separator === null) {
+      return separator;
+    }
+
+    return separator || /*#__PURE__*/_react.default.createElement("span", {
       className: "default-separator"
-    }),
+    });
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_breadcrumb.default, Object.assign({}, restProps, {
+    separator: getSeparator(),
     className: (0, _classnames.default)('ald-breadcrumb', className)
   }));
 };
 
-Breadcrumb.Item = function (props) {
+var BreadcrumbItem = function BreadcrumbItem(props) {
   var className = props.className,
       restProps = _objectWithoutProperties(props, _excluded2);
 
-  return /*#__PURE__*/_react.default.createElement(BreadcrumbItem, Object.assign({}, restProps, {
+  return /*#__PURE__*/_react.default.createElement(_breadcrumb.default.Item, Object.assign({}, restProps, {
     className: (0, _classnames.default)('ald-breadcrumb-item', className)
   }));
-};
+}; // eslint-disable-next-line no-underscore-dangle
+
 
+BreadcrumbItem.__ANT_BREADCRUMB_ITEM = true;
+Breadcrumb.Item = BreadcrumbItem;
 var _default = Breadcrumb;
 exports.default = _default;

package/lib/Button/index.d.ts

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

package/lib/Button/index.js

@@ -32,10 +32,9 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 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 iconPrefixCls = 'aldicon';
-var ICON_LARGE = 16;
-var ICON_MIDDLE = 14;
-var ICON_SMALL = 12;
-var ICON_MINI = 12;
+var ICON_LARGE = 24;
+var ICON_MIDDLE = 20;
+var ICON_SMALL = 16;
 
 function Button(props) {
   var prefix = 'ald-btn';
@@ -90,10 +89,6 @@ function Button(props) {
       return ICON_SMALL;
     }
 
-    if (ButtonSize === 'mini') {
-      return ICON_MINI;
-    }
-
     return ICON_MIDDLE;
   }
 

package/lib/Button/style/index.less

@@ -51,6 +51,7 @@
         background-color: @button-primary-bg-color-disable;
         border-color: @button-primary-bg-color-disable;
         cursor: default;
+        opacity: 0.5;
 
         &:hover,
         &:focus,
@@ -88,6 +89,7 @@
         background-color: @button-dangerous-bg-color-disable;
         border-color: @button-dangerous-bg-color-disable;
         cursor: default;
+        opacity: 0.5;
 
         &:hover,
         &:focus,
@@ -134,6 +136,7 @@
         background-color: @button-secondary-bg-color-disable;
         border-color: @button-secondary-border-color;
         cursor: default;
+        opacity: 0.5;
 
         &:hover,
         &:focus,
@@ -168,6 +171,7 @@
         color: @button-text-color-disable;
         background-color: @button-text-bg-color-disable;
         cursor: default;
+        opacity: 0.5;
 
         &:hover,
         &:focus,
@@ -208,6 +212,7 @@
         background-color: @button-link-bg-color-disable;
         border-color: @button-link-bg-color-disable;
         cursor: default;
+        opacity: 0.5;
 
         &:hover,
         &:focus,
@@ -231,6 +236,7 @@
       height: @button-height-large;
       padding: @button-border-padding-large;
       font-size: @button-text-size-large;
+      line-height: 24px;
       border-radius: @button-border-radius-large;
 
       &.ant-btn-icon-only {

package/lib/Button/style/variables.less

@@ -7,19 +7,19 @@
 @button-height-large: 36px;
 @button-text-size-large: 16px;
 @button-border-radius-large: 8px;
-@button-border-padding-large: 0 11px;
+@button-border-padding-large: 6px 14px;
 @button-left-icon-margin-right-large: 8px;
 
 @button-height-middle: 32px;
 @button-text-size-middle: 14px;
-@button-border-radius-middle: 6px;
-@button-border-padding-middle: 0 11px;
+@button-border-radius-middle: 8px;
+@button-border-padding-middle: 6px 12px;
 @button-left-icon-margin-right-middle: 8px;
 
 @button-height-small: 28px;
 @button-text-size-small: 12px;
-@button-border-radius-small: 4px;
-@button-border-padding-small: 0 7px;
+@button-border-radius-small: 6px;
+@button-border-padding-small: 6px 10px;
 @button-left-icon-margin-right-small: 4px;
 
 @button-height-mini: 24px;
@@ -29,39 +29,39 @@
 @button-left-icon-margin-right-mini: 4px;
 
 /****  type控制  ****/
-@button-primary-bg-color: @B60;
-@button-primary-bg-color-active: @B50;
-@button-primary-bg-color-disable: @B90;
+@button-primary-bg-color: @B40;
+@button-primary-bg-color-active: @B30;
+@button-primary-bg-color-disable: @B40;
 @button-primary-color: @ND0;
 @button-primary-color-active: @ND0;
 @button-primary-color-disable: @ND0;
 
-@button-dangerous-bg-color: @SC60;
-@button-dangerous-bg-color-active: @SC50;
-@button-dangerous-bg-color-disable: @SC90;
+@button-dangerous-bg-color: @SC40;
+@button-dangerous-bg-color-active: @SC30;
+@button-dangerous-bg-color-disable: @SC40;
 @button-dangerous-color: @ND0;
 @button-dangerous-color-active: @ND0;
 @button-dangerous-color-disable: @ND0;
 
-@button-secondary-bg-color: @BG97;
-@button-secondary-bg-color-active: @BG95;
-@button-secondary-bg-color-disable: @BG97;
-@button-secondary-color: @NL30;
-@button-secondary-color-active: @B60;
-@button-secondary-color-disable: @NL80;
-@button-secondary-border-color: @NL90;
-@button-secondary-border-color-active: @B60;
+@button-secondary-bg-color: @BG100;
+@button-secondary-bg-color-active: @BG90;
+@button-secondary-bg-color-disable: @BG100;
+@button-secondary-color: @NL20;
+@button-secondary-color-active: @NL20;
+@button-secondary-color-disable: @NL20;
+@button-secondary-border-color: @BG60;
+@button-secondary-border-color-active: @BG60;
 
 @button-text-bg-color: transparent;
-@button-text-bg-color-active: @NL97;
+@button-text-bg-color-active: @NL90;
 @button-text-bg-color-disable: transparent;
-@button-text-color: @NL30;
-@button-text-color-active: @B60;
-@button-text-color-disable: @NL80;
+@button-text-color: @NL20;
+@button-text-color-active: @NL20;
+@button-text-color-disable: @NL20;
 
 @button-link-bg-color: transparent;
 @button-link-bg-color-active: transparent;
 @button-link-bg-color-disable: transparent;
-@button-link-color: @B60;
-@button-link-color-active: @B50;
-@button-link-color-disable: @B90;
+@button-link-color: @B30;
+@button-link-color-active: @B20;
+@button-link-color-disable: @B30;

package/lib/Checkbox/component/CheckboxGroup/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { ICheckboxGroupProps } from '../../type';
+declare const CheckboxGroup: (props: ICheckboxGroupProps) => JSX.Element;
+export default CheckboxGroup;

package/lib/Checkbox/component/CheckboxGroup/index.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/checkbox/style");
+
+var _checkbox = _interopRequireDefault(require("antd/es/checkbox"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _type = require("../../type");
+
+var _excluded = ["className", "direction"];
+
+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; }
+
+// "vertical" | "horizontal"
+var AntdCheckboxGroup = _checkbox.default.Group;
+
+var CheckboxGroup = function CheckboxGroup(props) {
+  var className = props.className,
+      direction = props.direction,
+      otherProps = _objectWithoutProperties(props, _excluded);
+
+  return /*#__PURE__*/_react.default.createElement(AntdCheckboxGroup, Object.assign({
+    className: (0, _classnames.default)('ald-checkbox', className, {
+      'ald-checkout-group-vertical': direction === _type.EDirection.VERTICAL
+    })
+  }, otherProps));
+};
+
+var _default = CheckboxGroup;
+exports.default = _default;

package/lib/Checkbox/index.d.ts

@@ -1,11 +1,10 @@
 /// <reference types="react" />
-import { CheckboxProps } from 'antd';
-import { CheckboxGroupProps } from 'antd/lib/checkbox';
+import { ICheckboxGroupProps, ICheckboxProps } from './type';
 export type { CheckboxValueType, CheckboxOptionType } from 'antd/es/checkbox/Group';
 export type { CheckboxChangeEvent } from 'antd/es/checkbox/Checkbox';
-declare function Checkbox(props: CheckboxProps): JSX.Element;
+declare function Checkbox(props: ICheckboxProps): JSX.Element;
 declare namespace Checkbox {
-    var Group: (props: CheckboxGroupProps) => JSX.Element;
+    var Group: (props: ICheckboxGroupProps) => JSX.Element;
 }
-export type { CheckboxProps };
+export type { ICheckboxProps, ICheckboxGroupProps };
 export default Checkbox;

package/lib/Checkbox/index.js

@@ -13,8 +13,9 @@ var _react = _interopRequireDefault(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-var _excluded = ["className"],
-    _excluded2 = ["className"];
+var _CheckboxGroup = _interopRequireDefault(require("./component/CheckboxGroup"));
+
+var _excluded = ["className"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -22,8 +23,6 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 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 CheckboxGroup = _checkbox.default.Group;
-
 function Checkbox(props) {
   var className = props.className,
       otherProps = _objectWithoutProperties(props, _excluded);
@@ -33,14 +32,6 @@ function Checkbox(props) {
   }, otherProps));
 }
 
-Checkbox.Group = function (props) {
-  var className = props.className,
-      otherProps = _objectWithoutProperties(props, _excluded2);
-
-  return /*#__PURE__*/_react.default.createElement(CheckboxGroup, Object.assign({
-    className: (0, _classnames.default)('ald-checkbox', className)
-  }, otherProps));
-};
-
+Checkbox.Group = _CheckboxGroup.default;
 var _default = Checkbox;
 exports.default = _default;

package/lib/Checkbox/style/index.less

@@ -25,14 +25,14 @@
   .ant-checkbox-checked {
     &::after,
     .ant-checkbox-inner {
-      background-color: @B60;
-      border-color: @B60;
+      background-color: @B95;
+      border-color: @B40;
       border-radius: 4px;
     }
 
     .ant-checkbox-inner {
-      background-color: @B60;
-      border-color: @B60;
+      background-color: @B95;
+      border-color: @B40;
 
       &::after {
         top: 3px;
@@ -40,7 +40,7 @@
         z-index: 10;
         width: 10px;
         height: 8px;
-        background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9IndoaXRlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTkuNjc1NzMgMC4yNjI4NTJDMTAuMDgyOCAwLjYzNjA0NCAxMC4xMTA0IDEuMjY4NjEgOS43MzcxNiAxLjY3NTczTDQuMjM3MTYgNy42NzU3M0M0LjA0Nzc1IDcuODgyMzYgMy43ODAzMSA4LjAwMDAxIDMuNTAwMDEgOC4wMDAwMUMzLjIxOTcgOC4wMDAwMSAyLjk1MjI2IDcuODgyMzYgMi43NjI4NSA3LjY3NTczTDAuMjYyODUyIDQuOTQ4NDZDLTAuMTEwMzQxIDQuNTQxMzQgLTAuMDgyODM3OCAzLjkwODc3IDAuMzI0MjgxIDMuNTM1NThDMC43MzE0IDMuMTYyMzkgMS4zNjM5NyAzLjE4OTg5IDEuNzM3MTYgMy41OTcwMUwzLjUwMDAxIDUuNTIwMTFMOC4yNjI4NSAwLjMyNDI4MUM4LjYzNjA0IC0wLjA4MjgzNzggOS4yNjg2MSAtMC4xMTAzNDEgOS42NzU3MyAwLjI2Mjg1MloiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=')
+        background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNOS42NzU3MyAwLjI2Mjg1MkMxMC4wODI4IDAuNjM2MDQ0IDEwLjExMDQgMS4yNjg2MSA5LjczNzE2IDEuNjc1NzNMNC4yMzcxNiA3LjY3NTczQzQuMDQ3NzUgNy44ODIzNiAzLjc4MDMxIDguMDAwMDEgMy41MDAwMSA4LjAwMDAxQzMuMjE5NyA4LjAwMDAxIDIuOTUyMjYgNy44ODIzNiAyLjc2Mjg1IDcuNjc1NzNMMC4yNjI4NTIgNC45NDg0NkMtMC4xMTAzNDEgNC41NDEzNCAtMC4wODI4Mzc4IDMuOTA4NzcgMC4zMjQyODEgMy41MzU1OEMwLjczMTQgMy4xNjIzOSAxLjM2Mzk3IDMuMTg5ODkgMS43MzcxNiAzLjU5NzAxTDMuNTAwMDEgNS41MjAxMUw4LjI2Mjg1IDAuMzI0MjgxQzguNjM2MDQgLTAuMDgyODM3OCA5LjI2ODYxIC0wLjExMDM0MSA5LjY3NTczIDAuMjYyODUyWiIgZmlsbD0iIzE1NzBFRiIvPgo8L3N2Zz4K')
           no-repeat;
         border-width: 0;
         transform: none;
@@ -50,15 +50,17 @@
 
   .ant-checkbox-disabled {
     cursor: default;
+    opacity: 0.5;
 
     & + span {
       color: @NL0;
       cursor: default;
+      opacity: 0.5;
     }
 
     .ant-checkbox-inner {
-      background-color: @NL90;
-      border-color: @NL90;
+      background-color: @B95;
+      border-color: @B40;
 
       &::after {
         top: 3px;
@@ -66,7 +68,7 @@
         z-index: 10;
         width: 10px;
         height: 8px;
-        background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNOS42NzU3MyAwLjI2Mjg1MkMxMC4wODI4IDAuNjM2MDQ0IDEwLjExMDQgMS4yNjg2MSA5LjczNzE2IDEuNjc1NzNMNC4yMzcxNiA3LjY3NTczQzQuMDQ3NzUgNy44ODIzNiAzLjc4MDMxIDguMDAwMDEgMy41MDAwMSA4LjAwMDAxQzMuMjE5NyA4LjAwMDAxIDIuOTUyMjYgNy44ODIzNiAyLjc2Mjg1IDcuNjc1NzNMMC4yNjI4NTIgNC45NDg0NkMtMC4xMTAzNDEgNC41NDEzNCAtMC4wODI4Mzc4IDMuOTA4NzcgMC4zMjQyODEgMy41MzU1OEMwLjczMTQgMy4xNjIzOSAxLjM2Mzk3IDMuMTg5ODkgMS43MzcxNiAzLjU5NzAxTDMuNTAwMDEgNS41MjAxMUw4LjI2Mjg1IDAuMzI0MjgxQzguNjM2MDQgLTAuMDgyODM3OCA5LjI2ODYxIC0wLjExMDM0MSA5LjY3NTczIDAuMjYyODUyWiIgZmlsbD0iIzAwMUEzMyIgZmlsbC1vcGFjaXR5PSIwLjIiLz4KPC9zdmc+Cg==');
+        background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNOS42NzU3MyAwLjI2Mjg1MkMxMC4wODI4IDAuNjM2MDQ0IDEwLjExMDQgMS4yNjg2MSA5LjczNzE2IDEuNjc1NzNMNC4yMzcxNiA3LjY3NTczQzQuMDQ3NzUgNy44ODIzNiAzLjc4MDMxIDguMDAwMDEgMy41MDAwMSA4LjAwMDAxQzMuMjE5NyA4LjAwMDAxIDIuOTUyMjYgNy44ODIzNiAyLjc2Mjg1IDcuNjc1NzNMMC4yNjI4NTIgNC45NDg0NkMtMC4xMTAzNDEgNC41NDEzNCAtMC4wODI4Mzc4IDMuOTA4NzcgMC4zMjQyODEgMy41MzU1OEMwLjczMTQgMy4xNjIzOSAxLjM2Mzk3IDMuMTg5ODkgMS43MzcxNiAzLjU5NzAxTDMuNTAwMDEgNS41MjAxMUw4LjI2Mjg1IDAuMzI0MjgxQzguNjM2MDQgLTAuMDgyODM3OCA5LjI2ODYxIC0wLjExMDM0MSA5LjY3NTczIDAuMjYyODUyWiIgZmlsbD0iIzE1NzBFRiIvPgo8L3N2Zz4K');
         border-width: 0;
         transform: none;
       }
@@ -75,12 +77,13 @@
 
   .ant-checkbox-indeterminate {
     .ant-checkbox-inner {
-      background-color: @B60;
-      border-color: @B60;
+      background-color: @B95;
+      border-color: @B40;
 
       &::after {
         width: 10px;
         height: 2px;
+        background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iMiIgdmlld0JveD0iMCAwIDEwIDIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxyZWN0IHdpZHRoPSIxMCIgaGVpZ2h0PSIyIiByeD0iMSIgZmlsbD0iIzE1NzBFRiIvPgo8L3N2Zz4K');
         background-color: @ND0;
         border-radius: 2px;
       }
@@ -88,26 +91,43 @@
   }
 
   .ant-checkbox + span {
+    display: flex;
+    align-items: center;
     padding-right: 10px;
     padding-left: 10px;
   }
-}
 
-.ant-checkbox-group.ald-checkbox,
-.ant-checkbox-wrapper.ald-checkbox {
   &:hover .ant-checkbox-inner {
-    border-color: @B60;
+    border-color: @B40;
+  }
+
+  .ant-checkbox-disabled .ant-checkbox-inner:hover {
+    box-shadow: unset;
+  }
+
+  .ant-checkbox:hover .ant-checkbox-inner {
+    border-color: @B40;
+    box-shadow: @shadow-primary;
   }
+}
 
+.ant-checkbox-group.ald-checkbox,
+.ant-checkbox-wrapper.ald-checkbox {
   .ant-checkbox-input:focus + .ant-checkbox-inner {
-    border-color: @NL60;
+    border-color: @B40;
   }
 
   .ant-checkbox:hover .ant-checkbox-inner {
-    border-color: @B60;
+    border-color: @B40;
   }
 }
 
 .ald-checkbox.ant-checkbox-wrapper-disabled {
   cursor: default;
 }
+
+.ald-checkout-group-vertical {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}

package/lib/Checkbox/type.d.ts

@@ -0,0 +1,94 @@
+import { CheckboxChangeEvent, CheckboxGroupProps, CheckboxProps } from 'antd/lib/checkbox';
+import { CheckboxOptionType, CheckboxValueType } from 'antd/lib/checkbox/Group';
+export declare enum EDirection {
+    VERTICAL = "vertical",
+    HORIZONTAL = "horizontal"
+}
+export interface ICheckboxProps extends CheckboxProps {
+    /**
+     * @description 自动获取焦点
+     * @type boolean
+     * @default false
+     */
+    autoFocus?: boolean;
+    /**
+     * @description 指定当前是否选中
+     * @type boolean
+     * @default false
+     */
+    checked?: boolean;
+    /**
+     * @description 初始是否选中
+     * @type boolean
+     * @default false
+     */
+    defaultChecked?: boolean;
+    /**
+     * @description 失效状态
+     * @type boolean
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * @description 设置 indeterminate 状态，只负责样式控制
+     * @type boolean
+     * @default false
+     */
+    indeterminate?: false;
+    /**
+     * @description 变化时的回调函数
+     * @type  function(e:Event)
+     * @default -
+     */
+    onChange?: (e: CheckboxChangeEvent) => void;
+}
+export interface ICheckboxGroupProps extends CheckboxGroupProps {
+    /**
+     * @description 默认选中的选项
+     * @type string[]
+     * @default []
+     */
+    defaultValue?: Array<CheckboxValueType>;
+    /**
+     * @description 整组失效
+     * @type boolean
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * @description CheckboxGroup 下所有 input[type="checkbox"] 的 name 属性
+     * @type string
+     * @default -
+     */
+    name?: string;
+    /**
+     * @description 指定可选项
+     * @type string[] | number[] | Option[]
+     * @default []
+     */
+    options?: Array<CheckboxOptionType | string | number>;
+    /**
+     * @description 指定选中的选项
+     * @type string[]
+     * @default []
+     */
+    value?: Array<CheckboxValueType>;
+    /**
+     * @description  变化时毁掉函数
+     * @type function(checkedValue)
+     * @default -
+     */
+    onChange?: (checkedValue: Array<CheckboxValueType>) => void;
+    /**
+     * @description 复选按钮组的方向
+     * @type 'vertical' | 'horizontal'
+     * @default -
+     */
+    direction: EDirection.VERTICAL;
+    /**
+     * @description className
+     * @type string
+     * @default -
+     */
+    className?: string;
+}

package/lib/Checkbox/type.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EDirection = void 0;
+var EDirection;
+exports.EDirection = EDirection;
+
+(function (EDirection) {
+  EDirection["VERTICAL"] = "vertical";
+  EDirection["HORIZONTAL"] = "horizontal";
+})(EDirection || (exports.EDirection = EDirection = {}));