@aloudata/aloudata-design 1.10.6 → 1.10.8

package/dist/ConfigProvider/getUserList.d.ts

@@ -9,6 +9,7 @@ export interface IUser {
     account?: string;
     nickname?: string;
     photo?: string;
+    name: string;
     [key: string]: unknown;
 }
 export interface IUserGroup {

package/dist/MemberPicker/components/MemberSelection.js

@@ -54,7 +54,8 @@ export default function MemberSelection(props) {
   }), /*#__PURE__*/React.createElement(Spin, {
     tip: "Loading",
     spinning: loading,
-    size: "small"
+    size: "small",
+    className: "ald-member-picker-user-list"
   }, /*#__PURE__*/React.createElement(ScrollArea, {
     className: classNames('ald-member-picker-member-list', {
       'ald-member-picker-member-list-null': userList.length === 0 && !loading

package/dist/MemberPicker/components/MultipleOption.js

@@ -38,6 +38,7 @@ export default function MultipleList(params) {
     account: getAccount(user)
   })), isUserGroup(user) && hasNextLevel && /*#__PURE__*/React.createElement(Button, {
     type: "link",
+    className: "ald-member-picker-btn",
     onClick: function onClick(e) {
       onNextLevel === null || onNextLevel === void 0 ? void 0 : onNextLevel(user);
       e.stopPropagation();

package/dist/MemberPicker/components/NickLabel.js

@@ -14,7 +14,7 @@ var NickLabel = function NickLabel(_ref) {
     size: 20
   }, innerName), /*#__PURE__*/React.createElement("div", {
     className: "ald-member-picker-nick-label-name",
-    title: "".concat(name, "(").concat(account, ")")
+    title: account ? "".concat(name, "(").concat(account, ")") : "".concat(name)
   }, innerName));
 };
 export default /*#__PURE__*/memo(NickLabel);

package/dist/MemberPicker/components/Panel.js

@@ -111,6 +111,7 @@ export default function Panel(props) {
     if (type === EMemberPicker.BOTH) {
       return /*#__PURE__*/React.createElement(Tabs, {
         centered: true,
+        destroyInactiveTabPane: true,
         items: [{
           key: 'user',
           label: '用户',

package/dist/MemberPicker/components/PanelWrapper.js

@@ -96,7 +96,10 @@ export var PanelWrapper = function PanelWrapper(_ref) {
     } else {
       var id = [];
       if (!value) return;
-      if (Array.isArray(value) && value.length === 0) return;
+      if (Array.isArray(value) && value.length === 0) {
+        setSelectedUserList([]);
+        return;
+      }
       if (!Array.isArray(value)) {
         id = [value];
       } else {

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

@@ -10,5 +10,5 @@ interface IProps {
     onSearchValueChange?: (value: string) => void;
     width: number;
 }
-declare const UserGroupSelection: ({ className, userGroupList, multiple, onChange, selectedUsersGroup: selectedUsersGroups, onSearchValueChange, loading, width, }: IProps) => React.JSX.Element;
+declare const UserGroupSelection: ({ className, userGroupList, multiple, onChange, selectedUsersGroup: selectedUsersGroups, loading, width, }: IProps) => React.JSX.Element;
 export default UserGroupSelection;

package/dist/MemberPicker/components/UserGroupSelection.js

@@ -1,7 +1,3 @@
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 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); }
@@ -11,9 +7,9 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { Breadcrumb } from 'antd';
 import classNames from 'classnames';
 import _ from 'lodash';
-import React, { useDeferredValue, useEffect, useState } from 'react';
+import React, { useState } from 'react';
 import Empty from "../../Empty";
-import { SearchLine } from "../../Icon";
+import { ChevronLeftLine, SearchLine } from "../../Icon";
 import Input from "../../Input";
 import ScrollArea from "../../ScrollArea";
 import Spin from "../../Spin";
@@ -26,7 +22,6 @@ var UserGroupSelection = function UserGroupSelection(_ref) {
     multiple = _ref.multiple,
     _onChange = _ref.onChange,
     selectedUsersGroups = _ref.selectedUsersGroup,
-    onSearchValueChange = _ref.onSearchValueChange,
     loading = _ref.loading,
     width = _ref.width;
   var _useState = useState(''),
@@ -37,14 +32,28 @@ var UserGroupSelection = function UserGroupSelection(_ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     groupPath = _useState4[0],
     setGroupPath = _useState4[1];
-  var deferredSearchValue = useDeferredValue(searchKey);
-  useEffect(function () {
-    onSearchValueChange === null || onSearchValueChange === void 0 ? void 0 : onSearchValueChange(deferredSearchValue);
-  }, [deferredSearchValue, onSearchValueChange]);
-  var userGroupListInLevel = userGroupList.filter(function (userGroup) {
+  var filterUserList = (!!searchKey ? userGroupList : userGroupList.filter(function (userGroup) {
     var _$last;
     if (groupPath.length === 0) return !userGroup.parentId;else return userGroup.parentId === ((_$last = _.last(groupPath)) === null || _$last === void 0 ? void 0 : _$last.groupId);
+  })).filter(function (group) {
+    return group.name.toLowerCase().includes(searchKey.trim().toLowerCase());
   });
+  var getPath = function getPath(group) {
+    var thisGroup = group;
+    var result = [_.cloneDeep(thisGroup)];
+    while (thisGroup.parentId) {
+      var tempGroup = userGroupList.find(
+      // eslint-disable-next-line @typescript-eslint/no-loop-func
+      function (userGroup) {
+        return userGroup.groupId === thisGroup.parentId;
+      });
+      if (tempGroup) {
+        result.push(tempGroup);
+        thisGroup = tempGroup;
+      } else break;
+    }
+    return result.reverse();
+  };
   return /*#__PURE__*/React.createElement("div", {
     className: classNames(className, 'ald-member-picker-member-list-wrap')
   }, /*#__PURE__*/React.createElement(Input, {
@@ -53,6 +62,7 @@ var UserGroupSelection = function UserGroupSelection(_ref) {
     }),
     className: 'ald-member-picker-search-input',
     autoFocus: true,
+    value: searchKey,
     onChange: function onChange(e) {
       setSearchKey(e.target.value);
     }
@@ -62,13 +72,21 @@ var UserGroupSelection = function UserGroupSelection(_ref) {
     image: Empty.PRESENTED_IMAGE_SEARCH,
     className: "ald-member-picker-member-list-empty"
   }), groupPath.length !== 0 && /*#__PURE__*/React.createElement(ScrollArea, {
-    className: "ald-member-picker-breadcurmb"
-  }, /*#__PURE__*/React.createElement(Breadcrumb, null, /*#__PURE__*/React.createElement(Breadcrumb.Item, {
+    className: "ald-member-picker-breadcrumb-scroll"
+  }, /*#__PURE__*/React.createElement(Breadcrumb, {
+    className: "ald-member-picker-breadcrumb"
+  }, /*#__PURE__*/React.createElement(Breadcrumb.Item, {
+    className: "ald-member-picker-breadcrumb-item",
     onClick: function onClick() {
       setGroupPath([]);
     }
-  }, "\u7528\u6237\u7EC4"), groupPath.map(function (group) {
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "ald-member-picker-breadcrumb-item-inner"
+  }, /*#__PURE__*/React.createElement(ChevronLeftLine, {
+    size: 16
+  }), "\u7528\u6237\u7EC4")), groupPath.map(function (group) {
     return /*#__PURE__*/React.createElement(Breadcrumb.Item, {
+      className: "ald-member-picker-breadcrumb-item",
       key: group.groupId,
       onClick: function onClick() {
         setGroupPath(function (groups) {
@@ -80,11 +98,14 @@ var UserGroupSelection = function UserGroupSelection(_ref) {
           });
         });
       }
-    }, group.name);
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "ald-member-picker-breadcrumb-item-inner"
+    }, group.name));
   }))), /*#__PURE__*/React.createElement(Spin, {
     tip: "Loading",
     spinning: loading,
-    size: "small"
+    size: "small",
+    className: "ald-member-picker-user-list"
   }, /*#__PURE__*/React.createElement(ScrollArea, {
     className: classNames('ald-member-picker-member-list', {
       'ald-member-picker-member-list-null': userGroupList.length === 0 && !loading
@@ -96,7 +117,7 @@ var UserGroupSelection = function UserGroupSelection(_ref) {
       width: width,
       overflow: 'hidden'
     }
-  }, userGroupListInLevel.map(function (userGroup) {
+  }, filterUserList.map(function (userGroup) {
     var isSelected = selectedUsersGroups.some(function (selectUserGroup) {
       return selectUserGroup.groupId === userGroup.groupId;
     });
@@ -113,9 +134,8 @@ var UserGroupSelection = function UserGroupSelection(_ref) {
         return group.parentId === userGroup.groupId;
       }),
       onNextLevel: function onNextLevel(userGroup) {
-        setGroupPath(function (groupPath) {
-          return [].concat(_toConsumableArray(groupPath), [userGroup]);
-        });
+        setGroupPath(getPath(userGroup));
+        setSearchKey('');
       }
     }) : /*#__PURE__*/React.createElement(SingleOption, {
       key: userGroup.groupId,

package/dist/MemberPicker/index.js

@@ -105,12 +105,15 @@ var Component = function Component(_ref) {
     loading = _useRequest.loading,
     run = _useRequest.run;
   var totalUserList = useMemo(function () {
-    var totalUsers = searchUserList.concat(selectedUserList);
+    var totalUsers = searchUserList.concat(selectedUserList.filter(function (item) {
+      var name = (item.type === EUserType.USER ? item.nickname : item.name) || '';
+      return name.toUpperCase().includes(searchString.trim().toUpperCase());
+    }));
     return _.uniqBy(totalUsers, function (data) {
       if (data.type === EUserType.USER) return data.userId;
       return data.groupId;
     });
-  }, [searchUserList, selectedUserList]);
+  }, [searchString, searchUserList, selectedUserList]);
   useEffect(function () {
     if (!dropdownOpen) return;
     run();
@@ -123,7 +126,10 @@ var Component = function Component(_ref) {
     } else {
       var id = [];
       if (!value) return;
-      if (Array.isArray(value) && value.length === 0) return;
+      if (Array.isArray(value) && value.length === 0) {
+        setSelectedUserList([]);
+        return;
+      }
       if (!Array.isArray(value)) {
         id = [value];
       } else {

package/dist/MemberPicker/style/index.less

@@ -7,6 +7,8 @@
 @import '../../message/style/index.less';
 @import '../../Spin/style/index.less';
 
+@btnWidth: 30px;
+
 .ald-member-picker-wrapper {
   box-sizing: border-box;
   border: 1px solid var(--colors-gray-400, #dbdbdb);
@@ -36,6 +38,9 @@
 
 .ald-member-picker-member-list-wrap {
   &.ald-member-picker-member-selection-multiple {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
     width: 100%;
   }
 
@@ -47,27 +52,31 @@
     border: none;
     border-bottom: 1px solid var(--colors-gray-300, #e8e8e8);
     border-radius: 0;
+    flex: 0 0 32px;
 
     &.ant-input-affix-wrapper-focused {
       border-color: #dbdbdb;
     }
   }
 
+  .ald-member-picker-breadcrumb-scroll {
+    flex: 0 0 40px;
+  }
+
+  .ald-member-picker-user-list {
+    flex: 1;
+  }
+
   .ald-member-picker-member-list-empty {
     min-height: 180px;
   }
 
   .ald-member-picker-member-list {
-    height: calc(100% - 64px);
-    min-height: 180px;
+    height: 200px;
 
     &.ald-member-picker-member-list-null {
       display: none;
     }
-
-    .ald-member-picker-member-scroll {
-      height: 240px;
-    }
   }
 }
 
@@ -137,6 +146,7 @@
   justify-content: space-between;
 
   .ald-member-picker-label {
+    flex: 1;
     display: flex;
     gap: 4px;
   }
@@ -236,14 +246,56 @@
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
+    max-width: 140px;
   }
 }
 
 .ald-member-tabs {
   background-color: #fff;
   height: 100%;
+  width: 100%;
 
   .ant-tabs-nav {
     margin-bottom: 0 !important;
   }
 }
+
+.ald-member-picker-btn {
+  flex: 0 0 @btnWidth;
+}
+
+.ald-member-picker-breadcrumb-item {
+  cursor: pointer;
+  overflow-x: hidden;
+}
+
+.ant-breadcrumb.ald-member-picker-breadcrumb[class] {
+  height: 40px;
+  padding: 0 8px;
+  line-height: 40px;
+  border-bottom: 1px solid #e8e8e8;
+
+  &.ant-breadcrumb ol {
+    display: flex;
+    flex-wrap: nowrap;
+    height: 40px;
+    white-space: nowrap;
+
+    & li {
+      display: inline-block;
+      height: 40px;
+    }
+  }
+}
+
+.ald-member-picker-header-wrapper {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  gap: 2px;
+}
+
+.ald-member-picker-breadcrumb-item-inner {
+  display: flex;
+  align-items: center;
+}

package/dist/Switch/index.js

@@ -32,10 +32,10 @@ var Switch = function Switch(_ref) {
   var disabled = React.useContext(DisabledContext);
   var mergedDisabled = customDisabled !== null && customDisabled !== void 0 ? customDisabled : disabled;
   var onChangeCB = function onChangeCB(isChecked, event) {
-    setUserChecked(isChecked);
-    if (typeof onChange === 'function') {
-      onChange(isChecked, event);
+    if (checked === undefined) {
+      setUserChecked(isChecked);
     }
+    if (typeof onChange === 'function') onChange(isChecked, event);
   };
   var currentDisabled = loading ? true : mergedDisabled;
   useEffect(function () {

package/dist/Table/components/Pagination/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { ITableProps } from '../../types';
+export default function TablePagination<TDataItem extends object>(props: IProps<TDataItem>): React.JSX.Element | undefined;
+interface IProps<TDataItem extends object> {
+    pagination?: ITableProps<TDataItem>['pagination'];
+    scroll?: ITableProps<TDataItem>['scroll'];
+    scrollToFirstRow: () => void;
+}
+export {};

package/dist/Table/components/Pagination/index.js

@@ -0,0 +1,26 @@
+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); }
+import React, { useCallback } from 'react';
+import { Pagination } from "../../..";
+import { prefixCls } from "../../helper";
+export default function TablePagination(props) {
+  var pagination = props.pagination,
+    _props$scroll = props.scroll,
+    scroll = _props$scroll === void 0 ? {} : _props$scroll,
+    scrollToFirstRow = props.scrollToFirstRow;
+  var onChangePage = useCallback(function (page) {
+    var _ref = pagination || {},
+      _ref$onChange = _ref.onChange,
+      onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange;
+    var _scroll$scrollToFirst = scroll.scrollToFirstRowOnChange,
+      scrollToFirstRowOnChange = _scroll$scrollToFirst === void 0 ? true : _scroll$scrollToFirst;
+    if (scrollToFirstRowOnChange) {
+      scrollToFirstRow();
+    }
+    onChange(page);
+  }, [scrollToFirstRow, scroll, pagination]);
+  return pagination && /*#__PURE__*/React.createElement("div", {
+    className: prefixCls('pagination')
+  }, /*#__PURE__*/React.createElement(Pagination, _extends({}, pagination, {
+    onChange: onChangePage
+  })));
+}

package/dist/Table/index.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { ITableProps } from './types';
-declare function Table<TDataItem extends object>(props: ITableProps<TDataItem>): React.JSX.Element;
-export default Table;
+import { ITableProps, ITableRef } from './types';
+declare const _default: React.ForwardRefExoticComponent<ITableProps<object> & React.RefAttributes<ITableRef>>;
+export default _default;

package/dist/Table/index.js

@@ -12,13 +12,14 @@ import { flexRender, getCoreRowModel, useReactTable } from '@tanstack/react-tabl
 import classnames from 'classnames';
 import _ from 'lodash';
 import ResizeObserver from 'rc-resize-observer';
-import React, { useMemo, useState } from 'react';
-import { Empty, Pagination, ScrollArea, Spin } from '..';
+import React, { forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState } from 'react';
+import { Empty, ScrollArea, Spin } from '..';
+import Pagination from "./components/Pagination";
 import { getTableColumns, prefixCls } from "./helper";
 import useScrollX from "./hooks/useScroll";
 // 32 行高 + 1 底线高度
 var HEADER_HEIGHT = 33;
-function Table(props) {
+function Table(props, ref) {
   var _classnames;
   var columns = props.columns,
     data = props.data,
@@ -38,6 +39,7 @@ function Table(props) {
     _useState2 = _slicedToArray(_useState, 2),
     totalSize = _useState2[0],
     setTotalSize = _useState2[1];
+  var tableBodyRef = useRef(null);
   var y = scroll.y;
   var _useScrollX = useScrollX({
       totalSize: totalSize,
@@ -46,6 +48,17 @@ function Table(props) {
     realWidth = _useScrollX.realWidth,
     onBodyScroll = _useScrollX.onBodyScroll,
     headerRef = _useScrollX.headerRef;
+  var scrollToFirstRow = useCallback(function () {
+    if (!tableBodyRef.current) {
+      return;
+    }
+    tableBodyRef.current.scrollTop = 0;
+  }, []);
+  useImperativeHandle(ref, function () {
+    return {
+      scrollToFirstRow: scrollToFirstRow
+    };
+  });
   var tableColumns = useMemo(function () {
     if (!totalSize || !realWidth) {
       return [];
@@ -146,11 +159,13 @@ function Table(props) {
     },
     className: prefixCls('body-scroll')
   }, /*#__PURE__*/React.createElement(ScrollArea, {
-    onViewportScroll: onBodyScroll
+    onViewportScroll: onBodyScroll,
+    ref: tableBodyRef
   }, bodyContent))) : /*#__PURE__*/React.createElement("div", {
     className: prefixCls('content')
   }, headerContent, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ScrollArea, {
-    onViewportScroll: onBodyScroll
+    onViewportScroll: onBodyScroll,
+    ref: tableBodyRef
   }, bodyContent)));
   var tableStyle = {};
   if (y) {
@@ -170,8 +185,10 @@ function Table(props) {
     }
   }, /*#__PURE__*/React.createElement("div", {
     className: classnames(prefixCls('main'), _defineProperty({}, prefixCls('overflow-hidden'), !!y))
-  }, tableContent)), pagination && /*#__PURE__*/React.createElement("div", {
-    className: prefixCls('pagination')
-  }, /*#__PURE__*/React.createElement(Pagination, pagination)));
+  }, tableContent)), /*#__PURE__*/React.createElement(Pagination, {
+    pagination: pagination,
+    scroll: scroll,
+    scrollToFirstRow: scrollToFirstRow
+  }));
 }
-export default Table;
+export default /*#__PURE__*/forwardRef(Table);

package/dist/Table/types.d.ts

@@ -14,9 +14,13 @@ export interface ITableProps<TDataItem extends object> {
     empty?: React.ReactNode;
     rowClassName?: (record: TDataItem, index: number) => string;
 }
+export interface ITableRef {
+    scrollToFirstRow: () => void;
+}
 export interface IScroll {
     x?: number | string;
     y?: number | string;
+    scrollToFirstRowOnChange?: boolean;
 }
 export interface ITableColumn<TDataItem = unknown> {
     title: string | React.ReactNode;

package/dist/Tree/style/index.less

@@ -19,10 +19,10 @@
   .antTreeFn(@tree-prefix-cls);
 }
 
-.ald-tree.draggable-tree {
+.ald-tree {
   padding: 3px 0;
 
-  .ald-tree-treenode {
+  .ald-tree-treenode.ald-tree-treenode-draggable {
     .ald-tree-draggable-icon {
       opacity: 1;
     }

package/dist/index.d.ts

@@ -78,7 +78,7 @@ export type { IStepProps as StepProps, IStepsProps as StepsProps, } from './Step
 export { default as Switch } from './Switch';
 export type { ISwitchProps as SwitchProps } from './Switch';
 export { default as Table } from './Table';
-export type { ITableColumn, ITableProps } from './Table/types';
+export type { ITableColumn, ITableProps, ITableRef } from './Table/types';
 export { default as Tabs } from './Tabs';
 export type { ITabsProps as TabsProps, TabsSize } from './Tabs';
 export { default as Tag } from './Tag';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aloudata/aloudata-design",
-  "version": "1.10.6",
+  "version": "1.10.8",
   "description": "",
   "license": "MIT",
   "module": "dist/index.js",