rsuite 5.40.0 → 5.42.0

package/cjs/TreePicker/TreePicker.js

@@ -1,218 +1,185 @@
+'use client';
 "use strict";
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
 var _isFunction2 = _interopRequireDefault(require("lodash/isFunction"));
-
 var _isNil2 = _interopRequireDefault(require("lodash/isNil"));
-
 var _isUndefined2 = _interopRequireDefault(require("lodash/isUndefined"));
-
 var _omit2 = _interopRequireDefault(require("lodash/omit"));
-
 var _pick2 = _interopRequireDefault(require("lodash/pick"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _Windowing = require("../Windowing");
-
 var _TreeNode = _interopRequireDefault(require("./TreeNode"));
-
 var _treeUtils = require("../utils/treeUtils");
-
 var _utils = require("../utils");
-
 var _Picker = require("../Picker");
-
 var _TreeContext = _interopRequireDefault(require("../Tree/TreeContext"));
-
 var emptyArray = [];
-
 var itemSize = function itemSize() {
   return 36;
 };
-
 var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
-      Component = _props$as === void 0 ? 'div' : _props$as,
-      _props$data = props.data,
-      data = _props$data === void 0 ? emptyArray : _props$data,
-      _props$appearance = props.appearance,
-      appearance = _props$appearance === void 0 ? 'default' : _props$appearance,
-      style = props.style,
-      showIndentLine = props.showIndentLine,
-      controlledValue = props.value,
-      overrideLocale = props.locale,
-      _props$height = props.height,
-      height = _props$height === void 0 ? 360 : _props$height,
-      _props$menuMaxHeight = props.menuMaxHeight,
-      menuMaxHeight = _props$menuMaxHeight === void 0 ? 320 : _props$menuMaxHeight,
-      menuStyle = props.menuStyle,
-      className = props.className,
-      disabled = props.disabled,
-      _props$placement = props.placement,
-      placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,
-      _props$cleanable = props.cleanable,
-      cleanable = _props$cleanable === void 0 ? true : _props$cleanable,
-      _props$searchable = props.searchable,
-      searchable = _props$searchable === void 0 ? true : _props$searchable,
-      _props$virtualized = props.virtualized,
-      virtualized = _props$virtualized === void 0 ? false : _props$virtualized,
-      _props$classPrefix = props.classPrefix,
-      classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,
-      defaultValue = props.defaultValue,
-      placeholder = props.placeholder,
-      searchKeyword = props.searchKeyword,
-      menuClassName = props.menuClassName,
-      _props$menuAutoWidth = props.menuAutoWidth,
-      menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,
-      searchBy = props.searchBy,
-      toggleAs = props.toggleAs,
-      _props$labelKey = props.labelKey,
-      labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,
-      _props$valueKey = props.valueKey,
-      valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,
-      _props$childrenKey = props.childrenKey,
-      childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,
-      draggable = props.draggable,
-      _props$defaultExpandA = props.defaultExpandAll,
-      defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,
-      _props$disabledItemVa = props.disabledItemValues,
-      disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,
-      controlledExpandItemValues = props.expandItemValues,
-      _props$defaultExpandI = props.defaultExpandItemValues,
-      defaultExpandItemValues = _props$defaultExpandI === void 0 ? emptyArray : _props$defaultExpandI,
-      id = props.id,
-      listProps = props.listProps,
-      getChildren = props.getChildren,
-      renderTreeIcon = props.renderTreeIcon,
-      renderTreeNode = props.renderTreeNode,
-      onExit = props.onExit,
-      onExited = props.onExited,
-      onClean = props.onClean,
-      onOpen = props.onOpen,
-      onSearch = props.onSearch,
-      onSelect = props.onSelect,
-      onSelectItem = props.onSelectItem,
-      onChange = props.onChange,
-      onEntered = props.onEntered,
-      onClose = props.onClose,
-      onDragEnd = props.onDragEnd,
-      onDragStart = props.onDragStart,
-      onDragEnter = props.onDragEnter,
-      onDragLeave = props.onDragLeave,
-      onDragOver = props.onDragOver,
-      onDrop = props.onDrop,
-      onExpand = props.onExpand,
-      renderExtraFooter = props.renderExtraFooter,
-      renderMenu = props.renderMenu,
-      renderValue = props.renderValue,
-      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "data", "appearance", "style", "showIndentLine", "value", "locale", "height", "menuMaxHeight", "menuStyle", "className", "disabled", "placement", "cleanable", "searchable", "virtualized", "classPrefix", "defaultValue", "placeholder", "searchKeyword", "menuClassName", "menuAutoWidth", "searchBy", "toggleAs", "labelKey", "valueKey", "childrenKey", "draggable", "defaultExpandAll", "disabledItemValues", "expandItemValues", "defaultExpandItemValues", "id", "listProps", "getChildren", "renderTreeIcon", "renderTreeNode", "onExit", "onExited", "onClean", "onOpen", "onSearch", "onSelect", "onSelectItem", "onChange", "onEntered", "onClose", "onDragEnd", "onDragStart", "onDragEnter", "onDragLeave", "onDragOver", "onDrop", "onExpand", "renderExtraFooter", "renderMenu", "renderValue"]);
+    Component = _props$as === void 0 ? 'div' : _props$as,
+    _props$data = props.data,
+    data = _props$data === void 0 ? emptyArray : _props$data,
+    _props$appearance = props.appearance,
+    appearance = _props$appearance === void 0 ? 'default' : _props$appearance,
+    style = props.style,
+    showIndentLine = props.showIndentLine,
+    controlledValue = props.value,
+    overrideLocale = props.locale,
+    _props$height = props.height,
+    height = _props$height === void 0 ? 360 : _props$height,
+    _props$menuMaxHeight = props.menuMaxHeight,
+    menuMaxHeight = _props$menuMaxHeight === void 0 ? 320 : _props$menuMaxHeight,
+    menuStyle = props.menuStyle,
+    className = props.className,
+    disabled = props.disabled,
+    _props$placement = props.placement,
+    placement = _props$placement === void 0 ? 'bottomStart' : _props$placement,
+    _props$cleanable = props.cleanable,
+    cleanable = _props$cleanable === void 0 ? true : _props$cleanable,
+    _props$searchable = props.searchable,
+    searchable = _props$searchable === void 0 ? true : _props$searchable,
+    _props$virtualized = props.virtualized,
+    virtualized = _props$virtualized === void 0 ? false : _props$virtualized,
+    _props$classPrefix = props.classPrefix,
+    classPrefix = _props$classPrefix === void 0 ? 'picker' : _props$classPrefix,
+    defaultValue = props.defaultValue,
+    placeholder = props.placeholder,
+    searchKeyword = props.searchKeyword,
+    menuClassName = props.menuClassName,
+    _props$menuAutoWidth = props.menuAutoWidth,
+    menuAutoWidth = _props$menuAutoWidth === void 0 ? true : _props$menuAutoWidth,
+    searchBy = props.searchBy,
+    toggleAs = props.toggleAs,
+    _props$labelKey = props.labelKey,
+    labelKey = _props$labelKey === void 0 ? 'label' : _props$labelKey,
+    _props$valueKey = props.valueKey,
+    valueKey = _props$valueKey === void 0 ? 'value' : _props$valueKey,
+    _props$childrenKey = props.childrenKey,
+    childrenKey = _props$childrenKey === void 0 ? 'children' : _props$childrenKey,
+    draggable = props.draggable,
+    _props$defaultExpandA = props.defaultExpandAll,
+    defaultExpandAll = _props$defaultExpandA === void 0 ? false : _props$defaultExpandA,
+    _props$disabledItemVa = props.disabledItemValues,
+    disabledItemValues = _props$disabledItemVa === void 0 ? emptyArray : _props$disabledItemVa,
+    controlledExpandItemValues = props.expandItemValues,
+    _props$defaultExpandI = props.defaultExpandItemValues,
+    defaultExpandItemValues = _props$defaultExpandI === void 0 ? emptyArray : _props$defaultExpandI,
+    id = props.id,
+    listProps = props.listProps,
+    getChildren = props.getChildren,
+    renderTreeIcon = props.renderTreeIcon,
+    renderTreeNode = props.renderTreeNode,
+    onExit = props.onExit,
+    onExited = props.onExited,
+    onClean = props.onClean,
+    onOpen = props.onOpen,
+    onSearch = props.onSearch,
+    onSelect = props.onSelect,
+    onSelectItem = props.onSelectItem,
+    onChange = props.onChange,
+    onEntered = props.onEntered,
+    onClose = props.onClose,
+    onDragEnd = props.onDragEnd,
+    onDragStart = props.onDragStart,
+    onDragEnter = props.onDragEnter,
+    onDragLeave = props.onDragLeave,
+    onDragOver = props.onDragOver,
+    onDrop = props.onDrop,
+    onExpand = props.onExpand,
+    renderExtraFooter = props.renderExtraFooter,
+    renderMenu = props.renderMenu,
+    renderValue = props.renderValue,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["as", "data", "appearance", "style", "showIndentLine", "value", "locale", "height", "menuMaxHeight", "menuStyle", "className", "disabled", "placement", "cleanable", "searchable", "virtualized", "classPrefix", "defaultValue", "placeholder", "searchKeyword", "menuClassName", "menuAutoWidth", "searchBy", "toggleAs", "labelKey", "valueKey", "childrenKey", "draggable", "defaultExpandAll", "disabledItemValues", "expandItemValues", "defaultExpandItemValues", "id", "listProps", "getChildren", "renderTreeIcon", "renderTreeNode", "onExit", "onExited", "onClean", "onOpen", "onSearch", "onSelect", "onSelectItem", "onChange", "onEntered", "onClose", "onDragEnd", "onDragStart", "onDragEnter", "onDragLeave", "onDragOver", "onDrop", "onExpand", "renderExtraFooter", "renderMenu", "renderValue"]);
   var triggerRef = (0, _react.useRef)(null);
   var targetRef = (0, _react.useRef)(null);
   var listRef = (0, _react.useRef)(null);
   var overlayRef = (0, _react.useRef)(null);
   var searchInputRef = (0, _react.useRef)(null);
   var treeViewRef = (0, _react.useRef)(null);
