@aloudata/aloudata-design 1.9.17 → 1.10.0

package/dist/Checkbox/style/index.less

@@ -4,6 +4,7 @@
 .ant-checkbox-inner {
   border: 1px solid #dbdbdb !important;
   background-color: #fff !important;
+  transform: scale(0.875);
 }
 // 此处同理
 .ant-checkbox::after,
@@ -74,16 +75,26 @@
       border-color: @B40;
 
       &::after {
-        top: 3px;
-        left: 2px;
+        // top: 3px;
+        // left: 2px;
         z-index: 10;
-        width: 10px;
-        height: 8px;
-        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAQCAYAAAAS7Y8mAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAADLSURBVHgBrdTPDcIgFAZwHo3O0RF6MdGbjuAI3aCjuAGj6E3jyRGYQwPIR2rT1mfDH79Lyct7vxRIIPGHbLtr/aJKrZxpb6edRk2KwgB9kjw74fb4brp7Uwx/UL+s+1JtyakimEERbZw9YkEiI79Q6+zh0Z9xMhyDDjB3qyVogGfNeu2bODwFRST+dNQchoGUoAE2fvtoGtUmeA6KhDNu/LBkhmUlW2usSkUHeAGfJwqdwBF4NPoFL+BJKAszeDKKsG8FEGAk6JKDIm/pQrazK2zB6QAAAABJRU5ErkJggg==')
-          no-repeat;
-        background-size: 100%, 100%;
-        border-width: 0;
-        transform: none;
+        // width: 10px;
+        // background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAQCAYAAAAS7Y8mAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAADLSURBVHgBrdTPDcIgFAZwHo3O0RF6MdGbjuAI3aCjuAGj6E3jyRGYQwPIR2rT1mfDH79Lyct7vxRIIPGHbLtr/aJKrZxpb6edRk2KwgB9kjw74fb4brp7Uwx/UL+s+1JtyakimEERbZw9YkEiI79Q6+zh0Z9xMhyDDjB3qyVogGfNeu2bODwFRST+dNQchoGUoAE2fvtoGtUmeA6KhDNu/LBkhmUlW2usSkUHeAGfJwqdwBF4NPoFL+BJKAszeDKKsG8FEGAk6JKDIm/pQrazK2zB6QAAAABJRU5ErkJggg==')
+        //   no-repeat;
+        // background-size: 100%, 100%;
+        // border-width: 0;
+        // transform: none;
+        position: absolute;
+        // top: 0;
+        // left: 0;
+        // width: 100%;
+        // height: 100%;
+        border: 2px solid #3271c9;
+        border-top: 0;
+        border-left: 0;
+        transform: rotate(45deg) scale(1) translate(-50%, -50%);
+        opacity: 1;
+        transition: all 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46) 0.1s;
       }
     }
   }
@@ -195,6 +206,21 @@
   cursor: default;
 }
 
+.ant-checkbox-wrapper[class]:hover .ant-checkbox::after {
+  visibility: hidden;
+}
+
 .ant-checkbox-checked:hover .ant-checkbox-inner[class] {
   background-color: transparent;
 }
+@keyframes ald-checkbox-effect {
+  0% {
+    transform: scale(1);
+    opacity: 0.5;
+  }
+
+  100% {
+    transform: scale(1.6);
+    opacity: 0;
+  }
+}

package/dist/ConfigProvider/getUserList.d.ts

@@ -1,12 +1,24 @@
 import * as React from 'react';
+export declare enum EUserType {
+    USER = "USER",
+    USER_GROUP = "USER_GROUP"
+}
 export interface IUser {
+    type: EUserType.USER;
     userId: string;
     account?: string;
     nickname?: string;
     photo?: string;
     [key: string]: unknown;
 }
