@aloudata/aloudata-design 2.19.2 → 2.19.4

package/dist/AldSelect/style/index.less

@@ -12,7 +12,7 @@
   cursor: pointer;
 
   &-disabled {
-    cursor: not-allowed;
+    cursor: initial;
 
     .beta-ald-select-prefix {
       svg {

package/dist/Checkbox/style/index.less

@@ -21,6 +21,11 @@
   display: flex;
   flex-wrap: wrap;
   gap: 12px;
+  height: fit-content;
+
+  .ant-checkbox-wrapper + .ant-checkbox-wrapper {
+    margin-left: 0;
+  }
 }
 
 .ald-checkout-group-vertical.ant-checkbox-group.ald-checkbox-group.ald-checkbox-group {

package/dist/ColorPicker/style/index.less

@@ -22,10 +22,27 @@
     cursor: pointer;
     transition: border 0.5s ease-in-out;
     border-radius: 4px;
+    color: var(--content-primary);
 
     &:not(.ald-color-picker-wrapper-disabled):hover {
       border: 1px solid var(--interaction-border-normal);
     }
+
+    &-disabled {
+      border: 1px solid var(--interaction-border-neutral-normal);
+      background: var(--global-cool-gray-alpha-50);
+      color: var(--content-primary);
+
+      &.ald-color-picker-wrapper-borderless {
+        border-color: transparent;
+        background: transparent;
+      }
+
+      &:hover {
+        border-color: var(--interaction-border-neutral-normal);
+        background-color: var(--global-cool-gray-alpha-50);
+      }
+    }
   }
 
   .ald-color-picker-wrapper-borderless {
@@ -165,5 +182,9 @@
 }
 
 .ald-color-picker-disabled {
-  opacity: 0.4;
+  cursor: initial;
+
+  .ald-color-picker-wrapper {
+    cursor: initial;
+  }
 }

package/dist/InputSearch/index.d.ts

@@ -1,7 +1,10 @@
 import React from 'react';
 export default function InputSearch(props: IProps): React.JSX.Element;
 interface IProps {
+    /** 搜索回调，在输入完成时触发（回车、输入法结束、非输入法输入时） */
     onSearch: (value: string) => void;
+    /** 值变化回调（受控模式时推荐使用，每次输入都触发，包括输入法期间） */
+    onChange?: (value: string) => void;
     onBlur?: (value: string, e: React.FocusEvent<HTMLInputElement>) => void;
     className?: string;
     debounce?: boolean;

package/dist/InputSearch/index.js

@@ -30,6 +30,7 @@ export default function InputSearch(props) {
     locale = _useContext.locale;
   var t = getTranslator(locale);
   var onSearch = props.onSearch,
+    onChange = props.onChange,
     className = props.className,
     _props$debounce = props.debounce,
     debounce = _props$debounce === void 0 ? true : _props$debounce,
@@ -91,6 +92,9 @@ export default function InputSearch(props) {
     // 非受控模式才更新内部状态
     if (!isControlled) {
       setSearchValue(newValue);
+    } else {
+      onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
+      return;
     }
     if (!isComposing.current) {
       // 受控的时候debounce不生效
@@ -100,11 +104,14 @@ export default function InputSearch(props) {
         onSearch(newValue);
       }
     }
-  }, [debounce, debounceSearch, onSearch, isControlled]);
+  }, [debounce, debounceSearch, onSearch, isControlled, onChange]);
   var handleCompositionStart = useCallback(function () {
     isComposing.current = true;
   }, []);
   var handleCompositionEnd = useCallback(function (e) {
+    if (isControlled) {
+      return;
+    }
     isComposing.current = false;
     // 在输入法结束后触发一次搜索
     var value = e.target.value;
@@ -113,7 +120,7 @@ export default function InputSearch(props) {
     } else {
       onSearch(value);
     }
-  }, [debounce, debounceSearch, onSearch]);
+  }, [debounce, debounceSearch, isControlled, onSearch]);
   var iconSize = useMemo(function () {
     if (size === 'middle' || size === 'large') {
       return 20;

package/dist/LogicTree/components/DisplayLogicItem/index.d.ts

@@ -4,7 +4,6 @@ interface IProps<T> {
     value: TNode<T>;
     renderCondition: (value: T) => React.ReactNode;
     backgroundColor?: string;
-    key: string;
 }
-export declare function DisplayLogicItem<T>({ value, renderCondition, backgroundColor, key, }: IProps<T>): React.JSX.Element | null;
+export declare function DisplayLogicItem<T>({ value, renderCondition, backgroundColor, }: IProps<T>): React.JSX.Element | null;
 export {};

package/dist/LogicTree/components/DisplayLogicItem/index.js

@@ -17,8 +17,7 @@ export function DisplayLogicItem(_ref) {
   var _logicTypeTextMap;
   var value = _ref.value,
     renderCondition = _ref.renderCondition,
-    backgroundColor = _ref.backgroundColor,
-    key = _ref.key;
+    backgroundColor = _ref.backgroundColor;
   var _useState = useState(0),
     _useState2 = _slicedToArray(_useState, 2),
     firstNodeHight = _useState2[0],
@@ -57,7 +56,7 @@ export function DisplayLogicItem(_ref) {
       return /*#__PURE__*/React.createElement("div", {
         className: "ald-logic-tree-node-wrap",
         ref: ref,
-        key: key
+        key: node.id
       }, /*#__PURE__*/React.createElement("div", {
         className: "ald-logic-tree-horizontal-line"
       }), /*#__PURE__*/React.createElement(DisplayLogicItem, {

package/dist/LogicTree/components/LogicItem/index.js

@@ -7,7 +7,7 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import classNames from 'classnames';
 import _ from 'lodash';
-import React, { useCallback, useContext, useRef, useState } from 'react';
+import React, { useCallback, useContext, useEffect, useRef, useState } from 'react';
 import { DragPreviewImage, useDrag, useDrop } from 'react-dnd';
 import { EPutPosition } from "../..";
 import DragLightLine from "../../../Icon/components/DragLightLine";
@@ -62,6 +62,8 @@ export default function LogicItem(_ref) {
   }];
   var type = value.type;
   var ref = useRef(null);
+  var firstResizeObserverRef = useRef(null);
+  var lastResizeObserverRef = useRef(null);
   var _useDrag = useDrag({
       type: 'LOGIC_ITEM',
       item: {
@@ -147,6 +149,10 @@ export default function LogicItem(_ref) {
   drag(drop(ref));
   var isDragOver = isOver && canDrop && !isRoot;
   var firstRef = useCallback(function (node) {
+    if (firstResizeObserverRef.current) {
+      firstResizeObserverRef.current.disconnect();
+      firstResizeObserverRef.current = null;
+    }
     if (!node) return;
     var resizeObserver = new ResizeObserver(function (entries) {
       var _iterator = _createForOfIteratorHelper(entries),
@@ -166,11 +172,13 @@ export default function LogicItem(_ref) {
       }
     });
     resizeObserver.observe(node);
-    return function () {
-      resizeObserver.disconnect();
-    };
+    firstResizeObserverRef.current = resizeObserver;
   }, []);
   var lastRef = useCallback(function (node) {
+    if (lastResizeObserverRef.current) {
+      lastResizeObserverRef.current.disconnect();
+      lastResizeObserverRef.current = null;
+    }
     if (!node) return;
     var resizeObserver = new ResizeObserver(function (entries) {
       var _iterator2 = _createForOfIteratorHelper(entries),
@@ -190,9 +198,7 @@ export default function LogicItem(_ref) {
       }
     });
     resizeObserver.observe(node);
-    return function () {
-      resizeObserver.disconnect();
-    };
+    lastResizeObserverRef.current = resizeObserver;
   }, []);
   var onAddCondition = function onAddCondition() {
     var id = value.id;
@@ -214,6 +220,18 @@ export default function LogicItem(_ref) {
     var id = value.id;
     changeRecordData(id, data);
   };
+  useEffect(function () {
+    return function () {
+      if (firstResizeObserverRef.current) {
+        firstResizeObserverRef.current.disconnect();
+        firstResizeObserverRef.current = null;
+      }
+      if (lastResizeObserverRef.current) {
+        lastResizeObserverRef.current.disconnect();
+        lastResizeObserverRef.current = null;
+      }
+    };
+  }, []);
   var isEn = locale === ELangType.EN;
   if (type === ENodeType.LOGIC) {
     var nodes = value.nodes,

package/dist/MemberPicker/components/Panel.d.ts

@@ -22,6 +22,7 @@ interface IPanelProps {
         originNode: ReactNode;
     }) => ReactNode;
     renderSelectedTag?: (user: IUser | IUserGroup, originNode: ReactNode) => ReactNode;
+    filterItem?: (item: IUser | IUserGroup) => boolean;
 }
 export declare const userDisplayNameIsRepeated: (userList: TUser, displayName?: string) => boolean;
 export default function Panel(props: IPanelProps): React.JSX.Element;

package/dist/MemberPicker/components/Panel.js

@@ -46,7 +46,8 @@ export default function Panel(props) {
     footer = props.footer,
     onCancel = props.onCancel,
     renderItem = props.renderItem,
-    renderSelectedTag = props.renderSelectedTag;
+    renderSelectedTag = props.renderSelectedTag,
+    filterItem = props.filterItem;
   var _useState = useState([]),
     _useState2 = _slicedToArray(_useState, 2),
     selectedUsers = _useState2[0],
@@ -97,6 +98,7 @@ export default function Panel(props) {
     var userSelection = /*#__PURE__*/React.createElement(MemberSelection, {
       className: 'ald-member-picker-member-selection-multiple',
       userList: dataList.filter(isUser),
+      filterItem: filterItem,
       width: (panelwidth - 6) / 2,
       selectedUsers: selectedUsers.filter(isUser),
       onChange: onSelectionChange,
@@ -109,6 +111,7 @@ export default function Panel(props) {
     var userGroupSelection = /*#__PURE__*/React.createElement(UserGroupSelection, {
       className: 'ald-member-picker-member-selection-multiple',
       userGroupList: dataList.filter(isUserGroup),
+      filterItem: filterItem,
       width: (panelwidth - 6) / 2,
       selectedUsersGroup: selectedUsers.filter(isUserGroup),
       onChange: onSelectionChange,

package/dist/MemberPicker/components/PanelWrapper.d.ts

@@ -20,6 +20,7 @@ interface IProps {
         originNode: ReactNode;
     }) => ReactNode;
     renderSelectedTag?: (user: IUser | IUserGroup, originNode: ReactNode) => ReactNode;
+    filterItem?: (item: IUser | IUserGroup) => boolean;
 }
-export declare const PanelWrapper: ({ type, value, multiple, dropdownWidth, onChange, onCancel, className, footer, lockedIds, renderItem, renderSelectedTag, }: IProps) => React.JSX.Element;
+export declare const PanelWrapper: ({ type, value, multiple, dropdownWidth, onChange, onCancel, className, footer, lockedIds, renderItem, renderSelectedTag, filterItem, }: IProps) => React.JSX.Element;
 export default PanelWrapper;

package/dist/MemberPicker/components/PanelWrapper.js

@@ -26,7 +26,8 @@ export var PanelWrapper = function PanelWrapper(_ref) {
     _ref$lockedIds = _ref.lockedIds,
     lockedIds = _ref$lockedIds === void 0 ? [] : _ref$lockedIds,
     renderItem = _ref.renderItem,
-    renderSelectedTag = _ref.renderSelectedTag;
+    renderSelectedTag = _ref.renderSelectedTag,
+    filterItem = _ref.filterItem;
   var _useContext = useContext(LocaleContext),
     locale = _useContext.locale;
   var t = getTranslator(locale);
@@ -88,12 +89,17 @@ export var PanelWrapper = function PanelWrapper(_ref) {
     loading = _useRequest.loading,
     run = _useRequest.run;
   var totalUserList = useMemo(function () {
-    var totalUsers = searchUserList.concat(selectedUserList);
+    var totalUsers = searchUserList.concat(selectedUserList).filter(function (item) {
+      if (filterItem) {
+        return filterItem(item);
+      }
+      return true;
+    });
     return _.uniqBy(totalUsers, function (data) {
       if (data.type === EUserType.USER) return data.userId;
       return data.groupId;
     });
-  }, [searchUserList, selectedUserList]);
+  }, [searchUserList, selectedUserList, filterItem]);
   useEffect(function () {
     run();
   }, [run, searchString]);

package/dist/Table/hooks/useScroll.js

@@ -51,6 +51,18 @@ export default function useScroll(props) {
     if (!elem) {
       return;
     }
+
+    // 先检查表格是否真的需要横向滚动
+    var DEVIATION = 2;
+    var needsHorizontalScroll = elem.scrollWidth > elem.clientWidth + DEVIATION;
+    if (!needsHorizontalScroll) {
+      // 表格宽度足够，不需要横向滚动，隐藏左右两侧阴影
+      setIsPingLeft(false);
+      setIsPingRight(false);
+      return;
+    }
+
+    // 表格需要横向滚动，根据滚动位置判断是否显示阴影
     var scrollLeft = elem.scrollLeft;
     if (scrollLeft <= 0) {
       setIsPingLeft(false);

package/dist/Table/index.js

@@ -288,8 +288,9 @@ function Table(props, ref) {
       return 48;
     },
     // estimate row height for accurate scrollbar dragging
+    // 没有测量出 bodyRef.current 的高度时，返回 null，避免虚拟化器从 DOM 获取异常高度
     getScrollElement: function getScrollElement() {
-      return bodyRef.current;
+      return totalSize ? bodyRef.current : null;
     },
     // measure dynamic row height, except in firefox because it measures table border height incorrectly
     measureElement: typeof window !== 'undefined' && navigator.userAgent.indexOf('Firefox') === -1 ? function (element) {

package/dist/TextLink/style/index.less

@@ -10,5 +10,6 @@
   &.ald-text-link-disabled {
     pointer-events: none;
     cursor: default;
+    opacity: 0.5;
   }
 }

package/dist/TextLink/style/type.less

@@ -20,14 +20,6 @@
       color: var(--interaction-default-selected);
     }
   }
-
-  &.ald-text-link-disabled {
-    color: var(--alias-colors-text-disabled);
-
-    .ald-icon {
-      color: var(--alias-colors-icon-disabled);
-    }
-  }
 }
 
 .ald-text-link-secondary {
@@ -52,14 +44,6 @@
       color: var(--interaction-default-selected);
     }
   }
-
-  &.ald-text-link-disabled {
-    color: var(--alias-colors-text-disabled);
-
-    .ald-icon {
-      color: var(--alias-colors-icon-disabled);
-    }
-  }
 }
 
 .ald-text-link-show-underline {