rsuite 4.10.7 → 4.10.10

package/es/CheckTreePicker/CheckTreePicker.js

@@ -510,9 +510,7 @@ function (_React$Component) {
   };
 
   _proto.updateDataChange = function updateDataChange(prevState) {
-    var _this$state2 = this.state,
-        searchKeyword = _this$state2.searchKeyword,
-        expandItemValues = _this$state2.expandItemValues;
+    var searchKeyword = this.state.searchKeyword;
     var _this$props7 = this.props,
         _this$props7$data = _this$props7.data,
         data = _this$props7$data === void 0 ? [] : _this$props7$data,
@@ -523,8 +521,7 @@ function (_React$Component) {
       this.nodes = {};
       this.flattenNodes(nextData);
       this.unserializeLists({
-        check: this.getValue(),
-        expand: expandItemValues
+        check: this.getValue()
       });
       this.setState({
         data: nextData,
@@ -567,10 +564,10 @@ function (_React$Component) {
   };
 
   _proto.updateUncheckableItemValuesChange = function updateUncheckableItemValuesChange(prevState) {
-    var _this$state3 = this.state,
-        data = _this$state3.data,
-        selectedValues = _this$state3.selectedValues,
-        expandItemValues = _this$state3.expandItemValues;
+    var _this$state2 = this.state,
+        data = _this$state2.data,
+        selectedValues = _this$state2.selectedValues,
+        expandItemValues = _this$state2.expandItemValues;
     var uncheckableItemValues = this.props.uncheckableItemValues;
 
     if (compareArray(uncheckableItemValues, prevState.uncheckableItemValues) && _isArray(uncheckableItemValues)) {
@@ -586,10 +583,10 @@ function (_React$Component) {
   };
 
   _proto.updateCascadeChange = function updateCascadeChange(prevState) {
-    var _this$state4 = this.state,
-        data = _this$state4.data,
-        selectedValues = _this$state4.selectedValues,
-        expandItemValues = _this$state4.expandItemValues;
+    var _this$state3 = this.state,
+        data = _this$state3.data,
+        selectedValues = _this$state3.selectedValues,
+        expandItemValues = _this$state3.expandItemValues;
     var cascade = this.props.cascade; // cascade 改变时，重新初始化
 
     if (cascade !== prevState.cascade && cascade) {
@@ -1062,9 +1059,9 @@ function (_React$Component) {
   _proto.renderNode = function renderNode(node, layer) {
     var _this10 = this;
 
-    var _this$state5 = this.state,
-        activeNode = _this$state5.activeNode,
-        searchKeyword = _this$state5.searchKeyword;
+    var _this$state4 = this.state,
+        activeNode = _this$state4.activeNode,
+        searchKeyword = _this$state4.searchKeyword;
     var _this$props11 = this.props,
         valueKey = _this$props11.valueKey,
         labelKey = _this$props11.labelKey,
@@ -1132,10 +1129,10 @@ function (_React$Component) {
   };
 
   _proto.renderVirtualNode = function renderVirtualNode(node, options) {
-    var _this$state6 = this.state,
-        activeNode = _this$state6.activeNode,
-        expandAll = _this$state6.expandAll,
-        searchKeyword = _this$state6.searchKeyword;
+    var _this$state5 = this.state,
+        activeNode = _this$state5.activeNode,
+        expandAll = _this$state5.expandAll,
+        searchKeyword = _this$state5.searchKeyword;
     var _this$props12 = this.props,
         valueKey = _this$props12.valueKey,
         labelKey = _this$props12.labelKey,
@@ -1185,9 +1182,9 @@ function (_React$Component) {
         _this11 = this,
         _classNames3;
 
-    var _this$state7 = this.state,
-        filterData = _this$state7.filterData,
-        isSomeNodeHasChildren = _this$state7.isSomeNodeHasChildren;
+    var _this$state6 = this.state,
+        filterData = _this$state6.filterData,
+        isSomeNodeHasChildren = _this$state6.isSomeNodeHasChildren;
     var _this$props13 = this.props,
         inline = _this$props13.inline,
         style = _this$props13.style,
@@ -1279,9 +1276,9 @@ function (_React$Component) {
         positionRef = _this$props14.positionRef,
         rest = _objectWithoutPropertiesLoose(_this$props14, ["cascade", "style", "locale", "inline", "disabled", "valueKey", "labelKey", "cleanable", "countable", "placeholder", "toggleComponentClass", "onExited", "onEntered", "onClean", "renderValue", "positionRef"]);
 
-    var _this$state8 = this.state,
-        hasValue = _this$state8.hasValue,
-        selectedValues = _this$state8.selectedValues;
+    var _this$state7 = this.state,
+        hasValue = _this$state7.hasValue,
+        selectedValues = _this$state7.selectedValues;
 
     var hasValidValue = hasValue || selectedValues.length > 0 && _isFunction(renderValue);
 

package/es/SelectPicker/SelectPicker.d.ts

@@ -36,7 +36,7 @@ export interface SelectProps<ValueType = any> {
   onGroupTitleClick?: (event: React.SyntheticEvent<any>) => void;
 
   /** Called when searching */
-  onSearch?: (searchKeyword: string, event: React.SyntheticEvent<any>) => void;
+  onSearch?: (searchKeyword: string, event?: React.SyntheticEvent<any>) => void;
 
   /** Called when clean */
   onClean?: (event: React.SyntheticEvent<any>) => void;

package/es/SelectPicker/SelectPicker.js

@@ -239,18 +239,19 @@ function (_React$Component) {
     };
 
     _this.handleExit = function () {
-      var _this$props$onClose, _this$props6;
+      var _this$props$onSearch, _this$props6, _this$props$onClose, _this$props7;
 
       _this.setState({
         searchKeyword: '',
         active: false
       });
 
-      (_this$props$onClose = (_this$props6 = _this.props).onClose) === null || _this$props$onClose === void 0 ? void 0 : _this$props$onClose.call(_this$props6);
+      (_this$props$onSearch = (_this$props6 = _this.props).onSearch) === null || _this$props$onSearch === void 0 ? void 0 : _this$props$onSearch.call(_this$props6, '');
+      (_this$props$onClose = (_this$props7 = _this.props).onClose) === null || _this$props$onClose === void 0 ? void 0 : _this$props$onClose.call(_this$props7);
     };
 
     _this.handleOpen = function () {
-      var _this$props$onOpen, _this$props7;
+      var _this$props$onOpen, _this$props8;
 
       var value = _this.getValue();
 
@@ -259,7 +260,7 @@ function (_React$Component) {
         focusItemValue: value
       });
 
-      (_this$props$onOpen = (_this$props7 = _this.props).onOpen) === null || _this$props$onOpen === void 0 ? void 0 : _this$props$onOpen.call(_this$props7);
+      (_this$props$onOpen = (_this$props8 = _this.props).onOpen) === null || _this$props$onOpen === void 0 ? void 0 : _this$props$onOpen.call(_this$props8);
     };
 
     _this.addPrefix = function (name) {
@@ -303,9 +304,9 @@ function (_React$Component) {
    * @param {node} label
    */
   _proto.shouldDisplay = function shouldDisplay(item, word) {
-    var _this$props8 = this.props,
-        searchBy = _this$props8.searchBy,
-        labelKey = _this$props8.labelKey;
+    var _this$props9 = this.props,
+        searchBy = _this$props9.searchBy,
+        labelKey = _this$props9.labelKey;
     var label = item === null || item === void 0 ? void 0 : item[labelKey];
     var searchKeyword = typeof word === 'undefined' ? this.state.searchKeyword : word;
 
@@ -334,18 +335,18 @@ function (_React$Component) {
   _proto.renderDropdownMenu = function renderDropdownMenu() {
     var _this4 = this;
 
-    var _this$props9 = this.props,
-        data = _this$props9.data,
-        groupBy = _this$props9.groupBy,
-        searchable = _this$props9.searchable,
-        locale = _this$props9.locale,
-        renderMenu = _this$props9.renderMenu,
-        renderExtraFooter = _this$props9.renderExtraFooter,
-        menuClassName = _this$props9.menuClassName,
-        menuStyle = _this$props9.menuStyle,
-        menuAutoWidth = _this$props9.menuAutoWidth,
-        sort = _this$props9.sort,
-        virtualized = _this$props9.virtualized;
+    var _this$props10 = this.props,
+        data = _this$props10.data,
+        groupBy = _this$props10.groupBy,
+        searchable = _this$props10.searchable,
+        locale = _this$props10.locale,
+        renderMenu = _this$props10.renderMenu,
+        renderExtraFooter = _this$props10.renderExtraFooter,
+        menuClassName = _this$props10.menuClassName,
+        menuStyle = _this$props10.menuStyle,
+        menuAutoWidth = _this$props10.menuAutoWidth,
+        sort = _this$props10.sort,
+        virtualized = _this$props10.virtualized;
     var focusItemValue = this.state.focusItemValue;
     var classes = classNames(this.addPrefix('select-menu'), menuClassName);
     var filteredData = filterNodesOfTree(data, function (item) {
@@ -390,22 +391,22 @@ function (_React$Component) {
   };
 
   _proto.render = function render() {
-    var _this$props10 = this.props,
-        data = _this$props10.data,
-        valueKey = _this$props10.valueKey,
-        labelKey = _this$props10.labelKey,
-        placeholder = _this$props10.placeholder,
-        renderValue = _this$props10.renderValue,
-        disabled = _this$props10.disabled,
-        cleanable = _this$props10.cleanable,
-        locale = _this$props10.locale,
-        toggleComponentClass = _this$props10.toggleComponentClass,
-        style = _this$props10.style,
-        onEntered = _this$props10.onEntered,
-        onExited = _this$props10.onExited,
-        onClean = _this$props10.onClean,
-        positionRef = _this$props10.positionRef,
-        rest = _objectWithoutPropertiesLoose(_this$props10, ["data", "valueKey", "labelKey", "placeholder", "renderValue", "disabled", "cleanable", "locale", "toggleComponentClass", "style", "onEntered", "onExited", "onClean", "positionRef"]);
+    var _this$props11 = this.props,
+        data = _this$props11.data,
+        valueKey = _this$props11.valueKey,
+        labelKey = _this$props11.labelKey,
+        placeholder = _this$props11.placeholder,
+        renderValue = _this$props11.renderValue,
+        disabled = _this$props11.disabled,
+        cleanable = _this$props11.cleanable,
+        locale = _this$props11.locale,
+        toggleComponentClass = _this$props11.toggleComponentClass,
+        style = _this$props11.style,
+        onEntered = _this$props11.onEntered,
+        onExited = _this$props11.onExited,
+        onClean = _this$props11.onClean,
+        positionRef = _this$props11.positionRef,
+        rest = _objectWithoutPropertiesLoose(_this$props11, ["data", "valueKey", "labelKey", "placeholder", "renderValue", "disabled", "cleanable", "locale", "toggleComponentClass", "style", "onEntered", "onExited", "onClean", "positionRef"]);
 
     var unhandled = getUnhandledProps(SelectPicker, rest);
     var value = this.getValue(); // Find active `MenuItem` by `value`

package/lib/CheckTreePicker/CheckTreePicker.js

@@ -544,9 +544,7 @@ function (_React$Component) {
   };
 
   _proto.updateDataChange = function updateDataChange(prevState) {
-    var _this$state2 = this.state,
-        searchKeyword = _this$state2.searchKeyword,
-        expandItemValues = _this$state2.expandItemValues;
+    var searchKeyword = this.state.searchKeyword;
     var _this$props7 = this.props,
         _this$props7$data = _this$props7.data,
         data = _this$props7$data === void 0 ? [] : _this$props7$data,
@@ -557,8 +555,7 @@ function (_React$Component) {
       this.nodes = {};
       this.flattenNodes(nextData);
       this.unserializeLists({
-        check: this.getValue(),
-        expand: expandItemValues
+        check: this.getValue()
       });
       this.setState({
         data: nextData,
@@ -601,10 +598,10 @@ function (_React$Component) {
   };
 
   _proto.updateUncheckableItemValuesChange = function updateUncheckableItemValuesChange(prevState) {
-    var _this$state3 = this.state,
-        data = _this$state3.data,
-        selectedValues = _this$state3.selectedValues,
-        expandItemValues = _this$state3.expandItemValues;
+    var _this$state2 = this.state,
+        data = _this$state2.data,
+        selectedValues = _this$state2.selectedValues,
+        expandItemValues = _this$state2.expandItemValues;
     var uncheckableItemValues = this.props.uncheckableItemValues;
 
     if ((0, _treeUtils.compareArray)(uncheckableItemValues, prevState.uncheckableItemValues) && (0, _isArray2.default)(uncheckableItemValues)) {
@@ -620,10 +617,10 @@ function (_React$Component) {
   };
 
   _proto.updateCascadeChange = function updateCascadeChange(prevState) {
-    var _this$state4 = this.state,
-        data = _this$state4.data,
-        selectedValues = _this$state4.selectedValues,
-        expandItemValues = _this$state4.expandItemValues;
+    var _this$state3 = this.state,
+        data = _this$state3.data,
+        selectedValues = _this$state3.selectedValues,
+        expandItemValues = _this$state3.expandItemValues;
     var cascade = this.props.cascade; // cascade 改变时，重新初始化
 
     if (cascade !== prevState.cascade && cascade) {
@@ -1096,9 +1093,9 @@ function (_React$Component) {
   _proto.renderNode = function renderNode(node, layer) {
     var _this10 = this;
 
-    var _this$state5 = this.state,
-        activeNode = _this$state5.activeNode,
-        searchKeyword = _this$state5.searchKeyword;
+    var _this$state4 = this.state,
+        activeNode = _this$state4.activeNode,
+        searchKeyword = _this$state4.searchKeyword;
     var _this$props11 = this.props,
         valueKey = _this$props11.valueKey,
         labelKey = _this$props11.labelKey,
@@ -1166,10 +1163,10 @@ function (_React$Component) {
   };
 
   _proto.renderVirtualNode = function renderVirtualNode(node, options) {
-    var _this$state6 = this.state,
-        activeNode = _this$state6.activeNode,
-        expandAll = _this$state6.expandAll,
-        searchKeyword = _this$state6.searchKeyword;
+    var _this$state5 = this.state,
+        activeNode = _this$state5.activeNode,
+        expandAll = _this$state5.expandAll,
+        searchKeyword = _this$state5.searchKeyword;
     var _this$props12 = this.props,
         valueKey = _this$props12.valueKey,
         labelKey = _this$props12.labelKey,
@@ -1219,9 +1216,9 @@ function (_React$Component) {
         _this11 = this,
         _classNames3;
 
-    var _this$state7 = this.state,
-        filterData = _this$state7.filterData,
-        isSomeNodeHasChildren = _this$state7.isSomeNodeHasChildren;
+    var _this$state6 = this.state,
+        filterData = _this$state6.filterData,
+        isSomeNodeHasChildren = _this$state6.isSomeNodeHasChildren;
     var _this$props13 = this.props,
         inline = _this$props13.inline,
         style = _this$props13.style,
@@ -1312,9 +1309,9 @@ function (_React$Component) {
         renderValue = _this$props14.renderValue,
         positionRef = _this$props14.positionRef,
         rest = (0, _objectWithoutPropertiesLoose2.default)(_this$props14, ["cascade", "style", "locale", "inline", "disabled", "valueKey", "labelKey", "cleanable", "countable", "placeholder", "toggleComponentClass", "onExited", "onEntered", "onClean", "renderValue", "positionRef"]);
-    var _this$state8 = this.state,
-        hasValue = _this$state8.hasValue,
-        selectedValues = _this$state8.selectedValues;
+    var _this$state7 = this.state,
+        hasValue = _this$state7.hasValue,
+        selectedValues = _this$state7.selectedValues;
     var hasValidValue = hasValue || selectedValues.length > 0 && (0, _isFunction2.default)(renderValue);
     var selectedItems = this.getSelectedItems(selectedValues);
     var selectedElement = placeholder;

package/lib/SelectPicker/SelectPicker.d.ts

@@ -36,7 +36,7 @@ export interface SelectProps<ValueType = any> {
   onGroupTitleClick?: (event: React.SyntheticEvent<any>) => void;
 
   /** Called when searching */
-  onSearch?: (searchKeyword: string, event: React.SyntheticEvent<any>) => void;
+  onSearch?: (searchKeyword: string, event?: React.SyntheticEvent<any>) => void;
 
   /** Called when clean */
   onClean?: (event: React.SyntheticEvent<any>) => void;

package/lib/SelectPicker/SelectPicker.js

@@ -264,18 +264,19 @@ function (_React$Component) {
     };
 
     _this.handleExit = function () {
-      var _this$props$onClose, _this$props6;
+      var _this$props$onSearch, _this$props6, _this$props$onClose, _this$props7;
 
       _this.setState({
         searchKeyword: '',
         active: false
       });
 
-      (_this$props$onClose = (_this$props6 = _this.props).onClose) === null || _this$props$onClose === void 0 ? void 0 : _this$props$onClose.call(_this$props6);
+      (_this$props$onSearch = (_this$props6 = _this.props).onSearch) === null || _this$props$onSearch === void 0 ? void 0 : _this$props$onSearch.call(_this$props6, '');
+      (_this$props$onClose = (_this$props7 = _this.props).onClose) === null || _this$props$onClose === void 0 ? void 0 : _this$props$onClose.call(_this$props7);
     };
 
     _this.handleOpen = function () {
-      var _this$props$onOpen, _this$props7;
+      var _this$props$onOpen, _this$props8;
 
       var value = _this.getValue();
 
@@ -284,7 +285,7 @@ function (_React$Component) {
         focusItemValue: value
       });
 
-      (_this$props$onOpen = (_this$props7 = _this.props).onOpen) === null || _this$props$onOpen === void 0 ? void 0 : _this$props$onOpen.call(_this$props7);
+      (_this$props$onOpen = (_this$props8 = _this.props).onOpen) === null || _this$props$onOpen === void 0 ? void 0 : _this$props$onOpen.call(_this$props8);
     };
 
     _this.addPrefix = function (name) {
@@ -328,9 +329,9 @@ function (_React$Component) {
    * @param {node} label
    */
   _proto.shouldDisplay = function shouldDisplay(item, word) {
-    var _this$props8 = this.props,
-        searchBy = _this$props8.searchBy,
-        labelKey = _this$props8.labelKey;
+    var _this$props9 = this.props,
+        searchBy = _this$props9.searchBy,
+        labelKey = _this$props9.labelKey;
     var label = item === null || item === void 0 ? void 0 : item[labelKey];
     var searchKeyword = typeof word === 'undefined' ? this.state.searchKeyword : word;
 
@@ -359,18 +360,18 @@ function (_React$Component) {
   _proto.renderDropdownMenu = function renderDropdownMenu() {
     var _this4 = this;
 
-    var _this$props9 = this.props,
-        data = _this$props9.data,
-        groupBy = _this$props9.groupBy,
-        searchable = _this$props9.searchable,
-        locale = _this$props9.locale,
-        renderMenu = _this$props9.renderMenu,
-        renderExtraFooter = _this$props9.renderExtraFooter,
-        menuClassName = _this$props9.menuClassName,
-        menuStyle = _this$props9.menuStyle,
-        menuAutoWidth = _this$props9.menuAutoWidth,
-        sort = _this$props9.sort,
-        virtualized = _this$props9.virtualized;
+    var _this$props10 = this.props,
+        data = _this$props10.data,
+        groupBy = _this$props10.groupBy,
+        searchable = _this$props10.searchable,
+        locale = _this$props10.locale,
+        renderMenu = _this$props10.renderMenu,
+        renderExtraFooter = _this$props10.renderExtraFooter,
+        menuClassName = _this$props10.menuClassName,
+        menuStyle = _this$props10.menuStyle,
+        menuAutoWidth = _this$props10.menuAutoWidth,
+        sort = _this$props10.sort,
+        virtualized = _this$props10.virtualized;
     var focusItemValue = this.state.focusItemValue;
     var classes = (0, _classnames.default)(this.addPrefix('select-menu'), menuClassName);
     var filteredData = (0, _treeUtils.filterNodesOfTree)(data, function (item) {
@@ -414,22 +415,22 @@ function (_React$Component) {
   };
 
   _proto.render = function render() {
-    var _this$props10 = this.props,
-        data = _this$props10.data,
-        valueKey = _this$props10.valueKey,
-        labelKey = _this$props10.labelKey,
-        placeholder = _this$props10.placeholder,
-        renderValue = _this$props10.renderValue,
-        disabled = _this$props10.disabled,
-        cleanable = _this$props10.cleanable,
-        locale = _this$props10.locale,
-        toggleComponentClass = _this$props10.toggleComponentClass,
-        style = _this$props10.style,
-        onEntered = _this$props10.onEntered,
-        onExited = _this$props10.onExited,
-        onClean = _this$props10.onClean,
-        positionRef = _this$props10.positionRef,
-        rest = (0, _objectWithoutPropertiesLoose2.default)(_this$props10, ["data", "valueKey", "labelKey", "placeholder", "renderValue", "disabled", "cleanable", "locale", "toggleComponentClass", "style", "onEntered", "onExited", "onClean", "positionRef"]);
+    var _this$props11 = this.props,
+        data = _this$props11.data,
+        valueKey = _this$props11.valueKey,
+        labelKey = _this$props11.labelKey,
+        placeholder = _this$props11.placeholder,
+        renderValue = _this$props11.renderValue,
+        disabled = _this$props11.disabled,
+        cleanable = _this$props11.cleanable,
+        locale = _this$props11.locale,
+        toggleComponentClass = _this$props11.toggleComponentClass,
+        style = _this$props11.style,
+        onEntered = _this$props11.onEntered,
+        onExited = _this$props11.onExited,
+        onClean = _this$props11.onClean,
+        positionRef = _this$props11.positionRef,
+        rest = (0, _objectWithoutPropertiesLoose2.default)(_this$props11, ["data", "valueKey", "labelKey", "placeholder", "renderValue", "disabled", "cleanable", "locale", "toggleComponentClass", "style", "onEntered", "onExited", "onClean", "positionRef"]);
     var unhandled = (0, _utils.getUnhandledProps)(SelectPicker, rest);
     var value = this.getValue(); // Find active `MenuItem` by `value`
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rsuite",
-  "version": "4.10.7",
+  "version": "4.10.10",
   "description": "A suite of react components",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -63,7 +63,7 @@
     "prop-types": "^15.7.2",
     "react-lifecycles-compat": "^3.0.4",
     "react-virtualized": "^9.21.0",
-    "rsuite-table": "^3.16.0",
+    "rsuite-table": "^3.16.1",
     "schema-typed": "^1.5.1"
   },
   "peerDependencies": {

package/src/CheckTreePicker/CheckTreePicker.tsx

@@ -234,7 +234,7 @@ class CheckTreePicker extends React.Component<CheckTreePickerProps, CheckTreePic
   }
 
   updateDataChange(prevState: CheckTreePickerState) {
-    const { searchKeyword, expandItemValues } = this.state;
+    const { searchKeyword } = this.state;
     const { data = [], childrenKey } = this.props;
 
     if (prevState.data !== data) {
@@ -242,8 +242,7 @@ class CheckTreePicker extends React.Component<CheckTreePickerProps, CheckTreePic
       this.nodes = {};
       this.flattenNodes(nextData);
       this.unserializeLists({
-        check: this.getValue(),
-        expand: expandItemValues
+        check: this.getValue()
       });
 
       this.setState({

package/src/CheckTreePicker/test/CheckTreePickerSpec.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import ReactTestUtils from 'react-dom/test-utils';
 import Enzyme, { mount } from 'enzyme';
 import Adapter from 'enzyme-adapter-react-16';
@@ -567,4 +567,45 @@ describe('CheckTreePicker', () => {
       4
     );
   });
+  it('Should expand when has props defaultExpandAll and data change', () => {
+    const Wrapper = React.forwardRef((props, ref) => {
+      const nextData = [
+        {
+          label: 'Fujian',
+          value: 3,
+          children: [
+            {
+              label: 'Fuzhou',
+              value: 36
+            }
+          ]
+        },
+        {
+          label: 'Guangdong',
+          value: 4,
+          children: [
+            {
+              label: 'Guangzhou',
+              value: 45
+            }
+          ]
+        }
+      ];
+      const [willChangeData, setData] = useState(data);
+      const handleClick = () => {
+        setData(nextData);
+      };
+      return (
+        <div ref={ref}>
+          <button onClick={handleClick} className="change-data">
+            change data
+          </button>
+          <CheckTreePicker inline defaultExpandAll data={willChangeData} />
+        </div>
+      );
+    });
+    const instance = getDOMNode(<Wrapper />);
+    ReactTestUtils.Simulate.click(instance.querySelector('.change-data'));
+    expect(instance.querySelectorAll('.rs-check-tree-open').length).to.equal(2);
+  });
 });

package/src/SelectPicker/SelectPicker.d.ts

@@ -36,7 +36,7 @@ export interface SelectProps<ValueType = any> {
   onGroupTitleClick?: (event: React.SyntheticEvent<any>) => void;
 
   /** Called when searching */
-  onSearch?: (searchKeyword: string, event: React.SyntheticEvent<any>) => void;
+  onSearch?: (searchKeyword: string, event?: React.SyntheticEvent<any>) => void;
 
   /** Called when clean */
   onClean?: (event: React.SyntheticEvent<any>) => void;

package/src/SelectPicker/SelectPicker.tsx

@@ -282,7 +282,7 @@ class SelectPicker extends React.Component<SelectPickerProps, SelectPickerState>
       searchKeyword: '',
       active: false
     });
-
+    this.props.onSearch?.('');
     this.props.onClose?.();
   };
 

package/src/SelectPicker/test/SelectPickerSpec.js

@@ -1,4 +1,5 @@
-import React from 'react';
+import React, { useState } from 'react';
+import ReactDOM from 'react-dom';
 import ReactTestUtils from 'react-dom/test-utils';
 import { globalKey, getDOMNode, getInstance } from '@test/testUtils';
 
@@ -34,6 +35,18 @@ const data = [
   }
 ];
 
+let container;
+
+beforeEach(() => {
+  container = document.createElement('div');
+  document.body.appendChild(container);
+});
+
+afterEach(() => {
+  document.body.removeChild(container);
+  container = null;
+});
+
 describe('SelectPicker', () => {
   it('Should clean selected default value', () => {
     const instance = getDOMNode(<Dropdown defaultOpen data={data} defaultValue={'Eugenia'} />);
@@ -324,4 +337,57 @@ describe('SelectPicker', () => {
     assert.equal(list.length, 1);
     assert.ok(list[0].innerText, 'Louisa');
   });
+
+  it.only('SearchWord should be reset when controlled and triggered off', done => {
+    let searchRef = '';
+    let onClose = null;
+    const promise = new Promise(resolve => {
+      onClose = resolve;
+    });
+    const Wrapper = React.forwardRef((props, ref) => {
+      const [search, setSearch] = useState(searchRef);
+      searchRef = search;
+      const handleSearch = value => {
+        setSearch(value);
+      };
+      const handleClose = () => {
+        onClose();
+      };
+      return (
+        <div>
+          <button id="exit">exit</button>
+          <Dropdown
+            search={search}
+            ref={ref}
+            defaultOpen
+            onClose={handleClose}
+            onSearch={handleSearch}
+            data={data}
+          />
+        </div>
+      );
+    });
+    Wrapper.displayName = 'WrapperSelectPicker';
+    ReactTestUtils.act(() => {
+      ReactDOM.render(<Wrapper />, container);
+    });
+
+    const exit = container?.querySelector('#exit');
+    const input = document.querySelector(searchInputClassName);
+    // change search
+    input.value = 'a';
+    ReactTestUtils.Simulate.change(input);
+    assert.equal(searchRef, 'a');
+
+    ReactTestUtils.act(() => {
+      // close select
+      // ReactTestUtils can't trigger document click event
+      exit.dispatchEvent(new MouseEvent('click', { bubbles: true }));
+    });
+
+    promise.then(() => {
+      assert.equal(searchRef, '');
+      done();
+    });
+  });
 });