-export type TUser = IUser[];
+export interface IUserGroup {
+    type: EUserType.USER_GROUP;
+    groupId: string;
+    name: string;
+    parentId: string | null;
+    frontId: string | null;
+}
+export type TUser = Array<IUser | IUserGroup>;
 export interface IGetUserListParams {
     name?: string;
     id?: string;

package/dist/ConfigProvider/getUserList.js

@@ -1,4 +1,9 @@
 import * as React from 'react';
+export var EUserType = /*#__PURE__*/function (EUserType) {
+  EUserType["USER"] = "USER";
+  EUserType["USER_GROUP"] = "USER_GROUP";
+  return EUserType;
+}({});
 var GetUserListContext = /*#__PURE__*/React.createContext({});
 export var SizeContextProvider = function SizeContextProvider(_ref) {
   var children = _ref.children,

package/dist/Icon/components/DragLine.d.ts

@@ -0,0 +1,11 @@
+import type { SVGProps } from 'react';
+import * as React from 'react';
+interface SVGRProps {
+    size?: number;
+    title?: string;
+    titleId?: string;
+    desc?: string;
+    descId?: string;
+}
+declare const Memo: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement> & SVGRProps, "ref"> & React.RefAttributes<SVGSVGElement>>>;
+export default Memo;

package/dist/Icon/components/DragLine.js

@@ -0,0 +1,35 @@
+var _excluded = ["title", "titleId", "desc", "descId"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+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 { forwardRef, memo } from 'react';
+var DragLine = function DragLine(_ref, ref) {
+  var title = _ref.title,
+    titleId = _ref.titleId,
+    desc = _ref.desc,
+    descId = _ref.descId,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: props.width || props.size || 16,
+    height: props.height || props.size || 16,
+    fill: "none",
+    viewBox: "0 0 24 24",
+    ref: ref,
+    "aria-labelledby": titleId,
+    "aria-describedby": descId
+  }, props), desc ? /*#__PURE__*/React.createElement("desc", {
+    id: descId
+  }, desc) : null, title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, /*#__PURE__*/React.createElement("path", {
+    fill: props.color || 'currentColor',
+    fillRule: "evenodd",
+    d: "M9 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2Zm0 12a1 1 0 1 0 0-2 1 1 0 0 0 0 2Zm1-7a1 1 0 1 1-2 0 1 1 0 0 1 2 0Zm5-5a1 1 0 1 0 0-2 1 1 0 0 0 0 2Zm0 12a1 1 0 1 0 0-2 1 1 0 0 0 0 2Zm1-7a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z",
+    clipRule: "evenodd"
+  }));
+};
+var ForwardRef = /*#__PURE__*/forwardRef(DragLine);
+var Memo = /*#__PURE__*/memo(ForwardRef);
+export default Memo;

package/dist/Icon/index.d.ts

@@ -7,6 +7,7 @@ export { default as ChevronLeftLine } from './components/ChevronLeftLine';
 export { default as ChevronRightLine } from './components/ChevronRightLine';
 export { default as CloseLLine } from './components/CloseLLine';
 export { default as CloseMLine } from './components/CloseMLine';
+export { default as DragLine } from './components/DragLine';
 export { default as EyeOffLine } from './components/EyeOffLine';
 export { default as EyeOnLine } from './components/EyeOnLine';
 export { default as FoldDownFill } from './components/FoldDownFill';

package/dist/Icon/index.js

@@ -7,6 +7,7 @@ export { default as ChevronLeftLine } from "./components/ChevronLeftLine";
 export { default as ChevronRightLine } from "./components/ChevronRightLine";
 export { default as CloseLLine } from "./components/CloseLLine";
 export { default as CloseMLine } from "./components/CloseMLine";
+export { default as DragLine } from "./components/DragLine";
 export { default as EyeOffLine } from "./components/EyeOffLine";
 export { default as EyeOnLine } from "./components/EyeOnLine";
 export { default as FoldDownFill } from "./components/FoldDownFill";

