@lemon-fe/components 1.2.3 → 1.2.6

package/es/actions/index.d.ts

@@ -17,7 +17,7 @@ interface ActionBtn extends ButtonProps {
         disabled?: boolean;
     } | ReactElement | null)[] | ReactElement;
 }
-interface Props {
+export interface ActionsProps {
     actions: (ActionBtn | ReactElement | null)[];
     style?: CSSProperties;
     className?: string;
@@ -27,6 +27,10 @@ interface Props {
      */
     maxShowCount?: number;
     trackEventAttr?: string;
+    /**
+     * @description 默认按钮类型
+     */
+    defaultButtonType?: ButtonProps['type'];
 }
-declare function Actions(props: Props): JSX.Element;
+declare function Actions(props: ActionsProps): JSX.Element;
 export default Actions;

package/es/actions/index.js

@@ -1,34 +1,40 @@
+var _excluded = ["dropDown", "text", "onClick", "action", "label", "type"];
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["dropDown", "text", "onClick", "action", "label"];
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 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; }
-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(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { Space, Dropdown, Menu, Button, Popover } from 'antd';
-import React, { Fragment, useState, isValidElement } from 'react';
+import React, { Fragment, useState, isValidElement, useContext } from 'react';
 import classNames from 'classnames';
+import { ComponentConfigureContext } from "../component-configure";
 import { PREFIX_CLS } from "../constants";
 import Icons from "../icons";
 function Actions(props) {
-  var actions = props.actions,
-    className = props.className,
-    style = props.style,
-    _props$prefixCls = props.prefixCls,
-    prefixCls = _props$prefixCls === void 0 ? PREFIX_CLS : _props$prefixCls,
-    _props$maxShowCount = props.maxShowCount,
-    maxShowCount = _props$maxShowCount === void 0 ? Infinity : _props$maxShowCount,
-    _props$trackEventAttr = props.trackEventAttr,
-    trackEventAttr = _props$trackEventAttr === void 0 ? 'data-track-event' : _props$trackEventAttr;
+  var _useContext = useContext(ComponentConfigureContext),
+    defaultActionsProps = _useContext.Actions;
+  var _defaultActionsProps$ = _objectSpread(_objectSpread({}, defaultActionsProps), props),
+    actions = _defaultActionsProps$.actions,
+    className = _defaultActionsProps$.className,
+    style = _defaultActionsProps$.style,
+    _defaultActionsProps$2 = _defaultActionsProps$.prefixCls,
+    prefixCls = _defaultActionsProps$2 === void 0 ? PREFIX_CLS : _defaultActionsProps$2,
+    _defaultActionsProps$3 = _defaultActionsProps$.maxShowCount,
+    maxShowCount = _defaultActionsProps$3 === void 0 ? Infinity : _defaultActionsProps$3,
+    _defaultActionsProps$4 = _defaultActionsProps$.trackEventAttr,
+    trackEventAttr = _defaultActionsProps$4 === void 0 ? 'data-track-event' : _defaultActionsProps$4,
+    _defaultActionsProps$5 = _defaultActionsProps$.defaultButtonType,
+    defaultButtonType = _defaultActionsProps$5 === void 0 ? 'primary' : _defaultActionsProps$5;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     visible = _useState2[0],
@@ -61,6 +67,8 @@ function Actions(props) {
       onClick = item.onClick,
       action = item.action,
       label = item.label,
+      _item$type = item.type,
+      buttonType = _item$type === void 0 ? defaultButtonType : _item$type,
       rest = _objectWithoutProperties(item, _excluded);
     var trackAttr = getTrackAttr(text);
     if ( /*#__PURE__*/isValidElement(text)) {
@@ -108,13 +116,14 @@ function Actions(props) {
           overlayStyle: {
             minWidth: 80
           },
+          type: buttonType,
           buttonsRender: function buttonsRender(_ref2) {
             var _ref3 = _slicedToArray(_ref2, 1),
               leftBtn = _ref3[0];
             return [leftBtn, /*#__PURE__*/React.createElement(Button, {
               icon: /*#__PURE__*/React.createElement(Icons.More, null),
-              type: rest.type,
-              key: "more"
+              key: "more",
+              type: buttonType
             })];
           }
         }, rest), /*#__PURE__*/React.createElement("span", trackAttr, text));
@@ -124,7 +133,9 @@ function Actions(props) {
         disabled: rest.disabled,
         overlay: overlay,
         trigger: ['click']
-      }, /*#__PURE__*/React.createElement(Button, rest, text, /*#__PURE__*/React.createElement(Icons.Down, {
+      }, /*#__PURE__*/React.createElement(Button, _extends({
+        type: buttonType
+      }, rest), text, /*#__PURE__*/React.createElement(Icons.Down, {
         style: {
           opacity: 0.7
         }
@@ -132,7 +143,8 @@ function Actions(props) {
     }
     return /*#__PURE__*/React.createElement(Button, _extends({
       key: text,
-      onClick: handleClick
+      onClick: handleClick,
+      type: buttonType
     }, trackAttr, rest), text);
   }), collapsedBtns.length > 0 ? /*#__PURE__*/React.createElement(Popover, {
     placement: "bottomRight",

package/es/component-configure/index.d.ts

@@ -1,10 +1,12 @@
 /// <reference types="react" />
+import type { ActionsProps } from '../actions';
 import type { FilterProps } from '../filter/typings';
 import type { AgGridReactProps } from '@ag-grid-community/react';
 interface ContextProps {
     /** 目前DataGrid由于是类组件，比较难处理，只支持ag-grid自带的属性 */
     DataGrid?: Omit<AgGridReactProps<any>, 'rowSelection' | 'pagination'>;
     Filter?: FilterProps<any>;
+    Actions?: Partial<ActionsProps>;
 }
 export declare const ComponentConfigureContext: import("react").Context<ContextProps>;
 export declare const ComponentConfigureProvider: import("react").Provider<ContextProps>;

package/es/data-grid/cell-editors/select.js

@@ -91,15 +91,17 @@ export default /*#__PURE__*/forwardRef(function SelectEditor(props, ref) {
       width: '100%'
     },
     optionFilterProp: optionFilterProp,
+    onSelect: function onSelect() {
+      if (mode === undefined) {
+        nextAction();
+      }
+    },
     onChange: function onChange(changedValue, opt) {
       if (valueByOption) {
         setValue(opt);
       } else {
         setValue(changedValue);
       }
-      if (mode === undefined) {
-        nextAction();
-      }
     }
   }));
 });

package/es/data-grid/cell-editors/text.js

@@ -11,6 +11,12 @@ import { useLocaleReceiver } from "../../locale-receiver";
 import { parseLocalTemplate } from "../../locale/locale";
 import { editorPrefixClass, navigateCell } from "./utils";
 import EditorWrapper from "./wrapper";
+function trimInput(val) {
+  if (typeof val === 'string') {
+    return val.trim();
+  }
+  return val;
+}
 export default /*#__PURE__*/forwardRef(function TextEditor(props, ref) {
   var disabled = props.disabled,
     maxLength = props.maxLength,
@@ -27,7 +33,7 @@ export default /*#__PURE__*/forwardRef(function TextEditor(props, ref) {
       if (props.charPress) {
         return [props.charPress, false];
       }
-      return [props.value, true];
+      return [trimInput(props.value), true];
     }, []),
     _useMemo2 = _slicedToArray(_useMemo, 2),
     defaultValue = _useMemo2[0],
@@ -63,7 +69,7 @@ export default /*#__PURE__*/forwardRef(function TextEditor(props, ref) {
         return false;
       },
       getValue: function getValue() {
-        return value;
+        return trimInput(value);
       }
     };
   });

package/es/data-grid/components/custom-panel/field-modal.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 import type { FieldCol, Node } from './typings';
 interface Props {
+    enableSummary: boolean;
     open?: boolean | FieldCol;
     onCancel: () => void;
     onOk: (field: FieldCol) => void;

package/es/data-grid/components/custom-panel/field-modal.js

@@ -24,7 +24,8 @@ export default function FieldModal(props) {
   var openProp = props.open,
     _onCancel = props.onCancel,
     nodes = props.nodes,
-    onOk = props.onOk;
+    onOk = props.onOk,
+    enableSummary = props.enableSummary;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     open = _useState2[0],
@@ -188,7 +189,7 @@ export default function FieldModal(props) {
     style: {
       height: 120
     }
-  })), /*#__PURE__*/React.createElement(Form.Item, {
+  })), enableSummary ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Form.Item, {
     label: " ",
     name: "summary",
     valuePropName: "checked"
@@ -209,7 +210,7 @@ export default function FieldModal(props) {
       label: fieldModal.dataSourceSummaryDataText,
       value: 2
     }]
-  }))))), /*#__PURE__*/React.createElement("div", {
+  }))) : null))), /*#__PURE__*/React.createElement("div", {
     className: prefix('column-panel-modal-gutter')
   }), /*#__PURE__*/React.createElement("div", {
     className: prefix('column-panel-modal-right')

package/es/data-grid/components/custom-panel/index.d.ts

@@ -2,4 +2,5 @@
 import type { IToolPanelParams } from '@ag-grid-community/core';
 export default function CustomColumnPanel(params: IToolPanelParams & {
     enableSave: boolean;
+    enableSummary: boolean;
 }): JSX.Element;

package/es/data-grid/components/custom-panel/index.js

@@ -24,7 +24,8 @@ import classNames from 'classnames';
 export default function CustomColumnPanel(params) {
   var columnApi = params.columnApi,
     api = params.api,
-    enableSave = params.enableSave;
+    enableSave = params.enableSave,
+    enableSummary = params.enableSummary;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     searching = _useState2[0],
@@ -359,6 +360,7 @@ export default function CustomColumnPanel(params) {
     size: "small"
   }, dataGridLocale.saveText) : null)), /*#__PURE__*/React.createElement(FieldModal, {
     open: field,
+    enableSummary: enableSummary,
     nodes: list,
     onCancel: function onCancel() {
       setField(false);

package/es/data-grid/index.js

@@ -62,7 +62,7 @@ import CellIndexRender from "./renderer/cell-index-renderer";
 import CellRenderer from "./renderer/cell-renderer";
 import DetailCellRenderer from "./renderer/detali-cell-renderer";
 import HeaderRenderer from "./renderer/header-renderer";
-import { prefix, getColField, isColumn, withSyncRender, Store, Selection, columnTypes } from "./utils";
+import { prefix, getColField, isColumn, withSyncRender, Store, Selection, getDefaultColumnTypes } from "./utils";
 import { ClientSideRowModelModule } from '@ag-grid-community/client-side-row-model';
 import { ModuleRegistry, GridApi, ColumnApi } from '@ag-grid-community/core';
 import { InfiniteRowModelModule } from '@ag-grid-community/infinite-row-model';
@@ -182,7 +182,8 @@ var InternalDataGrid = /*#__PURE__*/function (_Component) {
         iconKey: 'columns',
         toolPanel: CustomColumnPanel,
         toolPanelParams: {
-          enableSave: !!_this.props.customColumnPanelStorage
+          enableSave: !!_this.props.customColumnPanelStorage,
+          enableSummary: _this.isClientMode()
         }
       }]
     });
