@aloudata/aloudata-design 2.0.0 → 2.0.2

package/dist/DataPreviewTable/components/Header/index.js

@@ -41,9 +41,7 @@ export default function Header(props) {
       className: "ald-data-preview-header-left"
     }, column.icon !== undefined ? column.icon : /*#__PURE__*/React.createElement("span", null)), /*#__PURE__*/React.createElement("div", {
       className: "ald-data-preview-header-name"
-    }, column.name), /*#__PURE__*/React.createElement("div", {
-      className: "ald-data-preview-header-right"
-    })), /*#__PURE__*/React.createElement(DragBar, {
+    }, column.name)), /*#__PURE__*/React.createElement(DragBar, {
       columnId: column.id,
       wrapWidth: columnLayout[column.id].width,
       onChange: setWidth

package/dist/DataPreviewTable/index.js

@@ -24,6 +24,7 @@ var DataPreviewTable = /*#__PURE__*/forwardRef(function (props, ref) {
     return datasource.length * CELL_HEIGHT + HEADER_HEIGHT;
   }, [datasource]);
   var wrapRef = useRef(null);
+  var progressRef = useRef(null);
   var _useDirection = useDirection(columns, wrapRef),
     columnRange = _useDirection.columnRange,
     rowRange = _useDirection.rowRange,
@@ -60,6 +61,10 @@ var DataPreviewTable = /*#__PURE__*/forwardRef(function (props, ref) {
             behavior: 'smooth'
           });
         }
+      },
+      progressRestart: function progressRestart() {
+        var _progressRef$current;
+        (_progressRef$current = progressRef.current) === null || _progressRef$current === void 0 ? void 0 : _progressRef$current.restart();
       }
     };
   });
@@ -85,7 +90,8 @@ var DataPreviewTable = /*#__PURE__*/forwardRef(function (props, ref) {
     })
   }, /*#__PURE__*/React.createElement(Progress, {
     className: "ald-data-preview-progress",
-    loading: !!loading
+    loading: !!loading,
+    ref: progressRef
   }), /*#__PURE__*/React.createElement("div", {
     style: {
       height: dataStatus === 'pending' ? skeletonRows * CELL_HEIGHT + HEADER_HEIGHT : contentHeight,

package/dist/DataPreviewTable/interface.d.ts

@@ -11,6 +11,7 @@ export interface ITableProps {
 }
 export interface DataPreviewTableRef {
     scrollToColumnInView: (columnId: string) => void;
+    progressRestart: () => void;
 }
 export type Align = 'left' | 'center' | 'right';
 export interface PreviewColumn {

package/dist/DataPreviewTable/style/index.less

@@ -35,26 +35,22 @@
   font-weight: 500;
 
   .ald-data-preview-header-default {
-    padding: 4px 13px 3px 20px;
+    padding: 4px;
     height: 100%;
     width: 100%;
-    line-height: 25px;
+    line-height: 24px;
     background: var(--alias-colors-bg-skeleton-subtle, #f9fafb);
+    display: flex;
+    align-items: center;
 
     .ald-data-preview-header-left {
-      width: 20px;
       height: 100%;
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 16px;
-      position: absolute;
-      left: 4px;
-      z-index: 1;
+      margin-right: 4px;
       color: #575757;
-      top: 0;
-      bottom: 0;
-      // background:rgb(0 0 0 / 0%)
     }
 
     .ald-data-preview-header-name {
@@ -62,6 +58,7 @@
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
+      margin: auto;
     }
 
     .ald-data-preview-header-right {

package/dist/Empty/style/index.less

@@ -24,8 +24,8 @@
   }
 
   .ald-empty-title {
-    color: @NL0;
-    font-size: 13px;
+    color: var(--alias-colors-text-default, #1f2937);
+    font-size: 14px;
     line-height: 24px;
     margin-bottom: 4px;
     font-weight: 500;
@@ -34,7 +34,7 @@
   .ald-empty-title-small {
     color: #858585;
     font-weight: 400;
-    font-size: 13px;
+    font-size: 14px;
   }
 
   .ald-empty-description {

package/dist/Icon/components/CloseLLine.js

@@ -23,19 +23,12 @@ var CloseLLine = function CloseLLine(_ref, ref) {
     id: descId
   }, desc) : null, title ? /*#__PURE__*/React.createElement("title", {
     id: titleId
-  }, title) : null, /*#__PURE__*/React.createElement("g", {
-    clipPath: "url(#a)"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, title) : null, /*#__PURE__*/React.createElement("path", {
     fill: props.color || 'currentColor',
     fillRule: "evenodd",
-    d: "m12 11.293 6.01-6.01.707.707-6.01 6.01 6.01 6.01-.707.707-6.01-6.01-6.01 6.01-.708-.707 6.01-6.01-6.01-6.01.708-.708 6.01 6.01Z",
+    d: "M6.47 6.47a.75.75 0 0 1 1.06 0L12 10.94l4.47-4.47a.75.75 0 1 1 1.06 1.06L13.06 12l4.47 4.47a.75.75 0 1 1-1.06 1.06L12 13.06l-4.47 4.47a.75.75 0 0 1-1.06-1.06L10.94 12 6.47 7.53a.75.75 0 0 1 0-1.06Z",
     clipRule: "evenodd"
-  })), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
-    id: "a"
-  }, /*#__PURE__*/React.createElement("path", {
-    fill: props.fill || 'currentColor',
-    d: "M0 0h24v24H0z"
-  }))));
+  }));
 };
 var ForwardRef = /*#__PURE__*/forwardRef(CloseLLine);
 var Memo = /*#__PURE__*/memo(ForwardRef);