package/dist/Icon/svg/drag-line.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="drag-line">
+<path id="Icon" fill-rule="evenodd" clip-rule="evenodd" d="M9 7C9.55228 7 10 6.55228 10 6C10 5.44772 9.55228 5 9 5C8.44772 5 8 5.44772 8 6C8 6.55228 8.44772 7 9 7ZM9 19C9.55228 19 10 18.5523 10 18C10 17.4477 9.55228 17 9 17C8.44772 17 8 17.4477 8 18C8 18.5523 8.44772 19 9 19ZM10 12C10 12.5523 9.55228 13 9 13C8.44772 13 8 12.5523 8 12C8 11.4477 8.44772 11 9 11C9.55228 11 10 11.4477 10 12ZM15 7C15.5523 7 16 6.55228 16 6C16 5.44772 15.5523 5 15 5C14.4477 5 14 5.44772 14 6C14 6.55228 14.4477 7 15 7ZM15 19C15.5523 19 16 18.5523 16 18C16 17.4477 15.5523 17 15 17C14.4477 17 14 17.4477 14 18C14 18.5523 14.4477 19 15 19ZM16 12C16 12.5523 15.5523 13 15 13C14.4477 13 14 12.5523 14 12C14 11.4477 14.4477 11 15 11C15.5523 11 16 11.4477 16 12Z" fill="black"/>
+</g>
+</svg>

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

@@ -3,7 +3,7 @@ import { IUser } from '../interface';
 interface IMemberSelectionProps {
     className?: string;
     userList: IUser[];
-    multiple: boolean;
+    multiple?: boolean;
     onChange: (selected: boolean, user: IUser) => void;
     selectedUsers: IUser[];
     onSearchValueChange?: (value: string) => void;

package/dist/MemberPicker/components/MemberSelection.js

@@ -11,13 +11,14 @@ import Empty from "../../Empty";
 import Input from "../../Input";
 import ScrollArea from "../../ScrollArea";
 import Spin from "../../Spin";
+import { isUser } from "../utils/getUsersWithUserId";
 import MultipleOption from "./MultipleOption";
 import SingleOption from "./SingleOption";
 export default function MemberSelection(props) {
   var className = props.className,
     userList = props.userList,
     multiple = props.multiple,
-    onChange = props.onChange,
+    _onChange = props.onChange,
     selectedUsers = props.selectedUsers,
     onSearchValueChange = props.onSearchValueChange,
     loading = props.loading,
@@ -73,12 +74,16 @@ export default function MemberSelection(props) {
       key: user.userId,
       user: user,
       selected: isSelected,
-      onChange: onChange
+      onChange: function onChange(selected, user) {
+        if (isUser(user)) _onChange(selected, user);
+      }
     }) : /*#__PURE__*/React.createElement(SingleOption, {
       key: user.userId,
       user: user,
       selected: isSelected,
-      onChange: onChange
+      onChange: function onChange(selected, user) {
+        if (isUser(user)) _onChange(selected, user);
+      }
     });
   })))));
 }

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

@@ -1,11 +1,14 @@
 import React from 'react';
+import { IUserGroup } from '../../ConfigProvider/getUserList';
 import { IUser } from '../interface';
 interface IMultipleOptionProps {
     selected: boolean;
     disabled?: boolean;
-    user: IUser;
-    onChange?: (selected: boolean, user: IUser) => void;
+    user: IUser | IUserGroup;
+    onChange?: (selected: boolean, user: IUser | IUserGroup) => void;
     className?: string;
+    onNextLevel?: (userGroup: IUserGroup) => void;
+    hasNextLevel?: boolean;
 }
 export default function MultipleList(params: IMultipleOptionProps): React.JSX.Element;
 export {};

package/dist/MemberPicker/components/MultipleOption.js

@@ -1,18 +1,23 @@
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
 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 Button from "../../Button";
 import Checkbox from "../../Checkbox";