-
   var _useCustom = (0, _utils.useCustom)('Picker', overrideLocale),
-      rtl = _useCustom.rtl,
-      locale = _useCustom.locale;
-
+    rtl = _useCustom.rtl,
+    locale = _useCustom.locale;
   var _useContext = (0, _react.useContext)(_TreeContext.default),
-      inline = _useContext.inline;
-
+    inline = _useContext.inline;
   var _useControlled = (0, _utils.useControlled)(controlledValue, defaultValue),
-      value = _useControlled[0],
-      setValue = _useControlled[1],
-      isControlled = _useControlled[2];
-
+    value = _useControlled[0],
+    setValue = _useControlled[1],
+    isControlled = _useControlled[2];
   var _useGetTreeNodeChildr = (0, _treeUtils.useGetTreeNodeChildren)(data, valueKey, childrenKey),
-      treeData = _useGetTreeNodeChildr.data,
-      setTreeData = _useGetTreeNodeChildr.setData,
-      loadingNodeValues = _useGetTreeNodeChildr.loadingNodeValues,
-      loadChildren = _useGetTreeNodeChildr.loadChildren;
-
+    treeData = _useGetTreeNodeChildr.data,
+    setTreeData = _useGetTreeNodeChildr.setData,
+    loadingNodeValues = _useGetTreeNodeChildr.loadingNodeValues,
+    loadChildren = _useGetTreeNodeChildr.loadChildren;
   var _useControlled2 = (0, _utils.useControlled)(controlledExpandItemValues, (0, _treeUtils.getDefaultExpandItemValues)(treeData, {
-    defaultExpandAll: defaultExpandAll,
-    valueKey: valueKey,
-    childrenKey: childrenKey,
-    defaultExpandItemValues: defaultExpandItemValues
-  })),
-      expandItemValues = _useControlled2[0],
-      setExpandItemValues = _useControlled2[1];
-
+      defaultExpandAll: defaultExpandAll,
+      valueKey: valueKey,
+      childrenKey: childrenKey,
+      defaultExpandItemValues: defaultExpandItemValues
+    })),
+    expandItemValues = _useControlled2[0],
+    setExpandItemValues = _useControlled2[1];
   var _useState = (0, _react.useState)(false),
