@aloudata/aloudata-design 2.9.0 → 2.10.0

package/dist/MemberPicker/components/SingleOption.js

@@ -4,6 +4,7 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _ty
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 import classnames from 'classnames';
 import React from 'react';
+import { EUserType } from "../../ConfigProvider/getUserList";
 import TextLink from "../../TextLink/index";
 import { getAccount, getId, getPhoto } from "../utils";
 import { isUserGroup } from "../utils/getUsersWithUserId";
@@ -16,7 +17,8 @@ export default function SingleOption(params) {
     className = params.className,
     onNextLevel = params.onNextLevel,
     _params$hasNextLevel = params.hasNextLevel,
-    hasNextLevel = _params$hasNextLevel === void 0 ? true : _params$hasNextLevel;
+    hasNextLevel = _params$hasNextLevel === void 0 ? true : _params$hasNextLevel,
+    showUserId = params.showUserId;
   var onClick = function onClick() {
     if (disabled) return;
     onChange === null || onChange === void 0 ? void 0 : onChange(!selected, user);
@@ -26,13 +28,17 @@ export default function SingleOption(params) {
     onClick: onClick
   }, /*#__PURE__*/React.createElement("div", {
     className: 'ald-member-picker-label'
+  }, /*#__PURE__*/React.createElement("div", {
+    className: 'ald-member-picker-option-content'
   }, /*#__PURE__*/React.createElement(NickLabel, {
     type: user.type,
     id: getId(user),
     name: user.name,
     photo: getPhoto(user),
     account: getAccount(user)
-  })), isUserGroup(user) && hasNextLevel && /*#__PURE__*/React.createElement(TextLink, {
+  }), showUserId && user.type === EUserType.USER && /*#__PURE__*/React.createElement("div", {
+    className: 'ald-member-picker-option-id'
+  }, user.userId))), isUserGroup(user) && hasNextLevel && /*#__PURE__*/React.createElement(TextLink, {
     className: "ald-member-picker-btn",
     size: "small",
     disabled: disabled,

package/dist/MemberPicker/interface.d.ts

@@ -3,7 +3,7 @@ import { ISelectProps } from '../Select';
 import { RequiredProperties } from '../_utils/type';
 export type TUserValue = RequiredProperties<IUser, 'type' | 'userId'>;
 export type TUserGroupValue = RequiredProperties<IUserGroup, 'type' | 'groupId'>;
-export type TMemberPickerValue = TUserValue | TUserGroupValue | Array<TUserValue | TUserGroupValue>;
+export type TMemberPickerValue = TUserGroupValue | Array<TUserValue | TUserGroupValue>;
 export declare enum EMemberPicker {
     GROUP = "GROUP",
     USER = "USER",

package/dist/MemberPicker/style/index.less

@@ -101,6 +101,7 @@
     gap: 8px;
 
     .ald-member-picker-selected-member-tag {
+      max-width: 100%;
       display: flex;
       justify-content: center;
       align-items: center;
@@ -115,6 +116,7 @@
       line-height: 20px; /* 142.857% */
 
       .ald-member-picker-close {
+        flex: 0 0 20px;
         border-left: 1px solid
           var(--alias-colors-border-accent-gray-subtler-default, #e5e7eb);
         cursor: pointer;
@@ -148,9 +150,22 @@
   justify-content: space-between;
 
   .ald-member-picker-label {
+    width: 100%;
     flex: 1;
     display: flex;
     gap: 4px;
+
+    .ald-member-picker-option-content {
+      min-width: 0;
+      flex: 1;
+      display: flex;
+      align-items: center;
+      gap: 6px;
+
+      .ald-member-picker-nick-label {
+        flex-grow: 1;
+      }
+    }
   }
 
   &:hover {
@@ -170,6 +185,7 @@
   }
 
   .ald-member-picker-checkbox {
+    flex: 0 0 20px;
     display: flex;
     align-items: center;
     justify-content: center;
@@ -188,6 +204,16 @@
   }
 }
 
+.ald-member-picker-option-id {
+  max-width: 50%;
+  white-space: nowrap; /* 防止内容换行，保持内容长度 */
+  text-overflow: ellipsis;
+  overflow: hidden;
+  color: var(--alias-colors-text-subtle, #4b5563);
+  font-size: 12px;
+  line-height: 16px; /* 133.333% */
+}
+
 .ald-member-picker-trigger {
   display: flex;
   align-items: center;
@@ -237,6 +263,8 @@
   padding: 2px 6px;
   display: flex;
   align-items: center;
+  gap: 6px;
+  min-width: 0;
 }
 
 .ald-member-picker-nick-label {

package/dist/Menu/style/index.less

@@ -18,7 +18,8 @@
   background: var(--alias-colors-bg-skeleton-subtler, #fff);
   box-shadow: 0 10px 18px -2px #00000014;
   min-width: @menu-width;
-  z-index: 999;
+  font-size: 14px;
+  z-index: 1001;
 }
 
 .ald-menu {