+import { getAccount, getId, getPhoto } from "../utils";
+import { isUserGroup } from "../utils/getUsersWithUserId";
 import NickLabel from "./NickLabel";
 export default function MultipleList(params) {
   var disabled = params.disabled,
     user = params.user,
     selected = params.selected,
     onChange = params.onChange,
-    className = params.className;
+    className = params.className,
+    onNextLevel = params.onNextLevel,
+    _params$hasNextLevel = params.hasNextLevel,
+    hasNextLevel = _params$hasNextLevel === void 0 ? true : _params$hasNextLevel;
   var onClick = function onClick() {
     if (disabled) return;
     onChange === null || onChange === void 0 ? void 0 : onChange(!selected, user);
@@ -20,11 +25,21 @@ export default function MultipleList(params) {
   return /*#__PURE__*/React.createElement("div", {
     className: classnames('ald-member-picker-option', className, _defineProperty({}, 'ald-member-picker-optionDisabled', disabled)),
     onClick: onClick
+  }, /*#__PURE__*/React.createElement("div", {
+    className: 'ald-member-picker-label'
   }, /*#__PURE__*/React.createElement(Checkbox, {
     className: 'ald-member-picker-checkbox',
     checked: selected,
     disabled: disabled
-  }), /*#__PURE__*/React.createElement(NickLabel, _extends({}, user, {
-    src: user.photo
-  })));
+  }), /*#__PURE__*/React.createElement(NickLabel, {
+    id: getId(user),
+    name: user.name,
+    photo: getPhoto(user),
+    account: getAccount(user)
+  })), isUserGroup(user) && hasNextLevel && /*#__PURE__*/React.createElement(Button, {
+    type: "link",
+    onClick: function onClick() {
+      onNextLevel === null || onNextLevel === void 0 ? void 0 : onNextLevel(user);
+    }
+  }, "\u4E0B\u7EA7"));
 }

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

@@ -1,8 +1,8 @@
 import React from 'react';
 interface INickLabelProps {
-    nickname?: string;
-    userId: string;
-    src?: string;
+    name?: string;
+    id: string;
+    photo?: React.ReactNode;
     account?: string;
 }
 declare const _default: React.NamedExoticComponent<INickLabelProps>;

package/dist/MemberPicker/components/NickLabel.js

@@ -1,20 +1,20 @@
 import React, { memo } from 'react';
 import Avatar from "../../Avatar";
 var NickLabel = function NickLabel(_ref) {
-  var src = _ref.src,
-    nickname = _ref.nickname,
-    userId = _ref.userId,
+  var photo = _ref.photo,
+    name = _ref.name,
+    id = _ref.id,
     account = _ref.account;
-  var innerName = nickname || userId;
+  var innerName = name || id;
   return /*#__PURE__*/React.createElement("div", {
     className: "ald-member-picker-nick-label"
   }, /*#__PURE__*/React.createElement(Avatar, {
     key: innerName,
-    src: src,
+    src: photo,
     size: 20
   }, innerName), /*#__PURE__*/React.createElement("div", {
     className: "ald-member-picker-nick-label-name",
-    title: "".concat(nickname, "(").concat(account, ")")
+    title: "".concat(name, "(").concat(account, ")")
   }, innerName));
 };
 export default /*#__PURE__*/memo(NickLabel);

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

@@ -1,14 +1,17 @@
+import { IUserGroup, TUser } from "../../ConfigProvider/getUserList";
 import React from 'react';
-import { IUser } from '../interface';
+import { EMemberPicker, IUser } from '../interface';
 interface IPanelProps {
+    type: EMemberPicker;
     multiple?: boolean;
-    onChange?: (value: IUser[]) => void;
+    onChange?: (value: TUser) => void;
     dropdownWidth?: number;
-    value?: IUser[] | IUser;
-    userList: IUser[];
+    value?: TUser | (IUser | IUserGroup);
+    dataList: TUser;
     onSearchValueChange?: (value: string) => void;
     onCancel?: () => void;
     loading: boolean;
+    className?: string;
 }
 export default function Panel(props: IPanelProps): React.JSX.Element;
 export {};

package/dist/MemberPicker/components/Panel.js