package/dist/Icon/svg/close-L-line.svg

@@ -1,12 +1,3 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <g clip-path="url(#clip0_278_6954)">
-    <path fill-rule="evenodd" clip-rule="evenodd"
-      d="M12 11.2929L18.0104 5.2825L18.7175 5.98961L12.7071 12L18.7175 18.0104L18.0104 18.7175L12 12.7071L5.98959 18.7175L5.28249 18.0104L11.2929 12L5.28249 5.98961L5.98959 5.2825L12 11.2929Z"
-      fill="black" />
-  </g>
-  <defs>
-    <clipPath id="clip0_278_6954">
-      <rect width="24" height="24" fill="white" />
-    </clipPath>
-  </defs>
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M6.46967 6.46967C6.76256 6.17678 7.23744 6.17678 7.53033 6.46967L12 10.9393L16.4697 6.46967C16.7626 6.17678 17.2374 6.17678 17.5303 6.46967C17.8232 6.76256 17.8232 7.23744 17.5303 7.53033L13.0607 12L17.5303 16.4697C17.8232 16.7626 17.8232 17.2374 17.5303 17.5303C17.2374 17.8232 16.7626 17.8232 16.4697 17.5303L12 13.0607L7.53033 17.5303C7.23744 17.8232 6.76256 17.8232 6.46967 17.5303C6.17678 17.2374 6.17678 16.7626 6.46967 16.4697L10.9393 12L6.46967 7.53033C6.17678 7.23744 6.17678 6.76256 6.46967 6.46967Z" fill="black"/>
 </svg>

package/dist/Input/components/Input/index.js