-      active = _useState[0],
-      setActive = _useState[1];
-
+    active = _useState[0],
+    setActive = _useState[1];
   var _useState2 = (0, _react.useState)(null),
-      focusItemValue = _useState2[0],
-      setFocusItemValue = _useState2[1];
-
+    focusItemValue = _useState2[0],
+    setFocusItemValue = _useState2[1];
   var _useFlattenTreeData = (0, _treeUtils.useFlattenTreeData)({
-    data: treeData,
-    labelKey: labelKey,
-    valueKey: valueKey,
-    childrenKey: childrenKey,
-    callback: function callback() {
-      // after flattenData, always trigger re-render
-      forceUpdate();
-    }
-  }),
-      flattenNodes = _useFlattenTreeData.flattenNodes,
-      forceUpdate = _useFlattenTreeData.forceUpdate,
-      formatVirtualizedTreeData = _useFlattenTreeData.formatVirtualizedTreeData;
-
+      data: treeData,
+      labelKey: labelKey,
+      valueKey: valueKey,
+      childrenKey: childrenKey,
+      callback: function callback() {
+        // after flattenData, always trigger re-render
+        forceUpdate();
+      }
+    }),
+    flattenNodes = _useFlattenTreeData.flattenNodes,
+    forceUpdate = _useFlattenTreeData.forceUpdate,
+    formatVirtualizedTreeData = _useFlattenTreeData.formatVirtualizedTreeData;
   var _useClassNames = (0, _utils.useClassNames)(classPrefix),