@@ -14,17 +14,24 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import classNames from 'classnames';
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import Tabs from "../../Tabs";
+import { EMemberPicker } from "../interface";
+import { getId } from "../utils";
+import { isUser, isUserGroup } from "../utils/getUsersWithUserId";
 import MemberSelection from "./MemberSelection";
 import SelectedMemberTags from "./SelectedMemberTags";
 import SelectorFooter from "./SelectorFooter";
+import UserGroupSelection from "./UserGroupSelection";
 export default function Panel(props) {
   var _classNames;
-  var multiple = props.multiple,
+  var type = props.type,
+    multiple = props.multiple,
     dropdownWidth = props.dropdownWidth,
     value = props.value,
     onChange = props.onChange,
-    userList = props.userList,
-    onSearchValueChange = props.onSearchValueChange;
+    dataList = props.dataList,
+    onSearchValueChange = props.onSearchValueChange,
+    className = props.className;
   var _useState = useState([]),
     _useState2 = _slicedToArray(_useState, 2),
     selectedUsers = _useState2[0],
@@ -35,7 +42,7 @@ export default function Panel(props) {
         setSelected([].concat(_toConsumableArray(selectedUsers), [user]));
       } else {
         setSelected(selectedUsers.filter(function (item) {
-          return item.userId !== user.userId;
+          return getId(item) !== getId(user);
         }));
       }
     } else {
@@ -50,7 +57,7 @@ export default function Panel(props) {
   }, [multiple, selectedUsers, onChange]);
   var onRemove = useCallback(function (user) {
     setSelected(selectedUsers.filter(function (item) {
-      return item.userId !== user.userId;
+      return getId(item) !== getId(user);
     }));
   }, [selectedUsers]);
   var panelWidth = useMemo(function () {
@@ -74,21 +81,55 @@ export default function Panel(props) {
       }
     }
   }, [setSelected, value]);
