@aloudata/aloudata-design 0.2.7 → 0.3.1

package/es/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/es/Avatar/index.js

@@ -0,0 +1,33 @@
+var _excluded = ["size"];
+
+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; }
+
+import * as React from 'react';
+import InternalAvatar from 'antd/es/avatar/avatar';
+import Group from 'antd/es/avatar/group';
+import classNames from 'classnames';
+
+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 classNames('ald-avatar', "ald-avatar-".concat(avatarSize));
+    }
+
+    return classNames('ald-avatar', 'ald-avatar-middle');
+  };
+
+  return /*#__PURE__*/React.createElement(InternalAvatar, Object.assign({
+    size: typeof size === 'number' ? size : undefined,
+    className: getSizeClass(size)
+  }, restProps));
+};
+
+Avatar.Group = Group;
+export { Group };
+export default Avatar;

package/es/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/es/Breadcrumb/index.d.ts

@@ -0,0 +1,7 @@
+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/es/Breadcrumb/index.js

@@ -0,0 +1,36 @@
+import "antd/es/breadcrumb/style";
+import _Breadcrumb from "antd/es/breadcrumb";
+var _excluded = ["className", "separator"],
+    _excluded2 = ["className"];
+
+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; }
+
+import React from 'react';
+import classNames from 'classnames';
+var BreadcrumbItem = _Breadcrumb.Item;
+
+var Breadcrumb = function Breadcrumb(props) {
+  var className = props.className,
+      separator = props.separator,
+      restProps = _objectWithoutProperties(props, _excluded);
+
+  return /*#__PURE__*/React.createElement(_Breadcrumb, Object.assign({}, restProps, {
+    separator: separator || /*#__PURE__*/React.createElement("span", {
+      className: "default-separator"
+    }),
+    className: classNames('ald-breadcrumb', className)
+  }));
+};
+
+Breadcrumb.Item = function (props) {
+  var className = props.className,
+      restProps = _objectWithoutProperties(props, _excluded2);
+
+  return /*#__PURE__*/React.createElement(BreadcrumbItem, Object.assign({}, restProps, {
+    className: classNames('ald-breadcrumb-item', className)
+  }));
+};
+
+export default Breadcrumb;

package/es/Breadcrumb/style/index.less

@@ -0,0 +1,36 @@
+@import '../../style/index.less';
+
+.ald-breadcrumb.ant-breadcrumb li {
+  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;
+  }
+
+  a {
+    color: @NL50;
+
+    &:hover {
+      color: @NL0;
+    }
+  }
+
+  &:last-child {
+    color: @NL0;
+
+    a {
+      color: @NL0;
+    }
+  }
+}

package/es/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;

package/es/Button/index.js

@@ -1,6 +1,6 @@
 import "antd/es/button/style";
 import _Button from "antd/es/button";
-var _excluded = ["type", "size", "shape", "icon", "className"];
+var _excluded = ["type", "size", "shape", "loading", "disabled", "icon", "className"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -14,13 +14,15 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 import React from 'react';
 import classNames from 'classnames';
-import usePrefixCls from '../_utils/hooks/usePrefixCls';
-var iconPrefixCls = 'anticon';
-var ICON_LARGE = 20;
-var ICON_SMALL = 16;
+import LoadingIcon from '../Icon/icons/Loading';
+var iconPrefixCls = 'aldicon';
+var ICON_LARGE = 16;
+var ICON_MIDDLE = 14;
+var ICON_SMALL = 12;
+var ICON_MINI = 12;
 
 function Button(props) {
-  var prefix = usePrefixCls('btn');
+  var prefix = 'ald-btn';
 
   var _props$type = props.type,
       type = _props$type === void 0 ? 'secondary' : _props$type,
@@ -28,16 +30,19 @@ function Button(props) {
       size = _props$size === void 0 ? 'default' : _props$size,
       _props$shape = props.shape,
       shape = _props$shape === void 0 ? 'default' : _props$shape,
+      _props$loading = props.loading,
+      loading = _props$loading === void 0 ? false : _props$loading,
+      disabled = props.disabled,
       icon = props.icon,
       className = props.className,
       rest = _objectWithoutProperties(props, _excluded);
 
   function getButtonType(buttonType) {
-    if (!['primary', 'secondary', 'danger', 'text', 'link'].includes(buttonType)) {
+    if (!['primary', 'secondary', 'dangerous', 'text', 'link'].includes(buttonType)) {
       return 'default';
     }
 
-    if (buttonType === 'danger') {
+    if (buttonType === 'dangerous') {
       return 'primary';
     }
 
@@ -49,24 +54,31 @@ function Button(props) {
   }
 
   function getDangerStatus(buttonType) {
-    if (buttonType === 'danger') {
+    if (buttonType === 'dangerous') {
       return true;
     }
 
     return false;
   }
 
-  function getButtonSize(ButtonSize) {
-    switch (ButtonSize) {
-      case 'small':
-        return 'small';
+  function getButtonSizeClass(ButtonSize) {
+    return ButtonSize === 'default' || undefined ? "".concat(prefix, "-middle") : "".concat(prefix, "-").concat(ButtonSize);
+  }
 
-      case 'large':
-        return 'large';
+  function getIconSize(ButtonSize) {
+    if (ButtonSize === 'large') {
+      return ICON_LARGE;
+    }
 
-      default:
-        return 'middle';
+    if (ButtonSize === 'small') {
+      return ICON_SMALL;
     }
+
+    if (ButtonSize === 'mini') {
+      return ICON_MINI;
+    }
+
+    return ICON_MIDDLE;
   }
 
   function getShape(ButtonShape) {
@@ -81,24 +93,32 @@ function Button(props) {
     if (iconNode) {
       var p = _objectSpread({
         className: '',
-        size: ICON_LARGE
-      }, iconNode.props); // eslint-disable-next-line
+        size: ICON_LARGE,
+        fill: 'currentColor'
+      }, iconNode.props);
 
-
-      p.className = classNames("".concat(iconPrefixCls, "-icon-left"), p.className); // eslint-disable-next-line
-
-      p.size = size === 'large' ? ICON_LARGE : ICON_SMALL;
+      p.className = classNames("".concat(iconPrefixCls, "-icon-left"), p.className, iconPrefixCls);
+      p.size = getIconSize(size);
       return /*#__PURE__*/React.cloneElement(iconNode, p);
     }
 
+    if (loading) {
+      return /*#__PURE__*/React.createElement(LoadingIcon, {
+        spin: true,
+        size: ICON_LARGE,
+        className: classNames("".concat(iconPrefixCls, "-icon-left"), iconPrefixCls),
+        fill: "currentColor"
+      });
+    }
+
     return /*#__PURE__*/React.createElement(React.Fragment, null);
   };
 
   return /*#__PURE__*/React.createElement(_Button, Object.assign({}, rest, {
+    disabled: loading ? true : disabled,
     icon: setIcon(icon),
     type: getButtonType(type),
-    className: classNames("".concat(prefix, "-").concat(type), className),
-    size: getButtonSize(size),
+    className: classNames(prefix, "".concat(prefix, "-").concat(type), className, getButtonSizeClass(size)),
     danger: getDangerStatus(type),
     shape: getShape(shape)
   }), props.children);