-      prefix = _useClassNames.prefix,
-      merge = _useClassNames.merge;
-
+    prefix = _useClassNames.prefix,
+    merge = _useClassNames.merge;
   var _useClassNames2 = (0, _utils.useClassNames)('tree'),
-      treePrefix = _useClassNames2.prefix,
-      withTreeClassPrefix = _useClassNames2.withClassPrefix;
-
+    treePrefix = _useClassNames2.prefix,
+    withTreeClassPrefix = _useClassNames2.withClassPrefix;
   var _useTreeSearch = (0, _treeUtils.useTreeSearch)({
-    labelKey: labelKey,
-    childrenKey: childrenKey,
-    searchKeyword: searchKeyword,
-    data: treeData,
-    searchBy: searchBy,
-    callback: function callback(searchKeyword, _filterData, event) {
-      onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchKeyword, event);
-    }
-  }),
-      filteredData = _useTreeSearch.filteredData,
-      searchKeywordState = _useTreeSearch.searchKeywordState,
-      setSearchKeyword = _useTreeSearch.setSearchKeyword,
-      handleSearch = _useTreeSearch.handleSearch,
-      setFilteredData = _useTreeSearch.setFilteredData;
-
+      labelKey: labelKey,
+      childrenKey: childrenKey,
+      searchKeyword: searchKeyword,
+      data: treeData,
+      searchBy: searchBy,
+      callback: function callback(searchKeyword, _filterData, event) {
+        onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchKeyword, event);
+      }
+    }),
+    filteredData = _useTreeSearch.filteredData,
+    searchKeywordState = _useTreeSearch.searchKeywordState,
+    setSearchKeyword = _useTreeSearch.setSearchKeyword,
+    handleSearch = _useTreeSearch.handleSearch,
+    setFilteredData = _useTreeSearch.setFilteredData;
   var _useTreeDrag = (0, _treeUtils.useTreeDrag)(),