+  var renderDropdown = useCallback(function () {
+    var userSelection = /*#__PURE__*/React.createElement(MemberSelection, {
+      className: 'ald-member-picker-member-selection-multiple',
+      userList: dataList.filter(isUser),
+      width: (panelWidth - 3) / 2,
+      selectedUsers: selectedUsers.filter(isUser),
+      onChange: onSelectionChange,
+      onSearchValueChange: onSearchValueChange,
+      multiple: true,
+      loading: props.loading
+    });
+    var userGroupSelection = /*#__PURE__*/React.createElement(UserGroupSelection, {
+      className: 'ald-member-picker-member-selection-multiple',
+      userGroupList: dataList.filter(isUserGroup),
+      width: (panelWidth - 3) / 2,
+      selectedUsersGroup: selectedUsers.filter(isUserGroup),
+      onChange: onSelectionChange,
+      onSearchValueChange: onSearchValueChange,
+      multiple: true,
+      loading: props.loading
+    });
+    if (type === EMemberPicker.USER) {
+      return userSelection;
+    }
+    if (type === EMemberPicker.GROUP) {
+      return userGroupSelection;
+    }
+    if (type === EMemberPicker.BOTH) {
+      return /*#__PURE__*/React.createElement(Tabs, {
+        centered: true,
+        items: [{
+          key: 'user',
+          label: '用户',
+          children: userSelection
+        }, {
+          key: 'userGroup',
+          label: '用户组',
+          children: userGroupSelection
+        }],
+        className: "ald-member-tabs"
+      });
+    }
+  }, [onSearchValueChange, onSelectionChange, panelWidth, props.loading, selectedUsers, type, dataList]);
   return /*#__PURE__*/React.createElement("div", {
-    className: classNames('ald-member-picker-wrapper', (_classNames = {}, _defineProperty(_classNames, 'ald-member-picker-multiple', multiple), _defineProperty(_classNames, 'ald-member-picker-single', !multiple), _classNames)),
+    className: classNames(className, 'ald-member-picker-wrapper', (_classNames = {}, _defineProperty(_classNames, 'ald-member-picker-multiple', multiple), _defineProperty(_classNames, 'ald-member-picker-single', !multiple), _classNames)),
     style: {
       width: panelWidth
     }
-  }, multiple ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(MemberSelection, {
-    className: 'ald-member-picker-member-selection-multiple',
-    userList: userList,
-    width: (panelWidth - 3) / 2,
-    selectedUsers: selectedUsers,
-    onChange: onSelectionChange,
-    onSearchValueChange: onSearchValueChange,
-    multiple: multiple,
-    loading: props.loading
-  }), /*#__PURE__*/React.createElement(SelectedMemberTags, {
+  }, multiple ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, renderDropdown()), /*#__PURE__*/React.createElement(SelectedMemberTags, {
     className: 'ald-member-picker-selected-member-tags',
     selectedUsers: selectedUsers,
     width: (panelWidth - 3) / 2,
@@ -97,14 +138,23 @@ export default function Panel(props) {
     className: 'ald-member-picker-selector-footer',
     onCancel: props.onCancel,
     onOk: onOk
-  })) : /*#__PURE__*/React.createElement(MemberSelection, {
+  })) : /*#__PURE__*/React.createElement(React.Fragment, null, type === EMemberPicker.USER && /*#__PURE__*/React.createElement(MemberSelection, {
     className: 'ald-member-picker-member-selection-single',
-    userList: userList,
+    userList: dataList.filter(isUser),
     width: panelWidth - 2,
     onChange: onSelectionChange,
-    selectedUsers: selectedUsers,
+    selectedUsers: selectedUsers.filter(isUser),
     onSearchValueChange: onSearchValueChange,
     multiple: false && multiple,
     loading: props.loading
-  }));
+  }), type === EMemberPicker.GROUP && /*#__PURE__*/React.createElement(UserGroupSelection, {
+    className: 'ald-member-picker-member-selection-multiple',
+    userGroupList: dataList.filter(isUserGroup),
+    width: (panelWidth - 3) / 2,
+    selectedUsersGroup: selectedUsers.filter(isUserGroup),
+    onChange: onSelectionChange,
+    onSearchValueChange: onSearchValueChange,
+    multiple: false,
+    loading: props.loading
+  })));
 }

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

@@ -0,0 +1,14 @@
+import { IUserGroup, TUser } from "../../ConfigProvider/getUserList";
+import React from 'react';
+import { EMemberPicker, IUser, MemberPickerValue } from '../interface';
+interface IProps {
+    type: EMemberPicker;
+    multiple?: boolean;
+    onChange?(v: TUser | (IUser | IUserGroup)): void;
+    dropdownWidth?: number;
+    value?: MemberPickerValue;
+    className?: string;
+    onCancel?: () => void;
+}
+export declare const PanelWrapper: ({ type, value, multiple, dropdownWidth, onChange, onCancel, className, }: IProps) => React.JSX.Element;
+export default PanelWrapper;

package/dist/MemberPicker/components/PanelWrapper.js

