@aloudata/aloudata-design 0.2.4 → 0.2.7

package/es/Button/style/index.less

@@ -17,11 +17,11 @@
       display: inline-flex;
       align-items: center;
       justify-content: center;
-      height: @height-base;
+      height: @ald-height-base;
       padding: 0 11px;
       font-weight: 500;
       font-size: 12px;
-      line-height: @height-base;
+      line-height: @ald-height-base;
       .@{ald-iconfont-css-prefix} {
         + span {
           margin-left: 4px;
@@ -41,14 +41,14 @@
       text-shadow: @text-shadow;
       background-color: @B40;
       border-color: @B40;
-      border-radius: @border-radius-base;
+      border-radius: @ald-border-radius-base;
       box-shadow: none;
 
       &:focus {
         text-shadow: @text-shadow;
         background-color: @B40;
         border-color: @B40;
-        border-radius: @border-radius-base;
+        border-radius: @ald-border-radius-base;
         box-shadow: none;
       }
 
@@ -120,7 +120,7 @@
       text-shadow: @text-shadow;
       background-color: @BG100;
       border-color: @NL90;
-      border-radius: @border-radius-base;
+      border-radius: @ald-border-radius-base;
       box-shadow: none;
 
       &:focus {
@@ -128,7 +128,7 @@
         text-shadow: @text-shadow;
         background-color: @BG100;
         border-color: @NL90;
-        border-radius: @border-radius-base;
+        border-radius: @ald-border-radius-base;
         box-shadow: none;
       }
 
@@ -161,7 +161,7 @@
       text-shadow: @text-shadow;
       background-color: @BG100;
       border-color: @BG100;
-      border-radius: @border-radius-base;
+      border-radius: @ald-border-radius-base;
       box-shadow: none;
 
       &:focus {
@@ -169,7 +169,7 @@
         text-shadow: @text-shadow;
         background-color: @BG100;
         border-color: @BG100;
-        border-radius: @border-radius-base;
+        border-radius: @ald-border-radius-base;
         box-shadow: none;
       }
 
@@ -203,7 +203,7 @@
       text-shadow: @text-shadow;
       background-color: @BG100;
       border-color: @BG100;
-      border-radius: @border-radius-base;
+      border-radius: @ald-border-radius-base;
       box-shadow: none;
 
       &:focus {
@@ -212,7 +212,7 @@
         text-shadow: @text-shadow;
         background-color: @BG100;
         border-color: @BG100;
-        border-radius: @border-radius-base;
+        border-radius: @ald-border-radius-base;
         box-shadow: none;
       }
 
@@ -242,8 +242,8 @@
 
     &-icon-only {
       justify-content: center;
-      width: @height-base;
-      height: @height-base;
+      width: @ald-height-base;
+      height: @ald-height-base;
       padding: 0;
       vertical-align: bottom;
 
@@ -260,7 +260,7 @@
 
     &-circle {
       justify-content: center;
-      width: @height-base;
+      width: @ald-height-base;
       min-width: auto;
       padding: 0;
       border-radius: 50%;
@@ -287,12 +287,12 @@
     &-sm {
       height: 24px;
       line-height: 22px;
-      border-radius: @border-radius-sm;
+      border-radius: @ald-border-radius-sm;
 
       &.ant-btn-icon-only {
         width: 24px;
         height: 24px;
-        border-radius: @border-radius-sm;
+        border-radius: @ald-border-radius-sm;
       }
 
       &.ant-btn-circle {

package/es/Input/style/index.less

@@ -9,7 +9,7 @@
   height: 28px;
   color: @NL0;
   font-size: 12px;
-  border-radius: @border-radius-base;
+  border-radius: @ald-border-radius-base;
 
   &::placeholder {
     color: @NL50;
@@ -45,7 +45,7 @@
   &-sm {
     height: 24px;
     font-size: 12px;
-    border-radius: @border-radius-sm;
+    border-radius: @ald-border-radius-sm;
   }
 
   &-lg {
@@ -56,7 +56,7 @@
   &-affix-wrapper {
     height: 28px;
     padding: 0 12px;
-    border-radius: @border-radius-base;
+    border-radius: @ald-border-radius-base;
 
     &-hover,
     &-focused,
@@ -82,7 +82,7 @@
   &-sm {
     height: 24px;
     padding: 0 12px;
-    border-radius: @border-radius-sm;
+    border-radius: @ald-border-radius-sm;
 
     .ant-input-sm {
       height: 22px;

package/es/Menu/style/index.less

@@ -4,7 +4,7 @@
 .menu-popup {
   background: @BG100;
   border: 1px solid @NL95;
-  border-radius: @border-radius-base;
+  border-radius: @ald-border-radius-base;
   box-shadow: @shadow-actionsheet;
 }
 

package/es/Message/index.d.ts

@@ -1,4 +1,5 @@
-import { message, MessageArgsProps } from 'antd';
-import { ConfigOptions } from 'antd/lib/message';
+import { MessageArgsProps } from 'antd';
+import { ConfigOptions, MessageApi } from 'antd/lib/message';
 export type { MessageArgsProps, ConfigOptions };
-export default message;
+declare const _default: MessageApi;
+export default _default;

package/es/Navigator/components/Menu/index.js

@@ -18,7 +18,6 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 import React, { useCallback, useState, useEffect, useMemo } from 'react';
 import AntdMenu from 'antd/lib/menu';
-import Icon from '../../../Icon';
 
 function Menu(props) {
   var menuList = props.menuList,
@@ -28,36 +27,17 @@ function Menu(props) {
   var _useMemo = useMemo(function () {
     return getFlattenMenuByKey(menuList);
   }, [menuList]),
-      flattenMenuByMenuKey = _useMemo.flattenMenuByMenuKey;
+      flattenMenuByMenuKey = _useMemo.flattenMenuByMenuKey,
+      parentKeys = _useMemo.parentKeys;
 
   var _useState = useState(''),
       _useState2 = _slicedToArray(_useState, 2),
-      openKey = _useState2[0],
-      setOpenKey = _useState2[1]; // 当前展开的菜单项
+      currentSelectedKey = _useState2[0],
+      setCurrentSelectedKey = _useState2[1]; // 当前选中的菜单项
 
 
-  var _useState3 = useState(''),
-      _useState4 = _slicedToArray(_useState3, 2),
-      currentSelectedKey = _useState4[0],
-      setCurrentSelectedKey = _useState4[1]; // 当前选中的菜单项
-
-
-  var renderExpandIcon = useCallback(function (renderIconInfo) {
-    var isOpen = renderIconInfo.isOpen;
-
-    if (isOpen) {
-      return /*#__PURE__*/React.createElement(Icon, {
-        type: "arrow_drop_up",
-        size: 20,
-        className: "ald-nav-menu-icon-right"
-      });
-    }
-
-    return /*#__PURE__*/React.createElement(Icon, {
-      type: "arrow_drop_down",
-      size: 20,
-      className: "ald-nav-menu-icon-right"
-    });
+  var renderExpandIcon = useCallback(function () {
+    return null;
   }, []);
   useEffect(function () {
     setCurrentSelectedKey(selectedKey);
@@ -76,29 +56,6 @@ function Menu(props) {
       onMenuSelect(menuInfo);
     }
   }, [flattenMenuByMenuKey, onMenuSelect]);
-  /**
-   * 根据当前选中的菜单项，设置展开的菜单项
-   */
-
-  useEffect(function () {
-    var _flattenMenuByMenuKey;
-
-    setOpenKey(((_flattenMenuByMenuKey = flattenMenuByMenuKey[currentSelectedKey]) === null || _flattenMenuByMenuKey === void 0 ? void 0 : _flattenMenuByMenuKey.openKey) || '');
-  }, [currentSelectedKey, flattenMenuByMenuKey, onMenuSelect]);
-  /**
-   * 父级菜单点击
-   */
-
-  var onSupMenuClick = useCallback(function (key) {
-    if (key === openKey) {
-      return;
-    }
-
-    var FIRST_INDEX = 0;
-    var firstChildrenKey = flattenMenuByMenuKey[key].children[FIRST_INDEX].key;
-    setCurrentSelectedKey(firstChildrenKey);
-    onMenuChange(firstChildrenKey);
-  }, [flattenMenuByMenuKey, openKey, onMenuChange]);
   /**
    * 子级菜单项或者一级菜单点击
    */
@@ -116,7 +73,7 @@ function Menu(props) {
   }, /*#__PURE__*/React.createElement(AntdMenu, {
     selectedKeys: [currentSelectedKey],
     expandIcon: renderExpandIcon,
-    openKeys: [openKey],
+    openKeys: parentKeys,
     mode: "inline",
     style: {
       padding: '0 12px'
@@ -126,10 +83,7 @@ function Menu(props) {
       return /*#__PURE__*/React.createElement(AntdMenu.SubMenu, {
         key: item.key,
         icon: item.icon,
-        title: item.title,
-        onTitleClick: function onTitleClick() {
-          return onSupMenuClick(item.key);
-        }
+        title: item.title
       }, item.children.map(function (subItem) {
         return /*#__PURE__*/React.createElement(AntdMenu.Item, {
           onClick: function onClick() {
@@ -152,6 +106,7 @@ function Menu(props) {
 
 function getFlattenMenuByKey(menuList) {
   var flattenMenuByMenuKey = {};
+  var parentKeys = [];
   var menuKeys = []; // 存储所有的key 用来判断是否有重复的key
 
   var menuInvalidFlag = true; // 传入的menuList是否有效
@@ -171,6 +126,7 @@ function getFlattenMenuByKey(menuList) {
         });
         menuKeys.push(childItem.key);
       });
+      parentKeys.push(item.key);
     } else {
       flattenMenuByMenuKey[item.key] = _objectSpread(_objectSpread({}, item), {}, {
         openKey: ''
@@ -180,7 +136,8 @@ function getFlattenMenuByKey(menuList) {
   });
   return {
     menuInvalidFlag: menuInvalidFlag,
-    flattenMenuByMenuKey: flattenMenuByMenuKey
+    flattenMenuByMenuKey: flattenMenuByMenuKey,
+    parentKeys: parentKeys
   };
 }
 

package/es/Navigator/style/index.less

@@ -3,37 +3,35 @@
 
 /* stylelint-disable */
 
-@ald-prefix:ant;
+@ald-prefix: ant;
 
 .supTitle() {
-  font-family: 'PingFang SC';
-  font-style: normal;
   font-weight: 500;
   font-size: 14px;
+  font-style: normal;
   line-height: 20px;
 }
 
 .subTitle() {
-  font-family: 'PingFang SC';
-  font-style: normal;
   font-weight: 400;
   font-size: 12px;
+  font-style: normal;
   line-height: 16px;
 }
 
 .ald-nav {
-  width: 216px;
-  background-color: @BBG15;
-  height: 100%;
   display: flex;
   flex-direction: column;
+  width: 216px;
+  height: 100%;
   overflow: hidden;
+  background-color: @BBG15;
   user-select: none;
 
   &-logo {
+    width: 100%;
     height: 72px;
     padding: 24px;
-    width: 100%;
 
     &-able-click {
       cursor: pointer;
@@ -46,30 +44,30 @@
 
   &-menu {
     flex: 1;
-    overflow-y: auto;
     overflow-x: hidden;
+    overflow-y: auto;
 
     .ant-menu-sub.ant-menu-inline {
       background-color: unset;
     }
 
     .anticon.ant-menu-item-icon {
-      font-size: 20px !important;
       width: 20px !important;
       height: 20px !important;
+      font-size: 20px !important;
     }
 
     &::-webkit-scrollbar-thumb {
-      border-radius: 6px;
       background: @ND90;
-      border: 3px solid transparent;
       background-clip: padding-box;
+      border: 3px solid transparent;
+      border-radius: 6px;
     }
 
     &::-webkit-scrollbar {
-      background-color: transparent;
       width: 12px;
       height: 12px;
+      background-color: transparent;
     }
 
     .ant-menu-inline,
@@ -79,11 +77,10 @@
     }
 
     .ant-menu {
-      background: @BBG15;
       color: @ND0;
+      background: @BBG15;
 
       &.ant-menu-root {
-
         .ant-menu-item {
           margin-bottom: 16px;
           padding: 0 12px !important;
@@ -98,16 +95,16 @@
         .ant-menu-item {
           margin-top: 4px;
           margin-bottom: 0;
-          padding: 0 12px 0 44px!important;
+          padding: 0 12px 0 44px !important;
         }
       }
 
       // 只有子级菜单相关颜色操作
       .ant-menu-item-only-child {
-        color: @ND30;
         height: 32px !important;
-        line-height: 32px !important;
+        color: @ND30;
         font-size: 12px !important;
+        line-height: 32px !important;
         .subTitle();
 
         &:hover {
@@ -124,28 +121,28 @@
       }
 
       .ant-menu-item {
-        height: 40px;
         width: 100%;
+        height: 40px;
         border-radius: 8px;
         .supTitle();
 
         ::before {
-          width: 4px;
-          content: '';
-          background: transparent;
-          height: 100%;
           position: absolute;
           top: 0;
           left: -12px;
+          width: 4px;
+          height: 100%;
+          background: transparent;
           border-radius: 1px;
-          transition: all .3s;
+          transition: all 0.3s;
+          content: '';
         }
 
         &-selected {
-          background-color: @BBG20 !important;
-          color: @ND0;
           position: relative;
           overflow: unset;
+          color: @ND0;
+          background-color: @BBG20 !important;
 
           ::before {
             background: @B40;
@@ -161,13 +158,14 @@
         margin-bottom: 16px;
 
         .ant-menu-submenu-title {
-          padding: 0 12px !important;
           height: 40px;
+          padding: 0 12px !important;
           line-height: 40px;
           .supTitle();
 
           &:hover {
             color: @ND0;
+            cursor: default;
           }
         }
 
@@ -221,8 +219,8 @@
     height: 72px;
 
     &-wrap {
-      color: @ND0;
       height: 100%;
+      color: @ND0;
     }
   }
-}
+}

package/es/Notification/index.d.ts

@@ -1,3 +1,4 @@
-import { notification } from 'antd';
+import { NotificationApi } from 'antd/lib/notification';
 export { ArgsProps, ConfigProps, NotificationInstance } from 'antd/lib/notification';
-export default notification;
+declare const _default: NotificationApi;
+export default _default;

package/es/Select/style/index.less

@@ -19,16 +19,16 @@
 @margin-xs: 8px; // small items
 @margin-xss: 4px; // more small
 
-@border-color-base: #a3adc8;
+@ald-border-color-base: #a3adc8;
 @border-color-split: hsv(0, 0, 94%); // split border inside a component
 @border-color-inverse: #fff;
 @border-width-base: 1px; // width of the border for a component
 @border-style-base: solid; // style of a components border
 @border-color-disabled: #dfe2ed;
-@select-option-height-lg: @height-lg;
+@select-option-height-lg: @ald-height-lg;
 @select-option-line-height-lg: 16px;
-@select-option-height-base: @height-base;
-@select-option-height-sm: @height-sm;
+@select-option-height-base: @ald-height-base;
+@select-option-height-sm: @ald-height-sm;
 @line-height-base: 1.5715;
 // @mode: compact;
 
@@ -56,7 +56,7 @@
   padding: 0 36px 0 11px;
   overflow: hidden;
   border: 1px solid transparent;
-  border-radius: @border-radius-base;
+  border-radius: @ald-border-radius-base;
   outline: none;
   cursor: pointer;
   transition: all 0.2s;
@@ -70,11 +70,11 @@
   &-selector {
     box-sizing: border-box;
     width: 100%;
-    min-height: @height-base;
-    max-height: @height-base * 3.5px;
+    min-height: @ald-height-base;
+    max-height: @ald-height-base * 3.5px;
     overflow-x: hidden;
     overflow-y: auto;
-    border-radius: @border-radius-base;
+    border-radius: @ald-border-radius-base;
     transition: all 0.2s;
 
     &::-webkit-scrollbar {
@@ -92,19 +92,19 @@
     flex-shrink: 0;
     align-items: center;
     max-width: 50%;
-    height: @height-base;
-    margin-right: @select-label-margin-right;
+    height: @ald-height-base;
+    margin-right: @ald-select-label-margin-right;
     overflow: hidden;
     color: @NL30;
     font-size: @select-input-fontSize;
-    line-height: @height-base;
+    line-height: @ald-height-base;
   }
 
   &-values-wrapper {
     position: relative;
     width: 100%;
     color: @NL0;
-    line-height: @height-base;
+    line-height: @ald-height-base;
   }
 
   &-bordered {
@@ -208,7 +208,7 @@
     position: absolute;
     top: 0;
     left: 0;
-    color: @select-placeholder-color;
+    color: @ald-select-placeholder-color;
     font-size: @select-input-fontSize-sm;
   }
 
@@ -237,24 +237,24 @@
   }
 
   &-small {
-    border-radius: @border-radius-sm;
+    border-radius: @ald-border-radius-sm;
     .@{select-prefix-cls-legacy} {
       &-selector {
-        min-height: @height-sm;
-        max-height: @height-sm * 3.5px;
-        border-radius: @border-radius-sm;
+        min-height: @ald-height-sm;
+        max-height: @ald-height-sm * 3.5px;
+        border-radius: @ald-border-radius-sm;
       }
 
       &-selector-label {
-        height: @height-sm;
+        height: @ald-height-sm;
         color: @NL30;
         font-size: @select-input-fontSize-sm;
-        line-height: @height-sm;
+        line-height: @ald-height-sm;
       }
 
       &-values-wrapper {
         font-size: @select-input-fontSize-sm;
-        line-height: @height-sm;
+        line-height: @ald-height-sm;
       }
 
       &-item-all {
@@ -304,21 +304,21 @@
   }
 
   &-large {
-    height: @height-lg;
+    height: @ald-height-lg;
     .@{select-prefix-cls-legacy} {
       &-selector {
-        min-height: @height-lg;
-        max-height: @height-lg * 3.5px;
+        min-height: @ald-height-lg;
+        max-height: @ald-height-lg * 3.5px;
       }
 
       &-selector-label {
-        height: @height-lg;
+        height: @ald-height-lg;
         font-size: @select-input-fontSize;
-        line-height: @height-lg;
+        line-height: @ald-height-lg;
       }
 
       &-values-wrapper {
-        line-height: @height-lg;
+        line-height: @ald-height-lg;
       }
 
       &-tag-item {
@@ -389,7 +389,7 @@
     padding: 4px 0;
     background: @BG100;
     border: 1px solid @NL90;
-    border-radius: @border-radius-base;
+    border-radius: @ald-border-radius-base;
     box-shadow: @shadow-actionsheet;
     &.@{select-prefix-cls-legacy}-hidden {
       display: none;

package/es/Tooltip/style/index.less

@@ -4,7 +4,7 @@
   .ant-tooltip-inner {
     padding: 6px 12px;
     background: @BG10;
-    border-radius: @border-radius-base;
+    border-radius: @ald-border-radius-base;
     box-shadow: none;
   }
 

package/es/index.d.ts

@@ -33,7 +33,7 @@ export { default as Layout } from './Layout';
 export type { LayoutProps } from './Layout';
 export { default as Message } from './Message';
 export type { MessageArgsProps } from './Message';
-export { default as notification } from './Notification';
+export { default as Notification } from './Notification';
 export type { TreeProps, AntTreeNodeProps as TreeNodeProps, DataNode as TreeDataNode, } from './Tree';
 export { default as Tree } from './Tree';
 export type { SkeletonProps } from './Skeleton';

package/es/index.js

@@ -16,7 +16,7 @@ export { default as ConfigProvider } from './ConfigProvider';
 export { default as DatePicker } from './DatePicker';
 export { default as Layout } from './Layout';
 export { default as Message } from './Message';
-export { default as notification } from './Notification';
+export { default as Notification } from './Notification';
 export { default as Tree } from './Tree';
 export { default as Skeleton } from './Skeleton';
 export { default as Row } from './Row';

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

@@ -4,17 +4,17 @@
 
 
 // height rules
-@height-base: 28px;
-@height-lg: 32px;
-@height-sm: 22px;
+@ald-height-base: 28px;
+@ald-height-lg: 32px;
+@ald-height-sm: 22px;
 
 
-@border-radius-base: 8px;
-@border-radius-sm: 6px;
-@border-color-base: #e7e8e9; // 边框的基础色
+@ald-border-radius-base: 8px;
+@ald-border-radius-sm: 6px;
+@ald-border-color-base: #e7e8e9; // 边框的基础色
 
 // color
-@primary-color: @B40; // 主色调
+@primary-color: @B60; // 主色调
 @error-color: @SC40; // 错误色
 @success-color: @SA40; // 成功色
 @warning-color: @SB40; // 警告色
@@ -32,5 +32,5 @@
 
 //Select
 
-@select-placeholder-color: @NL50;
-@select-label-margin-right:4px;
+@ald-select-placeholder-color: @NL50;
+@ald-select-label-margin-right:4px;