@lemon-fe/components 1.2.2 → 1.2.5

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.d.ts

@@ -16,7 +16,7 @@ export declare type SelectEditorParams = Pick<SelectProps<any, BaseOptionType>,
      */
     action?: 'next' | 'stop' | 'none';
 };
-declare const _default: React.ForwardRefExoticComponent<ICellEditorParams<any, any, any> & Pick<SelectProps<any, BaseOptionType>, "disabled" | "mode" | "virtual" | "allowClear" | "showSearch" | "optionFilterProp" | "options" | "listHeight"> & {
+declare const _default: React.ForwardRefExoticComponent<ICellEditorParams<any, any, any> & Pick<SelectProps<any, BaseOptionType>, "disabled" | "mode" | "showSearch" | "allowClear" | "optionFilterProp" | "options" | "virtual" | "listHeight"> & {
     fieldNames?: {
         label: string;
         value: string;

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/index.d.ts

@@ -16,7 +16,7 @@ declare const Editors: {
     Text: React.ForwardRefExoticComponent<import("@ag-grid-community/core").ICellEditorParams<any, any, any> & import("./typings").TextEditorParams<any> & React.RefAttributes<import("@ag-grid-community/react").ICellEditorReactComp>>;
     Date: React.ForwardRefExoticComponent<import("@ag-grid-community/core").ICellEditorParams<any, any, any> & import("./typings").DateEditorParams<any> & React.RefAttributes<import("@ag-grid-community/react").ICellEditorReactComp>>;
     Number: React.ForwardRefExoticComponent<import("@ag-grid-community/core").ICellEditorParams<any, any, any> & import("./typings").NumberEditorParams<any> & React.RefAttributes<import("@ag-grid-community/react").ICellEditorReactComp>>;
-    Select: React.ForwardRefExoticComponent<import("@ag-grid-community/core").ICellEditorParams<any, any, any> & Pick<import("antd").SelectProps<any, import("antd/lib/select").BaseOptionType>, "disabled" | "mode" | "virtual" | "allowClear" | "showSearch" | "optionFilterProp" | "options" | "listHeight"> & {
+    Select: React.ForwardRefExoticComponent<import("@ag-grid-community/core").ICellEditorParams<any, any, any> & Pick<import("antd").SelectProps<any, import("antd/lib/select").BaseOptionType>, "disabled" | "allowClear" | "mode" | "showSearch" | "optionFilterProp" | "options" | "virtual" | "listHeight"> & {
         fieldNames?: {
             label: string;
             value: string;

package/es/data-grid/index.js

@@ -1668,7 +1668,7 @@ var InternalDataGrid = /*#__PURE__*/function (_Component) {
         enableCellEditingOnBackspace: true,
         maintainColumnOrder: true,
         suppressCsvExport: true,
-        suppressRowClickSelection: gridRowSelection === 'multiple',
+        rowMultiSelectWithClick: gridRowSelection === 'multiple',
         noRowsOverlayComponent: this.NoRowsOverlay,
         getMainMenuItems: this.getMainMenuItems,
         rowBuffer: 20,

package/es/data-grid/index.less

@@ -531,7 +531,8 @@
   --ag-header-column-resize-handle-color: #d9d9d9;
   --ag-cell-horizontal-padding: 8px;
   --ag-icon-font-family: 'agGridAlpine';
-  --ag-selected-row-background-color: ~'var(--@{ant-prefix}-primary-1)';
+  // --ag-selected-row-background-color: ~'var(--@{ant-prefix}-primary-1)';
+  --ag-selected-row-background-color: #dde8fd;
   --ag-selected-tab-underline-width: 2px;
   --ag-range-selection-border-color: ~'var(--@{ant-prefix}-primary-5)';
   --ag-range-selection-highlight-color: ~'var(--@{ant-prefix}-primary-2)';

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.2",
+  "version": "1.2.5",
   "description": "> TODO: description",
   "homepage": "",
   "license": "ISC",
@@ -67,5 +67,5 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
   },
-  "gitHead": "8c059ebf163ebc08134ec596a5d1233cef74e620"
+  "gitHead": "2387c5a7ca757fa6704b046a4e9fab89b0b330df"
 }