rsuite 5.39.0 → 5.40.0

package/CHANGELOG.md

@@ -1,3 +1,9 @@
+# [5.40.0](https://github.com/rsuite/rsuite/compare/v5.39.0...v5.40.0) (2023-09-10)
+
+### Bug Fixes
+
+- **CheckTree:** searchKeyword is not updated as expected ([#3354](https://github.com/rsuite/rsuite/issues/3354)) ([b642da3](https://github.com/rsuite/rsuite/commit/b642da31c158481eeea8d46e9e3088edfb83acd1)), closes [#3196](https://github.com/rsuite/rsuite/issues/3196)
+
 # [5.39.0](https://github.com/rsuite/rsuite/compare/v5.38.0...v5.39.0) (2023-09-04)
 
 ### Bug Fixes

package/cjs/CheckTreePicker/CheckTreePicker.js

@@ -239,7 +239,7 @@ var CheckTreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
       });
     }
 
-    return (0, _utils2.getFormattedTree)(filteredData, flattenNodes, {
+    return (0, _utils2.getFormattedTree)(flattenNodes, filteredData, {
       childrenKey: childrenKey,
       cascade: cascade
     }).map(function (node) {

package/cjs/CheckTreePicker/utils.d.ts

@@ -37,7 +37,7 @@ export declare function isEveryFirstLevelNodeUncheckable(nodes: TreeNodesType, u
  * @param {*} node
  */
 export declare function isNodeUncheckable(node: any, props: Required<Pick<CheckTreePickerProps, 'uncheckableItemValues' | 'valueKey'>>): boolean;
-export declare function getFormattedTree(data: any[], nodes: TreeNodesType, props: Required<Pick<CheckTreePickerProps, 'childrenKey' | 'cascade'>>): any[];
+export declare function getFormattedTree(nodes: TreeNodesType, data: any[], props: Required<Pick<CheckTreePickerProps, 'childrenKey' | 'cascade'>>): any[];
 export declare function getDisabledState(nodes: TreeNodesType, node: TreeNodeType, props: Required<Pick<CheckTreePickerProps, 'disabledItemValues' | 'valueKey'>>): boolean;
 export declare function getCheckTreePickerDefaultValue(value: any[], uncheckableItemValues: any[]): any[];
 export declare function getSelectedItems(nodes: TreeNodesType, values: ValueType): TreeNodeType[];

package/cjs/CheckTreePicker/utils.js

@@ -130,7 +130,7 @@ function isNodeUncheckable(node, props) {
   });
 }
 
-function getFormattedTree(data, nodes, props) {
+function getFormattedTree(nodes, data, props) {
   var childrenKey = props.childrenKey,
       cascade = props.cascade;
   return data.map(function (node) {
@@ -153,7 +153,7 @@ function getFormattedTree(data, nodes, props) {
       formatted.checkState = checkState;
 
       if (((_node$childrenKey = node[childrenKey]) === null || _node$childrenKey === void 0 ? void 0 : _node$childrenKey.length) > 0) {
-        formatted[childrenKey] = getFormattedTree(formatted[childrenKey], nodes, props);
+        formatted[childrenKey] = getFormattedTree(nodes, formatted[childrenKey], props);
       }
     }
 

package/cjs/utils/treeUtils.d.ts

@@ -240,7 +240,7 @@ export declare function useTreeSearch<T>(props: TreeSearchProps<T>): {
     filteredData: T[];
     setFilteredData: (data: T[], searchKeyword: string) => void;
     setSearchKeyword: React.Dispatch<React.SetStateAction<string>>;
-    handleSearch: (searchKeyword: string, event: React.ChangeEvent) => void;
+    handleSearch: (searchKeyword: string, event?: React.ChangeEvent) => void;
 };
 export declare function useGetTreeNodeChildren<T extends Record<string, unknown>>(treeData: T[], valueKey: string, childrenKey: string): {
     data: T[];

package/cjs/utils/treeUtils.js

@@ -1051,9 +1051,7 @@ function useTreeSearch(props) {
     return data;
   }, [childrenKey, labelKey, searchBy]); // Use search keywords to filter options.
 
-  var _useState5 = (0, _react.useState)(function () {
-    return searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : '';
-  }),
+  var _useState5 = (0, _react.useState)(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : ''),
       searchKeywordState = _useState5[0],
       setSearchKeyword = _useState5[1];
 
@@ -1063,17 +1061,19 @@ function useTreeSearch(props) {
       filteredData = _useState6[0],
       setFilteredData = _useState6[1];
 
-  var handleSetFilteredData = (0, _react.useCallback)(function (data, searchKeyword) {
-    setFilteredData(filterVisibleData(data, searchKeyword));
-  }, [filterVisibleData]);
-
   var handleSearch = function handleSearch(searchKeyword, event) {
     var filteredData = filterVisibleData(data, searchKeyword);
     setFilteredData(filteredData);
     setSearchKeyword(searchKeyword);
-    callback === null || callback === void 0 ? void 0 : callback(searchKeyword, filteredData, event);
+    event && (callback === null || callback === void 0 ? void 0 : callback(searchKeyword, filteredData, event));
   };
 
+  (0, _react.useEffect)(function () {
+    handleSearch(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : ''); // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [searchKeyword]);
+  var handleSetFilteredData = (0, _react.useCallback)(function (data, searchKeyword) {
+    setFilteredData(filterVisibleData(data, searchKeyword));
+  }, [filterVisibleData]);
   return {
     searchKeywordState: searchKeywordState,
     filteredData: filteredData,