rsuite 5.76.0 → 6.0.0-canary-20241227

package/cjs/Tree/hooks/useTreeDrag.js

@@ -4,7 +4,6 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
 exports.default = useTreeDrag;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = require("react");
 var _isNil = _interopRequireDefault(require("lodash/isNil"));
 var _constants = require("../../internals/constants");
@@ -14,7 +13,7 @@ var _TreeProvider = require("../../internals/Tree/TreeProvider");
 /**
  * The gap between tree nodes.
  */
-var TREE_NODE_GAP = 4;
+const TREE_NODE_GAP = 4;
 
 /**
  * Calculates the drop position of a tree node based on the clientY coordinate of a drag event
@@ -25,11 +24,14 @@ var TREE_NODE_GAP = 4;
  * @returns The drop position of the tree node.
  */
 function calDropNodePosition(event, treeNodeElement) {
-  var clientY = event.clientY;
-  var _treeNodeElement$getB = treeNodeElement.getBoundingClientRect(),
-    top = _treeNodeElement$getB.top,
-    bottom = _treeNodeElement$getB.bottom;
-  var gap = TREE_NODE_GAP;
+  const {
+    clientY
+  } = event;
+  const {
+    top,
+    bottom
+  } = treeNodeElement.getBoundingClientRect();
+  const gap = TREE_NODE_GAP;
 
   // bottom of node
   if (clientY >= bottom - gap && clientY <= bottom) {
@@ -50,7 +52,7 @@ function calDropNodePosition(event, treeNodeElement) {
  * Creates a drag preview element for tree nodes.
  */
 function createDragPreview(name, className) {
-  var dragPreview = document.createElement('div');
+  const dragPreview = document.createElement('div');
   dragPreview.id = 'rs-tree-drag-preview';
   dragPreview.dataset.testid = 'drag-preview';
   dragPreview.innerHTML = name;
@@ -64,59 +66,56 @@ function createDragPreview(name, className) {
  */
 function removeDragPreview() {
   var _dragPreview$parentNo, _dragPreview$parentNo2;
-  var dragPreview = document.getElementById('rs-tree-drag-preview');
+  const dragPreview = document.getElementById('rs-tree-drag-preview');
   dragPreview === null || dragPreview === void 0 || (_dragPreview$parentNo = dragPreview.parentNode) === null || _dragPreview$parentNo === void 0 || (_dragPreview$parentNo2 = _dragPreview$parentNo.removeChild) === null || _dragPreview$parentNo2 === void 0 || _dragPreview$parentNo2.call(_dragPreview$parentNo, dragPreview);
 }
 /**
  * Custom hook for handling tree node dragging.
  */
 function useTreeDrag(props) {
-  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),
-    childrenKey = _useItemDataKeys.childrenKey,
-    valueKey = _useItemDataKeys.valueKey,
-    labelKey = _useItemDataKeys.labelKey;
-  var draggable = props.draggable,
-    flattenedNodes = props.flattenedNodes,
-    treeNodesRefs = props.treeNodesRefs,
-    onDragStart = props.onDragStart,
-    onDragEnter = props.onDragEnter,
-    onDragOver = props.onDragOver,
-    onDragLeave = props.onDragLeave,
-    onDragEnd = props.onDragEnd,
-    onDrop = props.onDrop,
-    prefix = props.prefix;
+  const {
+    childrenKey,
+    valueKey,
+    labelKey
+  } = (0, _TreeProvider.useItemDataKeys)();
+  const {
+    draggable,
+    flattenedNodes,
+    treeNodesRefs,
+    onDragStart,
+    onDragEnter,
+    onDragOver,
+    onDragLeave,
+    onDragEnd,
+    onDrop,
+    prefix
+  } = props;
   // current dragging node
-  var dragNode = (0, _react.useRef)(null);
-  var _useState = (0, _react.useState)(null),
-    dragOverNodeKey = _useState[0],
-    setDragOverNodeKey = _useState[1];
+  const dragNode = (0, _react.useRef)(null);
+  const [dragOverNodeKey, setDragOverNodeKey] = (0, _react.useState)(null);
   // drag node and it's children nodes key
-  var _useState2 = (0, _react.useState)([]),
-    dragNodeKeys = _useState2[0],
-    setDragNodeKeys = _useState2[1];
-  var _useState3 = (0, _react.useState)(null),
-    dropNodePosition = _useState3[0],
-    setDropNodePosition = _useState3[1];
-  var setDragNode = (0, _react.useCallback)(function (node) {
+  const [dragNodeKeys, setDragNodeKeys] = (0, _react.useState)([]);
+  const [dropNodePosition, setDropNodePosition] = (0, _react.useState)(null);
+  const setDragNode = (0, _react.useCallback)(node => {
     dragNode.current = node;
   }, []);
 
   /**
    * Retrieves an array of keys for the nodes in a tree starting from the specified drag node.
    */
-  var getDragNodeKeys = (0, _react.useCallback)(function (dragNode) {
-    var dragNodeKeys = [dragNode[valueKey]];
-    var _traverse = function traverse(data) {
+  const getDragNodeKeys = (0, _react.useCallback)(dragNode => {
+    let dragNodeKeys = [dragNode[valueKey]];
+    const traverse = data => {
       if ((data === null || data === void 0 ? void 0 : data.length) > 0) {
-        data.forEach(function (node) {
+        data.forEach(node => {
           dragNodeKeys = dragNodeKeys.concat([node[valueKey]]);
           if (node[childrenKey]) {
-            _traverse(node[childrenKey]);
+            traverse(node[childrenKey]);
           }
         });
       }
     };
-    _traverse(dragNode[childrenKey]);
+    traverse(dragNode[childrenKey]);
     return dragNodeKeys;
   }, [childrenKey, valueKey]);
 
@@ -124,11 +123,13 @@ function useTreeDrag(props) {
    * Removes the drag node from the data array.
    *
    */
-  var removeDragNode = (0, _react.useCallback)(function (data, params) {
-    var dragNode = params.dragNode;
-    var _traverse2 = function traverse(items, parent) {
-      for (var index = 0; index < items.length; index += 1) {
-        var item = items[index];
+  const removeDragNode = (0, _react.useCallback)((data, params) => {
+    const {
+      dragNode
+    } = params;
+    const traverse = (items, parent) => {
+      for (let index = 0; index < items.length; index += 1) {
+        const item = items[index];
         if ((0, _utils.shallowEqual)(item[valueKey], dragNode[valueKey])) {
           items.splice(index, 1);
           // when children is empty, delete children prop for hidden anchor
@@ -138,27 +139,31 @@ function useTreeDrag(props) {
           break;
         }
         if (Array.isArray(item[childrenKey])) {
-          _traverse2(item[childrenKey], item);
+          traverse(item[childrenKey], item);
         }
       }
     };
-    _traverse2(data);
+    traverse(data);
   }, [childrenKey, valueKey]);
 
   /**
    * Creates a function that modifies a tree data structure based on drag and drop parameters.
    */
-  var createDragTreeDataFunction = (0, _react.useCallback)(function (params) {
+  const createDragTreeDataFunction = (0, _react.useCallback)(params => {
     return function (tree) {
-      var data = [].concat(tree);
-      var dragNode = params.dragNode,
-        dropNode = params.dropNode,
-        dropNodePosition = params.dropNodePosition;
-      var cloneDragNode = (0, _extends2.default)({}, dragNode);
+      const data = [...tree];
+      const {
+        dragNode,
+        dropNode,
+        dropNodePosition
+      } = params;
+      const cloneDragNode = {
+        ...dragNode
+      };
       removeDragNode(data, params);
-      var _updateTree = function updateTree(items) {
-        for (var index = 0; index < items.length; index += 1) {
-          var item = items[index];
+      const updateTree = items => {
+        for (let index = 0; index < items.length; index += 1) {
+          const item = items[index];
           if ((0, _utils.shallowEqual)(item[valueKey], dropNode[valueKey])) {
             // drag to node inside
             if (dropNodePosition === _constants.TREE_NODE_DROP_POSITION.DRAG_OVER) {
@@ -176,38 +181,37 @@ function useTreeDrag(props) {
             }
           }
           if (Array.isArray(item[childrenKey]) && item[childrenKey].length > 0) {
-            _updateTree(item[childrenKey]);
+            updateTree(item[childrenKey]);
           }
         }
       };
-      _updateTree(data);
-      return [].concat(data);
+      updateTree(data);
+      return [...data];
     };
   }, [childrenKey, removeDragNode, valueKey]);
-  var getDropData = (0, _react.useCallback)(function (nodeData) {
-    var dragParams = {
+  const getDropData = (0, _react.useCallback)(nodeData => {
+    const dragParams = {
       dragNode: dragNode.current,
       dropNode: nodeData,
-      dropNodePosition: dropNodePosition
+      dropNodePosition
     };
-    return (0, _extends2.default)({}, dragParams, {
+    return {
+      ...dragParams,
       createUpdateDataFunction: createDragTreeDataFunction(dragParams)
-    });
+    };
   }, [createDragTreeDataFunction, dropNodePosition]);
-  var handleDragStart = (0, _hooks.useEventCallback)(function (nodeData, event) {
+  const handleDragStart = (0, _hooks.useEventCallback)((nodeData, event) => {
     if (draggable) {
       var _event$dataTransfer;
-      var dragMoverNode = createDragPreview((0, _utils.stringifyReactNode)(nodeData[labelKey]), prefix('drag-preview'));
+      const dragMoverNode = createDragPreview((0, _utils.stringifyReactNode)(nodeData[labelKey]), prefix('drag-preview'));
       (_event$dataTransfer = event.dataTransfer) === null || _event$dataTransfer === void 0 || _event$dataTransfer.setDragImage(dragMoverNode, 0, 0);
       setDragNodeKeys(getDragNodeKeys(nodeData));
       setDragNode(flattenedNodes[nodeData.refKey]);
       onDragStart === null || onDragStart === void 0 || onDragStart(nodeData, event);
     }
   });
-  var handleDragEnter = (0, _hooks.useEventCallback)(function (nodeData, event) {
-    if (dragNodeKeys.some(function (d) {
-      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);
-    })) {
+  const handleDragEnter = (0, _hooks.useEventCallback)((nodeData, event) => {
+    if (dragNodeKeys.some(d => (0, _utils.shallowEqual)(d, nodeData[valueKey]))) {
       return;
     }
     if (dragNode.current) {
@@ -216,37 +220,33 @@ function useTreeDrag(props) {
     }
     onDragEnter === null || onDragEnter === void 0 || onDragEnter(nodeData, event);
   });
-  var handleDragOver = (0, _hooks.useEventCallback)(function (nodeData, event) {
-    if (dragNodeKeys.some(function (d) {
-      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);
-    })) {
+  const handleDragOver = (0, _hooks.useEventCallback)((nodeData, event) => {
+    if (dragNodeKeys.some(d => (0, _utils.shallowEqual)(d, nodeData[valueKey]))) {
       event.dataTransfer.dropEffect = 'none';
       return;
     }
     if (dragNode.current && (0, _utils.shallowEqual)(nodeData[valueKey], dragOverNodeKey)) {
-      var lastDropNodePosition = calDropNodePosition(event, treeNodesRefs[nodeData.refKey]);
+      const lastDropNodePosition = calDropNodePosition(event, treeNodesRefs[nodeData.refKey]);
       if (lastDropNodePosition === dropNodePosition) return;
       setDropNodePosition(lastDropNodePosition);
     }
     onDragOver === null || onDragOver === void 0 || onDragOver(nodeData, event);
   });
-  var handleDragLeave = (0, _hooks.useEventCallback)(function (nodeData, event) {
+  const handleDragLeave = (0, _hooks.useEventCallback)((nodeData, event) => {
     onDragLeave === null || onDragLeave === void 0 || onDragLeave(nodeData, event);
   });
-  var handleDragEnd = (0, _hooks.useEventCallback)(function (nodeData, event) {
+  const handleDragEnd = (0, _hooks.useEventCallback)((nodeData, event) => {
     removeDragPreview();
     setDragNode(null);
     setDragNodeKeys([]);
     setDragOverNodeKey(null);
     onDragEnd === null || onDragEnd === void 0 || onDragEnd(nodeData, event);
   });
-  var handleDrop = (0, _hooks.useEventCallback)(function (nodeData, event) {
-    if (dragNodeKeys.some(function (d) {
-      return (0, _utils.shallowEqual)(d, nodeData[valueKey]);
-    })) {
+  const handleDrop = (0, _hooks.useEventCallback)((nodeData, event) => {
+    if (dragNodeKeys.some(d => (0, _utils.shallowEqual)(d, nodeData[valueKey]))) {
       console.error('Cannot drag a node to itself and its children');
     } else {
-      var dropData = getDropData(nodeData);
+      const dropData = getDropData(nodeData);
       onDrop === null || onDrop === void 0 || onDrop(dropData, event);
     }
     removeDragPreview();
@@ -254,7 +254,7 @@ function useTreeDrag(props) {
     setDragNodeKeys([]);
     setDragOverNodeKey(null);
   });
-  var dragEvents = {
+  const dragEvents = {
     onDragStart: handleDragStart,
     onDragEnter: handleDragEnter,
     onDragOver: handleDragOver,
@@ -264,8 +264,8 @@ function useTreeDrag(props) {
   };
   return {
     dragNode: dragNode === null || dragNode === void 0 ? void 0 : dragNode.current,
-    dragOverNodeKey: dragOverNodeKey,
-    dropNodePosition: dropNodePosition,
-    dragEvents: dragEvents
+    dragOverNodeKey,
+    dropNodePosition,
+    dragEvents
   };
 }

package/cjs/Tree/hooks/useTreeNodeProps.js

@@ -10,38 +10,46 @@ var _utils = require("../../internals/utils");
 var _hooks = require("../../internals/Picker/hooks");
 var _TreeProvider = require("../../internals/Tree/TreeProvider");
 var _Highlight = _interopRequireDefault(require("../../Highlight"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function useTreeNodeProps(props) {
-  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),
-    valueKey = _useItemDataKeys.valueKey,
-    labelKey = _useItemDataKeys.labelKey,
-    childrenKey = _useItemDataKeys.childrenKey;
-  var _useCombobox = (0, _hooks.useCombobox)(),
-    id = _useCombobox.id;
-  var value = props.value,
-    disabledItemValues = props.disabledItemValues,
-    loadingNodeValues = props.loadingNodeValues,
-    focusItemValue = props.focusItemValue,
-    keyword = props.keyword,
-    dragNode = props.dragNode,
-    dragOverNodeKey = props.dragOverNodeKey,
-    dropNodePosition = props.dropNodePosition;
-  return (0, _react.useCallback)(function (nodeData, layer, index) {
-    var DRAG_OVER = _constants.TREE_NODE_DROP_POSITION.DRAG_OVER,
-      DRAG_OVER_TOP = _constants.TREE_NODE_DROP_POSITION.DRAG_OVER_TOP,
-      DRAG_OVER_BOTTOM = _constants.TREE_NODE_DROP_POSITION.DRAG_OVER_BOTTOM;
-    var visible = nodeData.visible;
-    var draggingNode = dragNode !== null && dragNode !== void 0 ? dragNode : {};
-    var nodeValue = nodeData[valueKey];
-    var nodeLabel = nodeData[labelKey];
-    var children = nodeData[childrenKey];
-    var label = keyword ? /*#__PURE__*/_react.default.createElement(_Highlight.default, {
+  const {
+    valueKey,
+    labelKey,
+    childrenKey
+  } = (0, _TreeProvider.useItemDataKeys)();
+  const {
+    id
+  } = (0, _hooks.useCombobox)();
+  const {
+    value,
+    disabledItemValues,
+    loadingNodeValues,
+    focusItemValue,
+    keyword,
+    dragNode,
+    dragOverNodeKey,
+    dropNodePosition
+  } = props;
+  return (0, _react.useCallback)((nodeData, layer, index) => {
+    const {
+      DRAG_OVER,
+      DRAG_OVER_TOP,
+      DRAG_OVER_BOTTOM
+    } = _constants.TREE_NODE_DROP_POSITION;
+    const {
+      visible
+    } = nodeData;
+    const draggingNode = dragNode !== null && dragNode !== void 0 ? dragNode : {};
+    const nodeValue = nodeData[valueKey];
+    const nodeLabel = nodeData[labelKey];
+    const children = nodeData[childrenKey];
+    const label = keyword ? /*#__PURE__*/_react.default.createElement(_Highlight.default, {
       as: "span",
       query: keyword
     }, nodeLabel) : nodeLabel;
-    var dragging = (0, _utils.shallowEqual)(nodeValue, draggingNode[valueKey]);
-    var dragStatus;
+    const dragging = (0, _utils.shallowEqual)(nodeValue, draggingNode[valueKey]);
+    let dragStatus;
     if ((0, _utils.shallowEqual)(nodeValue, dragOverNodeKey)) {
       switch (dropNodePosition) {
         case DRAG_OVER:
@@ -55,29 +63,25 @@ function useTreeNodeProps(props) {
           break;
       }
     }
-    var disabled = disabledItemValues.some(function (disabledItem) {
-      return (0, _utils.shallowEqual)(disabledItem, nodeValue);
-    });
-    var loading = loadingNodeValues.some(function (item) {
-      return (0, _utils.shallowEqual)(item, nodeValue);
-    });
-    var active = (0, _utils.shallowEqual)(nodeValue, value);
-    var focus = (0, _utils.shallowEqual)(nodeValue, focusItemValue);
+    const disabled = disabledItemValues.some(disabledItem => (0, _utils.shallowEqual)(disabledItem, nodeValue));
+    const loading = loadingNodeValues.some(item => (0, _utils.shallowEqual)(item, nodeValue));
+    const active = (0, _utils.shallowEqual)(nodeValue, value);
+    const focus = (0, _utils.shallowEqual)(nodeValue, focusItemValue);
     return {
-      id: id ? id + "-opt-" + nodeValue : undefined,
+      id: id ? `${id}-opt-${nodeValue}` : undefined,
       value: nodeValue,
-      label: label,
-      index: index,
-      layer: layer,
-      loading: loading,
-      active: active,
-      focus: focus,
-      visible: visible,
-      children: children,
-      nodeData: nodeData,
-      disabled: disabled,
-      dragging: dragging,
-      dragStatus: dragStatus
+      label,
+      index,
+      layer,
+      loading,
+      active,
+      focus,
+      visible,
+      children,
+      nodeData,
+      disabled,
+      dragging,
+      dragStatus
     };
   }, [childrenKey, disabledItemValues, dragNode, dragOverNodeKey, dropNodePosition, focusItemValue, id, keyword, labelKey, loadingNodeValues, value, valueKey]);
 }

package/cjs/Tree/hooks/useTreeNodeRefs.d.ts

@@ -2,5 +2,5 @@
  * Custom hook that manages references to tree nodes. */
 export default function useTreeNodeRefs(): {
     treeNodesRefs: {};
-    saveTreeNodeRef: (ref: React.Ref<any>, refKey?: string) => void;
+    saveTreeNodeRef: (ref: any, refKey?: string) => void;
 };

package/cjs/Tree/hooks/useTreeNodeRefs.js

@@ -9,14 +9,14 @@ var _isNil = _interopRequireDefault(require("lodash/isNil"));
 /**
  * Custom hook that manages references to tree nodes. */
 function useTreeNodeRefs() {
-  var treeNodeRefs = (0, _react.useRef)({});
-  var saveTreeNodeRef = function saveTreeNodeRef(ref, refKey) {
+  const treeNodeRefs = (0, _react.useRef)({});
+  const saveTreeNodeRef = (ref, refKey) => {
     if (!(0, _isNil.default)(refKey)) {
       treeNodeRefs.current[refKey] = ref;
     }
   };
   return {
     treeNodesRefs: treeNodeRefs.current,
-    saveTreeNodeRef: saveTreeNodeRef
+    saveTreeNodeRef
   };
 }

package/cjs/Tree/hooks/useTreeSearch.js

@@ -12,63 +12,58 @@ var _TreeProvider = require("../../internals/Tree/TreeProvider");
  * Custom hook for searching and filtering data in a tree structure.
  */
 function useTreeSearch(props) {
-  var _useItemDataKeys = (0, _TreeProvider.useItemDataKeys)(),
-    labelKey = _useItemDataKeys.labelKey,
-    childrenKey = _useItemDataKeys.childrenKey;
-  var searchKeyword = props.searchKeyword,
-    data = props.data,
-    searchBy = props.searchBy,
-    callback = props.callback;
-  var filterVisibleData = (0, _react.useCallback)(function (data, searchKeyword) {
-    var setVisible = function setVisible(nodes) {
-      return nodes.forEach(function (item) {
-        item.visible = searchBy ? searchBy(searchKeyword, item[labelKey], item) : (0, _Picker.shouldDisplay)(item[labelKey], searchKeyword);
-        if ((0, _isArray.default)(item[childrenKey])) {
-          filterVisibleData(item[childrenKey], searchKeyword);
-          item[childrenKey].forEach(function (child) {
-            if (child.visible) {
-              item.visible = child.visible;
-            }
-          });
-        }
-      });
-    };
+  const {
+    labelKey,
+    childrenKey
+  } = (0, _TreeProvider.useItemDataKeys)();
+  const {
+    searchKeyword,
+    data,
+    searchBy,
+    callback
+  } = props;
+  const filterVisibleData = (0, _react.useCallback)((data, searchKeyword) => {
+    const setVisible = nodes => nodes.forEach(item => {
+      item.visible = searchBy ? searchBy(searchKeyword, item[labelKey], item) : (0, _Picker.shouldDisplay)(item[labelKey], searchKeyword);
+      if ((0, _isArray.default)(item[childrenKey])) {
+        filterVisibleData(item[childrenKey], searchKeyword);
+        item[childrenKey].forEach(child => {
+          if (child.visible) {
+            item.visible = child.visible;
+          }
+        });
+      }
+    });
     setVisible(data);
     return data;
   }, [childrenKey, labelKey, searchBy]);
 
   // Use search keywords to filter options.
-  var _useState = (0, _react.useState)(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : ''),
-    keyword = _useState[0],
-    setSearchKeyword = _useState[1];
-  var _useState2 = (0, _react.useState)(function () {
-      return filterVisibleData(data, keyword);
-    }),
-    filteredData = _useState2[0],
-    setFilteredData = _useState2[1];
-  var handleSearch = function handleSearch(searchKeyword, event) {
-    var filteredData = filterVisibleData(data, searchKeyword);
+  const [keyword, setSearchKeyword] = (0, _react.useState)(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : '');
+  const [filteredData, setFilteredData] = (0, _react.useState)(() => filterVisibleData(data, keyword));
+  const handleSearch = (searchKeyword, event) => {
+    const filteredData = filterVisibleData(data, searchKeyword);
     setFilteredData(filteredData);
     setSearchKeyword(searchKeyword);
     if (event) {
       callback === null || callback === void 0 || callback(searchKeyword, filteredData, event);
     }
   };
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     handleSearch(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : '');
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [searchKeyword]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     setSearchKeyword(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : '');
   }, [searchKeyword, setSearchKeyword]);
-  var setVisibleData = (0, _react.useCallback)(function (data, searchKeyword) {
+  const setVisibleData = (0, _react.useCallback)((data, searchKeyword) => {
     setFilteredData(filterVisibleData(data, searchKeyword));
   }, [filterVisibleData]);
   return {
-    keyword: keyword,
-    filteredData: filteredData,
+    keyword,
+    filteredData,
     setFilteredData: setVisibleData,
-    setSearchKeyword: setSearchKeyword,
-    handleSearch: handleSearch
+    setSearchKeyword,
+    handleSearch
   };
 }

package/cjs/Tree/hooks/useTreeWithChildren.js

@@ -10,54 +10,40 @@ var _utils2 = require("../../internals/Tree/utils");
  * Custom hook that provides functionality for managing a tree structure with children.
  */
 function useTreeWithChildren(data, options) {
-  var valueKey = options.valueKey,
-    childrenKey = options.childrenKey;
-  var _useState = (0, _react.useState)([]),
-    loadingNodeValues = _useState[0],
-    setLoadingNodeValues = _useState[1];
-  var _useState2 = (0, _react.useState)(data),
-    treeData = _useState2[0],
-    setTreeData = _useState2[1];
-  (0, _react.useEffect)(function () {
+  const {
+    valueKey,
+    childrenKey
+  } = options;
+  const [loadingNodeValues, setLoadingNodeValues] = (0, _react.useState)([]);
+  const [treeData, setTreeData] = (0, _react.useState)(data);
+  (0, _react.useEffect)(() => {
     setTreeData(data);
   }, [data]);
-  var concatChildren = (0, _react.useCallback)(function (treeNode, children) {
-    var value = treeNode[valueKey];
-    treeNode = (0, _utils2.findNodeOfTree)(data, function (item) {
-      return value === item[valueKey];
-    });
+  const concatChildren = (0, _react.useCallback)((treeNode, children) => {
+    const value = treeNode[valueKey];
+    treeNode = (0, _utils2.findNodeOfTree)(data, item => value === item[valueKey]);
     treeNode[childrenKey] = children;
-    var newData = data.concat([]);
+    const newData = data.concat([]);
     setTreeData(newData);
     return newData;
   }, [data, valueKey, childrenKey]);
-  var appendChild = (0, _react.useCallback)(function (node, getChildren) {
-    setLoadingNodeValues(function (prev) {
-      return prev.concat(node[valueKey]);
-    });
-    var children = getChildren(node);
+  const appendChild = (0, _react.useCallback)((node, getChildren) => {
+    setLoadingNodeValues(prev => prev.concat(node[valueKey]));
+    const children = getChildren(node);
     if (children instanceof Promise) {
-      children.then(function (res) {
-        var newData = concatChildren(node, res);
+      children.then(res => {
+        const newData = concatChildren(node, res);
         setTreeData(newData);
-        setLoadingNodeValues(function (prev) {
-          return prev.filter(function (item) {
-            return !(0, _utils.shallowEqual)(item, node[valueKey]);
-          });
-        });
+        setLoadingNodeValues(prev => prev.filter(item => !(0, _utils.shallowEqual)(item, node[valueKey])));
       });
     } else {
       setTreeData(concatChildren(node, children));
-      setLoadingNodeValues(function (prev) {
-        return prev.filter(function (item) {
-          return !(0, _utils.shallowEqual)(item, node[valueKey]);
-        });
-      });
+      setLoadingNodeValues(prev => prev.filter(item => !(0, _utils.shallowEqual)(item, node[valueKey])));
     }
   }, [concatChildren, valueKey]);
   return {
-    treeData: treeData,
-    loadingNodeValues: loadingNodeValues,
-    appendChild: appendChild
+    treeData,
+    loadingNodeValues,
+    appendChild
   };
 }