-      dragNodeKeys = _useTreeDrag.dragNodeKeys,
-      dragOverNodeKey = _useTreeDrag.dragOverNodeKey,
-      dragNode = _useTreeDrag.dragNode,
-      dropNodePosition = _useTreeDrag.dropNodePosition,
-      setDragNodeKeys = _useTreeDrag.setDragNodeKeys,
-      setDragOverNodeKey = _useTreeDrag.setDragOverNodeKey,
-      setDragNode = _useTreeDrag.setDragNode,
-      setDropNodePosition = _useTreeDrag.setDropNodePosition;
-
+    dragNodeKeys = _useTreeDrag.dragNodeKeys,
+    dragOverNodeKey = _useTreeDrag.dragOverNodeKey,
+    dragNode = _useTreeDrag.dragNode,
+    dropNodePosition = _useTreeDrag.dropNodePosition,
+    setDragNodeKeys = _useTreeDrag.setDragNodeKeys,
+    setDragOverNodeKey = _useTreeDrag.setDragOverNodeKey,
+    setDragNode = _useTreeDrag.setDragNode,
+    setDropNodePosition = _useTreeDrag.setDropNodePosition;
   var _useTreeNodeRefs = (0, _treeUtils.useTreeNodeRefs)(),
-      treeNodesRefs = _useTreeNodeRefs.treeNodesRefs,
-      saveTreeNodeRef = _useTreeNodeRefs.saveTreeNodeRef;
-
+    treeNodesRefs = _useTreeNodeRefs.treeNodesRefs,
+    saveTreeNodeRef = _useTreeNodeRefs.saveTreeNodeRef;
   var activeNode = (0, _treeUtils.getTreeActiveNode)(flattenNodes, value, valueKey);
   var getFormattedNodes = (0, _react.useCallback)(function (render) {
     if (virtualized) {
@@ -222,7 +189,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
         return n.visible;
       });
     }
-
     return filteredData.map(function (dataItem, index) {
       return render === null || render === void 0 ? void 0 : render(dataItem, index, 1);
     });
@@ -263,10 +229,8 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     return {
       /** draggingNode */
       dragNode: dragNode,
-
       /** dropNode */
       dropNode: nodeData,
-
       /** dragAndDrop Position type */
       dropNodePosition: dropNodePosition,
       createUpdateDataFunction: (0, _treeUtils.createUpdateTreeDataFunction)({
@@ -276,7 +240,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       }, options)
     };
   }, [dragNode, valueKey, childrenKey, dropNodePosition]);
-
   var getTreeNodeProps = function getTreeNodeProps(node, layer, index) {
     var draggingNode = dragNode !== null && dragNode !== void 0 ? dragNode : {};
     return {
@@ -314,10 +277,10 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       onRenderTreeNode: renderTreeNode,
       onRenderTreeIcon: renderTreeIcon
     };
-  }; // TODO-Doma
-  // Replace `getKeyParentMap` with `getParentMap`
-
+  };
 