@@ -413,7 +414,8 @@ var InternalDataGrid = /*#__PURE__*/function (_Component) {
       return shallowEqual(prev[0], next[0]);
     }));
     _defineProperty(_assertThisInitialized(_this), "getMemoizedColumnTypes", memoizeOne(function (columnTypesProp) {
-      return _objectSpread(_objectSpread({}, columnTypes), columnTypesProp);
+      var locale = _this.props.locale;
+      return _objectSpread(_objectSpread({}, getDefaultColumnTypes(locale)), columnTypesProp);
     }));
     _defineProperty(_assertThisInitialized(_this), "getMemoizedLocaleText", memoizeOne(function (localeTextProp) {
       return _objectSpread(_objectSpread({}, _this.props.localeText), localeTextProp);
@@ -824,8 +826,7 @@ var InternalDataGrid = /*#__PURE__*/function (_Component) {
       }
       var _this$props6 = this.props,
         mColumnTypes = _this$props6.columnTypes,
-        mDefaultColDef = _this$props6.defaultColDef,
-        locale = _this$props6.locale;
+        mDefaultColDef = _this$props6.defaultColDef;
       var colTypes = this.getMemoizedColumnTypes(mColumnTypes);
       var result = {};
       var types;

package/es/data-grid/index.less

@@ -208,6 +208,7 @@
 
       &-left {
         width: 360px;
+        min-height: 210px;
         padding-right: @padding-md;
       }
 

package/es/data-grid/locale/en_US.js

@@ -50,6 +50,7 @@ var locale = {
   selectedTipText: '${length} Selected',
   clearSelectedText: 'Clear',
   moreText: 'More',
-  actionText: 'Action'
+  actionText: 'Action',
+  index: 'IDX'
 };
 export default locale;

package/es/data-grid/locale/locale.d.ts

@@ -32,4 +32,5 @@ export interface DataGridLocale {
     searchNextText: string;
     selectedTipText: string;
     clearSelectedText: string;
+    index: string;
 }

package/es/data-grid/locale/zh_CN.js

@@ -50,6 +50,7 @@ var locale = {
   selectedTipText: '已选${length}条',
   clearSelectedText: '清空已选',
   moreText: '更多',
-  actionText: '操作'
+  actionText: '操作',
+  index: '序号'
 };
 export default locale;

package/es/data-grid/utils.d.ts

@@ -1,3 +1,4 @@
+import type { DataGridLocale } from './locale/locale';
 import type { ColType, ColGroupType, PathType } from './typings';
 import type { ColDef, ColGroupDef } from '@ag-grid-community/core';
 import { Subject } from '@lemon-fe/utils';
@@ -49,3 +50,4 @@ export declare class Selection<T> {
     listen(cb: (keys: string[]) => void): () => void;
 }
 export declare const columnTypes: Record<string, ColDef>;
+export declare function getDefaultColumnTypes(locale: DataGridLocale): Record<string, ColDef<any>>;

package/es/data-grid/utils.js

@@ -290,4 +290,8 @@ export var columnTypes = {
     cellClass: prefix('center-aligned-cell'),
     headerClass: prefix('center-aligned-header')
   }
-};
+};
+export function getDefaultColumnTypes(locale) {
+  columnTypes.index.headerName = locale.index;
+  return columnTypes;
+}

package/es/select-view/index.js

@@ -78,10 +78,6 @@ export default function SelectView(props) {
     _useState12 = _slicedToArray(_useState11, 2),
     siderWidth = _useState12[0],
     setSiderWidth = _useState12[1];
-  var _useState13 = useState(false),
-    _useState14 = _slicedToArray(_useState13, 2),
-    dragging = _useState14[0],
-    setDragging = _useState14[1];
   var filterForm = mergeProp(Form.useForm()[0], filter === null || filter === void 0 ? void 0 : filter.form);
   var cParams = (filter === null || filter === void 0 ? void 0 : filter.value) || params;
   var getRowKey = function getRowKey(item) {
@@ -203,12 +199,6 @@ export default function SelectView(props) {
       axis: "x",
       height: 0,
       width: siderWidth,
-      onResizeStart: function onResizeStart() {
-        setDragging(true);
-      },
-      onResizeStop: function onResizeStop() {
-        setDragging(false);
-      },
       onResize: function onResize(_, _ref2) {
         var size = _ref2.size;
         setSiderWidth(size.width);
@@ -217,11 +207,13 @@ export default function SelectView(props) {
         className: prefix('sider-resizable')
       })
     }, /*#__PURE__*/React.createElement("div", {
+      className: prefix('sider-wrapper'),
       style: {
         width: "".concat(siderWidth, "px")
-      },
-      className: classNames(prefix('sider'), _defineProperty({}, prefix('sider-resizing'), dragging))
-    }, siderNode)), /*#__PURE__*/React.createElement("div", {
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      className: classNames(prefix('sider'))
+    }, siderNode))), /*#__PURE__*/React.createElement("div", {
       className: prefix('main')
     }, headerNode !== null && /*#__PURE__*/React.createElement("div", {
       className: prefix('head')

package/es/select-view/index.less

@@ -28,12 +28,18 @@
   }
 
   &-sider {
-    position: relative;
-    width: 200px;
+    width: 100%;
+    height: 100%;
     padding: @padding-md @padding-md @padding-md 0;
     overflow: auto;
     border-right: 1px solid @border-color-split;
 
+    &-wrapper {
+      position: relative;
+      width: 200px;
+      height: 100%;
+    }
+
     &-resizable {
       position: absolute;
       top: 0;
@@ -42,14 +48,8 @@
       width: 17px;
       height: 100%;
       padding: 0 8px;
-      background-color: @border-color-split;
-      background-clip: content-box;
       cursor: col-resize;
     }
-
-    &:not(&-resizing) {
-      transition: width 0.2s;
-    }
   }
 
   &-main {
@@ -60,7 +60,7 @@
     padding: @padding-md 0;
   }
 
-  &-sider + &-main {
+  &-sider-wrapper + &-main {
     padding-left: @padding-md;
   }
 

package/es/sider-tree/index.js

@@ -4,44 +4,69 @@ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableTo
 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 _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 _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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-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 { Input, Tabs, Tree } from 'antd';
 import React, { useMemo, useState } from 'react';
-import { PREFIX_CLS } from "../constants";
 import { EmptyImage } from "../empty";
 import Icons from "../icons";
 import { useLocaleReceiver } from "../locale-receiver";
+import Select from "../select";
 import { mapChildren, prefixClassName } from "../utils";
 import TreeNodeTitle from "./tree-node-title";
 import { useDebounce } from '@lemon-fe/hooks';
 import ResizeObserver from 'rc-resize-observer';
+var prefix = prefixClassName('tree');
 function SiderTreeTabs(props) {
+  var _items$;
   var tabs = props.tabs,
     children = props.children,
     restProps = _objectWithoutProperties(props, _excluded);
   var getKey = function getKey(item) {
     return item.key || item.title;
   };
-  var prefixCls = "".concat(PREFIX_CLS, "-tree");
-  return /*#__PURE__*/React.createElement(Tabs, _extends({
-    className: "".concat(prefixCls, "-tabs")
-  }, restProps), mapChildren(children, function (child, index) {
+  var items = mapChildren(children, function (child, index) {
     var tab = tabs[index];
-    return /*#__PURE__*/React.createElement(Tabs.TabPane, {
-      tab: tab.title,
-      key: getKey(tab)
-    }, child);
+    return {
+      key: getKey(tab),
+      label: tab.title,
+      children: child
+    };
+  });
+  var _useState = useState((_items$ = items[0]) === null || _items$ === void 0 ? void 0 : _items$.key),
+    _useState2 = _slicedToArray(_useState, 2),
+    activeKey = _useState2[0],
+    setActiveKey = _useState2[1];
+  return /*#__PURE__*/React.createElement(Tabs, _extends({
+    className: prefix('tabs')
+  }, restProps, {
+    items: items,
+    activeKey: activeKey,
+    renderTabBar: function renderTabBar() {
+      return /*#__PURE__*/React.createElement("div", {
+        className: prefix('tabbar')
+      }, /*#__PURE__*/React.createElement(Select, {
+        value: activeKey,
+        onChange: function onChange(val) {
+          setActiveKey(val);
+        },
+        options: items.map(function (item) {
+          return {
+            label: item.label,
+            value: item.key
+          };
+        })
+      }));
+    }
   }));
 }
-var prefix = prefixClassName('tree');
 export default function SiderTree(props) {
   var _props$data = props.data,
     mData = _props$data === void 0 ? [] : _props$data,
@@ -54,14 +79,14 @@ export default function SiderTree(props) {
     footer = props.footer,
     heightProp = props.height,
     restProps = _objectWithoutProperties(props, _excluded2);
-  var _useState = useState(''),
-    _useState2 = _slicedToArray(_useState, 2),
-    keywords = _useState2[0],
-    setKeywords = _useState2[1];
-  var _useState3 = useState(heightProp !== 'auto' ? heightProp : 0),
+  var _useState3 = useState(''),
     _useState4 = _slicedToArray(_useState3, 2),
-    height = _useState4[0],
-    setHeight = _useState4[1];
+    keywords = _useState4[0],
+    setKeywords = _useState4[1];
+  var _useState5 = useState(heightProp !== 'auto' ? heightProp : 0),
+    _useState6 = _slicedToArray(_useState5, 2),
+    height = _useState6[0],
+    setHeight = _useState6[1];
   var _useLocaleReceiver = useLocaleReceiver('SiderTree'),
     _useLocaleReceiver2 = _slicedToArray(_useLocaleReceiver, 1),
     SiderTreeLocale = _useLocaleReceiver2[0];

package/es/sider-tree/index.less

@@ -46,6 +46,15 @@
     .fullTabs();
   }
 
+  &-tabbar {
+    width: 100%;
+    margin-bottom: @padding-md;
+
+    .@{ant-prefix}-select {
+      width: 100%;
+    }
+  }
+
   &-body {
     min-height: 0;
     overflow: auto;
@@ -110,7 +119,7 @@
   &-empty {
     width: 72px;
     margin: 0 auto;
-    padding-top: 75px;
+    padding-top: 60px;
     text-align: center;
 
     img {
@@ -120,7 +129,6 @@
     }
 
     div {
-      margin-top: 8px;
       color: rgba(51, 51, 51, 0.5);
       font-size: 14px;
       line-height: 22px;
@@ -145,6 +153,10 @@
     }
   }
 
+  .@{prefixCls}-tree-tabbar {
+    padding-right: @padding-sm;
+  }
+
   .@{ant-prefix}-tabs-tabpane > .@{prefixCls}-tree-wrapper {
     padding: 0;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lemon-fe/components",
-  "version": "1.2.3",
+  "version": "1.2.6",
   "description": "> TODO: description",
   "homepage": "",
   "license": "ISC",
@@ -67,5 +67,5 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
   },
-  "gitHead": "831556422221ead3da6a017b786192be272de57e"
+  "gitHead": "7b763aefca55e7824e8d525383b3bf13b9163bcc"
 }