@@ -46,7 +46,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (props, ref) {
     autoComplete: "off",
     allowClear: allowClear ? {
       clearIcon: /*#__PURE__*/React.createElement(CloseCircleFill, {
-        size: 20,
+        size: 16,
         color: "#9CA3AF"
       })
     } : undefined,

package/dist/Input/components/Password/index.js

@@ -11,6 +11,7 @@ import classnames from 'classnames';
 import React, { useContext } from 'react';
 import SizeContext from "../../../ConfigProvider/sizeContext";
 import { EyeOffLine, EyeOnLine } from "../../../Icon";
+import IconButton from "../../../IconButton";
 import { getSizeType } from "../Input";
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export default /*#__PURE__*/React.forwardRef(function (props, ref) {
@@ -26,10 +27,9 @@ export default /*#__PURE__*/React.forwardRef(function (props, ref) {
     disabled: disabled,
     className: classnames('ald-input', 'ald-input-password', "ald-input-".concat(getSizeType(size)), _defineProperty({}, "ald-input-disabled", disabled), className),
     iconRender: function iconRender(visible) {
-      return visible ? /*#__PURE__*/React.createElement(EyeOnLine, {
-        size: 20
-      }) : /*#__PURE__*/React.createElement(EyeOffLine, {
-        size: 20
+      return /*#__PURE__*/React.createElement(IconButton, {
+        size: "small",
+        icon: visible ? /*#__PURE__*/React.createElement(EyeOnLine, null) : /*#__PURE__*/React.createElement(EyeOffLine, null)
       });
     }
   }));

package/dist/Input/components/TextArea/index.js

@@ -11,6 +11,7 @@ import classnames from 'classnames';
 import React, { useContext } from 'react';
 import SizeContext from "../../../ConfigProvider/sizeContext";
 import { CloseCircleFill } from "../../../Icon";
+import IconButton from "../../../IconButton";
 import { getSizeType } from "../Input";
 export default /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _props$bordered = props.bordered,
@@ -30,9 +31,11 @@ export default /*#__PURE__*/React.forwardRef(function (props, ref) {
     spellCheck: false,
     className: classnames('ald-input', 'ald-input-textarea', "ald-input-textarea-".concat(getSizeType(size)), _defineProperty({}, "ald-input-disabled", disabled), className),
     allowClear: allowClear ? {
-      clearIcon: /*#__PURE__*/React.createElement(CloseCircleFill, {
-        size: 20,
-        color: "#9CA3AF"
+      clearIcon: /*#__PURE__*/React.createElement(IconButton, {
+        size: "small",
+        icon: /*#__PURE__*/React.createElement(CloseCircleFill, {
+          color: "#9CA3AF"
+        })
       })
     } : false,
     ref: ref,

package/dist/Input/style/index.less

@@ -1,6 +1,7 @@
 /* stylelint-disable no-descending-specificity */
 @import '../../style/index.less';
 @import '../../Icon/index.less';
+@import '../../IconButton/style/index.less';
 @import './reset.less';
 @import './size.less';
 @import './status.less';

package/dist/Menu/style/index.less

@@ -86,6 +86,7 @@
   border-radius: var(--alias-radius-75, 6px);
   box-shadow: 0 10px 18px -2px rgba(0, 0, 0, 0.08);
   overflow: hidden;
+  padding: 2px 0;
 }
 
 // menu菜单

package/dist/Modal/index.js

@@ -55,7 +55,7 @@ var ModalTitle = function ModalTitle(_ref, type) {
     subTitle = _ref.subTitle;
   return /*#__PURE__*/React.createElement("div", {
     className: 'ald-modal-title-container'
-  }, /*#__PURE__*/React.createElement("div", {
+  }, icon && /*#__PURE__*/React.createElement("div", {
     className: classNames('ald-modal-icon-container', _defineProperty({}, "ald-modal-cion-".concat(type, "-container"), type))
   }, icon), /*#__PURE__*/React.createElement("div", {
     className: 'ald-modal-text-container'

package/dist/Modal/style/modal.less

@@ -26,7 +26,7 @@
     }
 
     .ant-modal-header {
-      padding: var(--alias-spacing-200, 16px) var(--alias-spacing-250, 20px);
+      padding: var(--alias-spacing-200, 16px) var(--alias-padding-300, 24px);
       margin-bottom: 0;
       border-bottom: 1px solid var(--alias-colors-border-default, #e5e7eb);
       background: var(--alias-colors-bg-skeleton-subtler, #fff);
@@ -77,7 +77,7 @@
       line-height: 20px;
       font-size: 14px;
       overflow-y: auto;
-      padding: var(--alias-spacing-200, 16px) var(--alias-spacing-250, 20px);
+      padding: var(--alias-padding-300, 24px);
     }
 
     .ant-modal-footer {

package/dist/Radio/style/index.less

@@ -1,8 +1,8 @@
 @import '../../style/index.less';
 
-@radio-icon-button-padding-large: 6px;
-@radio-icon-button-padding-middle: 6px;
-@radio-icon-button-padding-small: 7px;
+@radio-icon-button-padding-large: 4px;
+@radio-icon-button-padding-middle: 4px;
+@radio-icon-button-padding-small: 5px;
 @radio-group-height-large: 36px;
 @radio-group-height-middle: 32px;
 @radio-group-height-small: 28px;
@@ -77,6 +77,7 @@
   font-size: 14px;
   line-height: 20px;
   user-select: none;
+  white-space: nowrap;
 }
 // 绘制选中时的圆圈样式
 .ald-radio-checked > .ald-radio-inner {
@@ -200,13 +201,16 @@
   }
 }
 
+.ald-radio-group-icon-button {
+  padding: 0 !important;
+}
+
 // button状态下的样式
 .ald-radio-group-button,
 .ald-radio-group-icon-button {
   display: flex;
   align-items: flex-start;
   box-sizing: border-box;
-  width: min-content;
   padding: 0;
   overflow: hidden;
 
@@ -267,6 +271,10 @@
     }
   }
 
+  .ald-radio-icon-button-wrapper-filled {
+    margin: 2px;
+  }
+
   // button选中状态下的样式
   .ald-radio-wrapper-checked.ald-radio-button-wrapper-border,
   .ald-radio-wrapper-checked.ald-radio-button-wrapper-border-primary,
@@ -308,7 +316,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    height: 100%;
+    height: calc(100% - 4px);
     background-color: var(--alias-colors-bg-skeleton-strong, #f3f4f6);
     cursor: pointer;
 
@@ -378,6 +386,10 @@
       border-radius: var(--alias-radius-50, 4px);
     }
 
+    .ald-radio-icon-button-wrapper-filled {
+      border-radius: var(--alias-radius-50, 4px) !important ;
+    }
+
     .ald-radio-label {
       .ald-radio-desc {
         font-size: @font-size-middle;
@@ -386,7 +398,7 @@
 
     .ald-radio-label.ald-radio-button-wrapper-filled {
       height: 28px;
-      border-radius: @border-radius-middle;
+      border-radius: 4px !important;
       margin-top: 2px;
     }
 
@@ -436,10 +448,14 @@
       }
     }
 
+    .ald-radio-icon-button-wrapper-filled {
+      border-radius: var(--alias-radius-25, 2px) !important ;
+    }
+
     .ald-radio-label.ald-radio-button-wrapper-filled {
       height: 24px;
       margin-top: 2px;
-      border-radius: @border-radius-small;
+      border-radius: 2px !important;
     }
 
     .ald-radio-icon-button-wrapper-filled,
@@ -501,10 +517,14 @@
       border-radius: var(--alias-radius-75, 6px);
     }
 
+    .ald-radio-icon-button-wrapper-filled {
+      border-radius: var(--alias-radius-75, 6px) !important ;
+    }
+
     .ald-radio-label.ald-radio-button-wrapper-filled {
       height: 32px;
       margin-top: 2px;
-      border-radius: @border-radius-large!important;
+      border-radius: 6px !important;
     }
 
     .ald-radio-label {
@@ -570,6 +590,7 @@
   gap: 2px;
   background: var(--alias-colors-bg-skeleton-strong, #f3f4f6);
   padding: 0 2px;
+  width: min-content;
 
   .ald-radio-label:not(.ald-radio-wrapper-disabled) {
     &:hover {

package/dist/Select/style/status.less

@@ -78,6 +78,8 @@
           .ant-select-selection-item-content {
             background: transparent;
             color: var(--alias-colors-text-subtle, #4b5563);
+            font-weight: 500;
+            line-height: 16px;
           }
         }
       }

package/dist/Tree/style/indent.less

@@ -0,0 +1,11 @@
+.ald-tree-indent {
+  display: block;
+  // 这里比较黑，本身不需要indent元素，但是rc-tree需要 ald-tree-indent-unit的宽度，来计算dropIndicator的位置
+  position: absolute;
+  left: 100000px;
+
+  .ald-tree-indent-unit {
+    width: 16px;
+    height: 1px;
+  }
+}

package/dist/Tree/style/index.less

@@ -5,6 +5,7 @@
 @import './rtl.less';
 @import './mixin.less';
 @import './reset.less';
+@import './indent.less';
 @import './checkbox.less';
 
 @tree-font-size-large: 14px;

package/dist/Tree/style/mixin.less

@@ -24,9 +24,21 @@
     // it should displayed over the following node
     z-index: 1;
     height: 2px;
-    background-color: @primary-color;
+    background-color: var(--alias-colors-border-selected, #126fdd);
     border-radius: 1px;
     pointer-events: none;
+
+    &::before {
+      content: '';
+      position: absolute;
+      left: 0;
+      top: -5px;
+      width: 0;
+      height: 0;
+      border-top: 6px solid transparent;
+      border-bottom: 6px solid transparent;
+      border-left: 10px solid var(--alias-colors-border-selected, #126fdd); /* 高度 */
+    }
   }
 }
 
@@ -66,8 +78,8 @@
           top: 0;
           right: 0;
           bottom: 0;
-          border: 1px solid @primary-color;
-          opacity: 0;
+          // border: 1px solid @primary-color;
+          opacity: 0.5;
           animation: ald-tree-node-fx-do-not-use 0.3s;
           animation-play-state: running;
           animation-fill-mode: forwards;