+  // TODO-Doma
+  // Replace `getKeyParentMap` with `getParentMap`
   var itemParentMap = (0, _react.useMemo)(function () {
     return (0, _treeUtils.getKeyParentMap)(data, function (node) {
       return node[valueKey];
@@ -327,17 +290,13 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   }, [childrenKey, data, valueKey]);
   var handleSelect = (0, _react.useCallback)(function (nodeData, event) {
     var _targetRef$current, _triggerRef$current, _triggerRef$current$c;
-
     if (!nodeData) {
       return;
     }
-
     var nodeValue = nodeData[valueKey];
-
     if (!isControlled) {
       setValue(nodeValue);
     }
-
     setFocusItemValue(nodeData[valueKey]);
     onChange === null || onChange === void 0 ? void 0 : onChange(nodeValue, event);
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(nodeData, nodeValue, event);
@@ -359,7 +318,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       valueKey: valueKey,
       childrenKey: childrenKey
     }));
-
     if ((0, _isFunction2.default)(getChildren) && !node.expand && Array.isArray(node[childrenKey]) && node[childrenKey].length === 0) {
       loadChildren(node, getChildren);
     }
@@ -367,7 +325,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var handleDragStart = (0, _react.useCallback)(function (nodeData, event) {
     if (draggable) {
       var _event$dataTransfer;
-
       var dragMoverNode = (0, _treeUtils.createDragPreview)((0, _treeUtils.stringifyTreeNodeLabel)(nodeData[labelKey]), treePrefix('drag-preview'));
       (_event$dataTransfer = event.dataTransfer) === null || _event$dataTransfer === void 0 ? void 0 : _event$dataTransfer.setDragImage(dragMoverNode, 0, 0);
       setDragNodeKeys((0, _treeUtils.getDragNodeKeys)(nodeData, childrenKey, valueKey));
@@ -381,12 +338,10 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     })) {
       return;
     }
-
     if (dragNode) {
       setDragOverNodeKey(nodeData[valueKey]);
       setDropNodePosition((0, _treeUtils.calDropNodePosition)(event, treeNodesRefs[nodeData.refKey]));
     }
-
     onDragEnter === null || onDragEnter === void 0 ? void 0 : onDragEnter(nodeData, event);
   }, [dragNode, treeNodesRefs, dragNodeKeys, onDragEnter, setDragOverNodeKey, setDropNodePosition, valueKey]);
   var handleDragOver = (0, _react.useCallback)(function (nodeData, event) {
@@ -396,13 +351,11 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       event.dataTransfer.dropEffect = 'none';
       return;
     }
-
     if (dragNode && (0, _utils.shallowEqual)(nodeData[valueKey], dragOverNodeKey)) {
       var lastDropNodePosition = (0, _treeUtils.calDropNodePosition)(event, treeNodesRefs[nodeData.refKey]);
       if (lastDropNodePosition === dropNodePosition) return;
       setDropNodePosition(lastDropNodePosition);
     }
-
     onDragOver === null || onDragOver === void 0 ? void 0 : onDragOver(nodeData, event);
   }, [dragNode, dragNodeKeys, dragOverNodeKey, dropNodePosition, onDragOver, setDropNodePosition, treeNodesRefs, valueKey]);
   var handleDragLeave = (0, _react.useCallback)(function (nodeData, event) {
@@ -424,7 +377,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       var dropData = getDropData(nodeData);
       onDrop === null || onDrop === void 0 ? void 0 : onDrop(dropData, event);
     }
-
     (0, _treeUtils.removeDragPreview)();
     setDragNode(null);
     setDragNodeKeys([]);
@@ -432,7 +384,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   }, [dragNodeKeys, setDragNode, setDragOverNodeKey, setDragNodeKeys, onDrop, getDropData, valueKey]);
   var handleOpen = (0, _react.useCallback)(function () {
     var _triggerRef$current2, _triggerRef$current2$;
-
     (_triggerRef$current2 = triggerRef.current) === null || _triggerRef$current2 === void 0 ? void 0 : (_triggerRef$current2$ = _triggerRef$current2.open) === null || _triggerRef$current2$ === void 0 ? void 0 : _triggerRef$current2$.call(_triggerRef$current2);
     focusActiveNode();
     onOpen === null || onOpen === void 0 ? void 0 : onOpen();
@@ -440,7 +391,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   }, [focusActiveNode, onOpen]);
   var handleClose = (0, _react.useCallback)(function () {
     var _triggerRef$current3, _triggerRef$current3$, _targetRef$current2;
-
     (_triggerRef$current3 = triggerRef.current) === null || _triggerRef$current3 === void 0 ? void 0 : (_triggerRef$current3$ = _triggerRef$current3.close) === null || _triggerRef$current3$ === void 0 ? void 0 : _triggerRef$current3$.call(_triggerRef$current3);
     setSearchKeyword('');
     setActive(false);
@@ -448,7 +398,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     /**
      * when using keyboard toggle picker, should refocus on PickerToggle Component after close picker menu
      */
-
     (_targetRef$current2 = targetRef.current) === null || _targetRef$current2 === void 0 ? void 0 : _targetRef$current2.focus();
   }, [activeNode, setSearchKeyword, valueKey]);
   (0, _Picker.usePublicMethods)(ref, {
@@ -477,12 +426,10 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
         setFocusItemValue(nextFocusItemValue);
       }
     };