@@ -0,0 +1,126 @@
+function _objectDestructuringEmpty(obj) { if (obj == null) throw new TypeError("Cannot destructure " + obj); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { message } from "../..";
+import ConfigProvider from "../../ConfigProvider";
+import { useRequest } from 'ahooks';
+import _ from 'lodash';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { isUser, isUserGroup } from "../utils/getUsersWithUserId";
+import Panel from "./Panel";
+export var PanelWrapper = function PanelWrapper(_ref) {
+  var type = _ref.type,
+    value = _ref.value,
+    multiple = _ref.multiple,
+    dropdownWidth = _ref.dropdownWidth,
+    onChange = _ref.onChange,
+    onCancel = _ref.onCancel,
+    className = _ref.className;
+  var _ConfigProvider$useGe = ConfigProvider.useGetUserList(),
+    getUsersByIds = _ConfigProvider$useGe.getUsersByIds,
+    getUsersByKeywords = _ConfigProvider$useGe.getUsersByKeywords;
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedUserList = _useState2[0],
+    setSelectedUserList = _useState2[1];
+  var _useState3 = useState([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    searchUserList = _useState4[0],
+    setSearchUserList = _useState4[1];
+  var _useState5 = useState(''),
+    _useState6 = _slicedToArray(_useState5, 2),
+    searchString = _useState6[0],
+    setSearchString = _useState6[1];
+  var onSearchValueChange = useCallback(function (v) {
+    setSearchString(v);
+  }, []);
+  var queryByKeywords = useMemo(function () {
+    if (getUsersByKeywords) {
+      return getUsersByKeywords;
+    }
+    return function (_ref2) {
+      _objectDestructuringEmpty(_ref2);
+      return Promise.reject({
+        message: '请在ConfigProvider中配置getUsersByKeywords方法'
+      });
+    };
+  }, [getUsersByKeywords]);
+  var queryByIds = useMemo(function () {
+    if (getUsersByIds) {
+      return getUsersByIds;
+    }
+    return function (_ref3) {
+      _objectDestructuringEmpty(_ref3);
+      return Promise.reject({
+        message: '请在ConfigProvider中配置getUsersByIds方法'
+      });
+    };
+  }, [getUsersByIds]);
+  var _useRequest = useRequest(function () {
+      return queryByKeywords(searchString);
+    }, {
+      refreshDeps: [searchString],
+      manual: true,
+      cacheKey: 'member-selector',
+      cacheTime: 1000 * 60 * 2,
+      // 2分钟内不重复请求
+      onSuccess: function onSuccess(result) {
+        setSearchUserList(result);
+      },
+      onError: function onError(error) {
+        message.error(error.message);
+      }
+    }),
+    loading = _useRequest.loading,
+    run = _useRequest.run;
+  var totalUserList = useMemo(function () {
+    var totalUsers = searchUserList.concat(selectedUserList);
+    return _.uniqBy(totalUsers, 'userId');
+  }, [searchUserList, selectedUserList]);
+  useEffect(function () {
+    run();
+  }, [run, searchString]);
+  useEffect(function () {
+    if (Array.isArray(value) && (isUser(value[0]) || isUserGroup(value[0]))) {
+      setSelectedUserList(value);
+    } else if (isUser(value) || isUserGroup(value)) {
+      setSelectedUserList([value]);
+    } else {
+      var id = [];
+      if (!value) return;
+      if (Array.isArray(value) && value.length === 0) return;
+      if (!Array.isArray(value)) {
+        id = [value];
+      } else {
+        id = value;
+      }
+      queryByIds(id).then(function (result) {
+        setSelectedUserList(result);
+      });
+    }
+  }, [value, queryByIds]);
+  var onSelectedChange = useCallback(function (users) {
+    if (multiple) {
+      onChange === null || onChange === void 0 ? void 0 : onChange(users);
+    } else {
+      onChange === null || onChange === void 0 ? void 0 : onChange(users[0]);
+    }
+  }, [multiple, onChange]);
+  return /*#__PURE__*/React.createElement(Panel, {
+    type: type,
+    value: selectedUserList,
+    dataList: totalUserList,
+    multiple: multiple,
+    loading: loading,
+    dropdownWidth: dropdownWidth,
+    onSearchValueChange: onSearchValueChange,
+    onChange: onSelectedChange,
+    className: className,
+    onCancel: onCancel
+  });
+};
+export default PanelWrapper;

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

@@ -1,9 +1,10 @@
 import React from 'react';
+import { IUserGroup, TUser } from '../../ConfigProvider/getUserList';
 import { IUser } from '../interface';
 interface ISelectedMemberTagsProps {
     className?: string;
-    selectedUsers: IUser[];
-    onRemove?: (user: IUser) => void;
+    selectedUsers: TUser;
+    onRemove?: (user: IUser | IUserGroup) => void;
     width: number;
 }
 export default function SelectedMemberTags(props: ISelectedMemberTagsProps): React.JSX.Element;