-
     if (key === _utils.KEY_VALUES.DOWN) {
       (0, _treeUtils.focusNextItem)(focusProps);
       return;
     }
-
     if (key === _utils.KEY_VALUES.UP) {
       (0, _treeUtils.focusPreviousItem)(focusProps);
     }
@@ -497,7 +444,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       childrenKey: childrenKey,
       onFocusItem: function onFocusItem() {
         var _focusItem$parent, _focusItem$parent2;
-
         setFocusItemValue(focusItem === null || focusItem === void 0 ? void 0 : (_focusItem$parent = focusItem.parent) === null || _focusItem$parent === void 0 ? void 0 : _focusItem$parent[valueKey]);
         (0, _treeUtils.focusTreeNode)(focusItem === null || focusItem === void 0 ? void 0 : (_focusItem$parent2 = focusItem.parent) === null || _focusItem$parent2 === void 0 ? void 0 : _focusItem$parent2.refKey, treeNodesRefs, "." + treePrefix('node-label'));
       }
@@ -523,16 +469,14 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   }, [flattenNodes, valueKey, focusItemValue, handleSelect]);
   var handleClean = (0, _react.useCallback)(function (event) {
     var nullValue = null;
-    var target = event.target; // exclude searchBar
-
+    var target = event.target;
+    // exclude searchBar
     if (target.matches('div[role="searchbox"] > input') || disabled || !cleanable) {
       return;
     }
-
     if (!isControlled) {
       setValue(null);
     }
-
     onChange === null || onChange === void 0 ? void 0 : onChange(nullValue, event);
   }, [cleanable, disabled, onChange, setValue, isControlled]);
   var onPickerKeydown = (0, _Picker.useToggleKeyDownEvent)((0, _extends2.default)({
@@ -563,7 +507,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     if (!treeViewRef.current) {
       return;
     }
-
     (0, _Picker.onMenuKeyDown)(event, {
       down: function down() {
         return handleFocusItem(_utils.KEY_VALUES.DOWN);
@@ -576,12 +519,10 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       enter: selectActiveItem
     });
   }, [handleFocusItem, handleLeftArrow, handleRightArrow, rtl, selectActiveItem]);
-
   var renderNode = function renderNode(node, index, layer) {
     if (!node.visible) {
       return null;
     }
-
     var children = node[childrenKey];
     var expand = (0, _treeUtils.getExpandWhenSearching)(searchKeywordState, expandItemValues.includes(node[valueKey]));
     var visibleChildren = (0, _isUndefined2.default)(searchKeywordState) || searchKeywordState.length === 0 ? !!children : (0, _treeUtils.hasVisibleChildren)(node, childrenKey);
@@ -590,10 +531,8 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     }), layer, index), {
       hasChildren: visibleChildren
     });
-
     if (nodeProps.hasChildren) {
       var _merge;
-
       layer += 1;
       var openClass = treePrefix('open');
       var childrenClass = merge(treePrefix('node-children'), (_merge = {}, _merge[openClass] = expand && visibleChildren, _merge));
@@ -614,7 +553,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
         style: (0, _treeUtils.getTreeNodeIndent)(rtl, layer - 1, true)
       })));
     }
-
     return /*#__PURE__*/_react.default.createElement(_TreeNode.default, (0, _extends2.default)({
       ref: function ref(_ref2) {
         return saveTreeNodeRef(_ref2, node.refKey);
@@ -622,20 +560,17 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       key: node[valueKey]
     }, nodeProps));
   };
-
   var renderVirtualListNode = function renderVirtualListNode(_ref3) {
     var index = _ref3.index,
-        style = _ref3.style,
-        data = _ref3.data;
+      style = _ref3.style,
+      data = _ref3.data;
     var node = data[index];
     var layer = node.layer,
-        visible = node.visible;
+      visible = node.visible;
     var expand = (0, _treeUtils.getExpandWhenSearching)(searchKeywordState, expandItemValues.includes(node[valueKey]));
-
     if (!node.visible) {
       return null;
     }
-
     var nodeProps = (0, _extends2.default)({}, getTreeNodeProps((0, _extends2.default)({}, node, {
       expand: expand
     }), layer), {
@@ -648,10 +583,8 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       }
     }, nodeProps));
   };
-
   var renderTree = function renderTree() {
     var _withTreeClassPrefix;
-
     var classes = withTreeClassPrefix((_withTreeClassPrefix = {}, _withTreeClassPrefix[className !== null && className !== void 0 ? className : ''] = inline, _withTreeClassPrefix.virtualized = virtualized, _withTreeClassPrefix));
     var formattedNodes = getFormattedNodes(renderNode);
     var styles = inline ? (0, _extends2.default)({
@@ -683,11 +616,10 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       }, listProps), renderVirtualListNode);
     }) : formattedNodes));
   };
-
   var renderDropdownMenu = function renderDropdownMenu(positionProps, speakerRef) {
     var left = positionProps.left,
-        top = positionProps.top,
-        className = positionProps.className;
+      top = positionProps.top,
+      className = positionProps.className;
     var classes = merge(className, menuClassName, prefix('tree-menu'));
     var mergedMenuStyle = (0, _extends2.default)({}, menuStyle, {
       left: left,
@@ -707,42 +639,35 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       inputRef: searchInputRef
     }) : null, renderMenu ? renderMenu(renderTree()) : renderTree(), renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());
   };
+
   /**
    * 1.Have a value and the value is valid.
    * 2.Regardless of whether the value is valid, as long as renderValue is set, it is judged to have a value.
    */
-
-
   var hasValidValue = !(0, _isNil2.default)(activeNode) || !(0, _isNil2.default)(value) && (0, _isFunction2.default)(renderValue);
   var selectedElement = placeholder;
-
   if (hasValidValue) {
     var node = activeNode !== null && activeNode !== void 0 ? activeNode : {};
     selectedElement = node[labelKey];
-
     if ((0, _isFunction2.default)(renderValue) && value) {
       selectedElement = renderValue(value, node, selectedElement);
-
       if ((0, _isNil2.default)(selectedElement)) {
         hasValidValue = false;
       }
     }
   }
-
   var _usePickerClassName = (0, _Picker.usePickerClassName)((0, _extends2.default)({}, props, {
-    classPrefix: classPrefix,
-    appearance: appearance,
-    hasValue: hasValidValue,
-    name: 'tree',
-    cleanable: cleanable
-  })),
-      classes = _usePickerClassName[0],
-      usedClassNamePropKeys = _usePickerClassName[1];
-
+      classPrefix: classPrefix,
+      appearance: appearance,
+      hasValue: hasValidValue,
+      name: 'tree',
+      cleanable: cleanable
+    })),
+    classes = _usePickerClassName[0],
+    usedClassNamePropKeys = _usePickerClassName[1];
   if (inline) {
     return renderTree();
   }
-
   return /*#__PURE__*/_react.default.createElement(_Picker.PickerToggleTrigger, {
     pickerProps: (0, _pick2.default)(props, _Picker.pickTriggerPropKeys),
     ref: triggerRef,
@@ -770,7 +695,6 @@ var TreePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     inputValue: value
   }), selectedElement || locale.placeholder)));
 });
-
 TreePicker.displayName = 'TreePicker';
 TreePicker.propTypes = (0, _extends2.default)({}, _Picker.listPickerPropTypes, {
   locale: _propTypes.default.any,