@para-ui/core 3.0.0 → 3.0.1

package/Selector/index.js

@@ -1,49 +1,54 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import 'react';
-import '../Tooltip/index.js';
-import '@para-ui/icons/Help';
-import 'clsx';
-import '../Help/index.js';
-import '../Label/index.js';
+import { _ as _toConsumableArray } from '../_verture/toConsumableArray-f8047a75.js';
+import { _ as _slicedToArray } from '../_verture/slicedToArray-d7722f4b.js';
+import { r as regenerator } from '../_verture/index-342379c6.js';
+import { a as __awaiter, _ as __rest } from '../_verture/tslib.es6-55ed4bd2.js';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { useState, useRef, useEffect, Fragment as Fragment$1 } from 'react';
 import { Radio } from '../Radio/index.js';
 import { Checkbox } from '../Checkbox/index.js';
+import { Popover } from '../Popover/index.js';
+import { Loading } from '../Loading/index.js';
 import CloseIcon from '@para-ui/icons/Close';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
 import { Search } from '../Search/index.js';
 import { Breadcrumbs } from '../Breadcrumbs/index.js';
-import '../_verture/slicedToArray-d7722f4b.js';
-import '../_verture/tslib.es6-55ed4bd2.js';
+import Empty from '../Empty/index.js';
+import SearchIcon from '@para-ui/icons/Search';
+import Refresh from '@para-ui/icons/Refresh';
+import { ArrayToObject, Get, Post, Cancel } from '@paraview/lib';
+import { u as useFormatMessage } from '../_verture/useFormatMessage-ac9d6acf.js';
+import { u as useGlobalProps } from '../_verture/useGlobalProps-af9a2af6.js';
+import '../Label/index.js';
+import '../Help/index.js';
+import '../Tooltip/index.js';
 import 'rc-tooltip';
 import 'rc-tooltip/lib/placements';
+import 'clsx';
+import '@para-ui/icons/Help';
+import '@para-ui/icons/LoadingF';
 import '../TextField/index.js';
 import '../_verture/typeof-498dd2b1.js';
-import '@paraview/lib';
 import '@para-ui/icons/PreviewClose';
 import '@para-ui/icons/PreviewOpen';
 import '@para-ui/icons/CloseCircle';
 import '../AutoTips/index.js';
-import '../Loading/index.js';
-import '@para-ui/icons/LoadingF';
 import '../HelperText/index.js';
-import '../_verture/useGlobalProps-af9a2af6.js';
-import '@para-ui/core/GlobalContext';
 import '../Dropdown/index.js';
 import 'rc-dropdown';
 import '../Button/index.js';
 import '@para-ui/icons/Forbid';
 import '@para-ui/icons/Down';
-import '../_verture/useFormatMessage-ac9d6acf.js';
-import '@para-ui/icons/Search';
-import '../_verture/toConsumableArray-f8047a75.js';
-import '../Popover/index.js';
+import '@para-ui/core/GlobalContext';
 import '@para-ui/icons/More';
 
-var css_248z$3 = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-branch-node {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  height: 36px;\n  cursor: pointer;\n  padding: 0 16px;\n}\n.paraui-branch-node:hover {\n  background-color: rgba(171, 176, 185, 0.12);\n}\n.paraui-branch-node > .paraui-branch-node-left {\n  display: flex;\n  align-items: center;\n}\n.paraui-branch-node > .paraui-branch-node-left > .paraui-radio {\n  margin-right: 8px;\n  display: flex;\n  align-items: center;\n}\n.paraui-branch-node > .paraui-branch-node-left > .paraui-radio .paraui-radio-box {\n  top: 0;\n}\n.paraui-branch-node > .paraui-branch-node-left > .paraui-check-box {\n  margin-right: 8px;\n  display: flex;\n  align-items: center;\n}\n.paraui-branch-node > .paraui-branch-node-left > .paraui-check-box .paraui-checkbox-box {\n  top: 0;\n}\n.paraui-branch-node > .paraui-branch-node-left > .node-img {\n  display: inline-block;\n  width: 30px;\n  height: 30px;\n  margin-right: 8px;\n}\n.paraui-branch-node > .paraui-branch-node-left > .node-img img {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n}\n.paraui-branch-node > .paraui-branch-node-left > .main-title {\n  font-size: 14px;\n  color: rgb(46, 55, 67);\n  white-space: nowrap;\n  height: 20px;\n}\n.paraui-branch-node > .paraui-branch-node-left > .sub-title {\n  margin-left: 8px;\n  font-size: 14px;\n  color: rgba(46, 55, 67, 0.4);\n  white-space: nowrap;\n  height: 20px;\n}\n.paraui-branch-node > .paraui-branch-node-left > .tag {\n  margin-left: 8px;\n  background-color: rgba(54, 102, 214, 0.05);\n  color: rgb(54, 102, 214);\n  border-radius: 2px;\n  font-size: 12px;\n  padding: 0px 6px;\n  white-space: nowrap;\n  height: 17px;\n}\n.paraui-branch-node > .paraui-branch-node-right {\n  display: flex;\n  align-items: center;\n  height: 100%;\n}\n.paraui-branch-node > .paraui-branch-node-right > .detail {\n  font-size: 14px;\n  color: rgb(54, 102, 214);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-branch-node > .paraui-branch-node-right > .detail:hover {\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-branch-node > .paraui-branch-node-right > .line {\n  border-left: 1px solid rgba(171, 176, 185, 0.2);\n  margin: 0 8px;\n  content: \"\";\n  display: inline-block;\n  height: 12px;\n}\n.paraui-branch-node > .paraui-branch-node-right > .lower-level {\n  font-size: 14px;\n  color: rgb(54, 102, 214);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-branch-node > .paraui-branch-node-right > .lower-level:hover {\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-branch-node > .paraui-branch-node-right > .close {\n  display: flex;\n  align-items: center;\n  color: rgb(54, 102, 214);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-branch-node > .paraui-branch-node-right > .close:hover {\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-branch-node > .paraui-branch-node-right > .close:hover > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-branch-node > .paraui-branch-node-right > .close > svg {\n  font-size: 16px;\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-branch-node.paraui-branch-node-edit > .paraui-branch-node-right > .detail, .paraui-branch-node.paraui-branch-node-edit > .paraui-branch-node-right > .lower-level {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-branch-node.paraui-branch-node-edit > .paraui-branch-node-right > .detail:hover, .paraui-branch-node.paraui-branch-node-edit > .paraui-branch-node-right > .lower-level:hover {\n  color: rgb(54, 102, 214);\n}";
+var css_248z$3 = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-selector-node {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  cursor: pointer;\n}\n.paraui-selector-node:hover {\n  background-color: rgba(171, 176, 185, 0.12);\n}\n.paraui-selector-node > .paraui-selector-node-left {\n  display: flex;\n  align-items: center;\n  flex: 1;\n  overflow: hidden;\n  padding-right: 16px;\n}\n.paraui-selector-node > .paraui-selector-node-left > .paraui-radio {\n  margin-right: 8px;\n  display: flex;\n  align-items: center;\n}\n.paraui-selector-node > .paraui-selector-node-left > .paraui-radio .paraui-radio-box {\n  top: 0;\n}\n.paraui-selector-node > .paraui-selector-node-left > .paraui-check-box {\n  margin-right: 8px;\n  display: flex;\n  align-items: center;\n}\n.paraui-selector-node > .paraui-selector-node-left > .paraui-check-box .paraui-checkbox-box {\n  top: 0;\n}\n.paraui-selector-node > .paraui-selector-node-left > .node-img {\n  display: inline-block;\n  width: 30px;\n  height: 30px;\n  margin-right: 8px;\n}\n.paraui-selector-node > .paraui-selector-node-left > .node-img img {\n  width: 30px;\n  height: 30px;\n  border-radius: 50%;\n}\n.paraui-selector-node.paraui-selector-node-branch {\n  height: 36px;\n  padding: 0 16px;\n}\n.paraui-selector-node.paraui-selector-node-branch > .paraui-selector-node-left > .main-title {\n  font-size: 14px;\n  color: rgb(46, 55, 67);\n  white-space: nowrap;\n  height: 20px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-selector-node.paraui-selector-node-branch > .paraui-selector-node-left > .sub-title {\n  margin-left: 8px;\n  font-size: 14px;\n  color: rgba(46, 55, 67, 0.4);\n  white-space: nowrap;\n  height: 20px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-selector-node.paraui-selector-node-branch > .paraui-selector-node-left > .tag {\n  margin-left: 8px;\n  background-color: rgba(54, 102, 214, 0.05);\n  color: rgb(54, 102, 214);\n  border-radius: 2px;\n  font-size: 12px;\n  padding: 0px 6px;\n  white-space: nowrap;\n  height: 17px;\n}\n.paraui-selector-node.paraui-selector-node-leaf {\n  padding: 6px 16px;\n  height: 48px;\n}\n.paraui-selector-node.paraui-selector-node-leaf > .paraui-selector-node-left > .title-box {\n  flex: 1;\n  overflow: hidden;\n}\n.paraui-selector-node.paraui-selector-node-leaf > .paraui-selector-node-left > .title-box > .main-title-box {\n  display: flex;\n  white-space: nowrap;\n}\n.paraui-selector-node.paraui-selector-node-leaf > .paraui-selector-node-left > .title-box > .main-title-box > .main-title {\n  font-size: 14px;\n  color: rgb(46, 55, 67);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-selector-node.paraui-selector-node-leaf > .paraui-selector-node-left > .title-box > .main-title-box > .tag {\n  margin-left: 8px;\n  background-color: rgba(54, 102, 214, 0.05);\n  color: rgb(54, 102, 214);\n  border-radius: 2px;\n  font-size: 12px;\n  padding: 1px 6px;\n  white-space: nowrap;\n}\n.paraui-selector-node.paraui-selector-node-leaf > .paraui-selector-node-left > .title-box > .sub-title {\n  font-size: 12px;\n  color: rgba(46, 55, 67, 0.4);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-selector-node > .paraui-selector-node-right {\n  display: flex;\n  align-items: center;\n  height: 100%;\n}\n.paraui-selector-node > .paraui-selector-node-right > .detail {\n  font-size: 14px;\n  color: rgb(54, 102, 214);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-selector-node > .paraui-selector-node-right > .detail:hover {\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-selector-node > .paraui-selector-node-right > .line {\n  border-left: 1px solid rgba(171, 176, 185, 0.2);\n  margin: 0 8px;\n  content: \"\";\n  display: inline-block;\n  height: 12px;\n}\n.paraui-selector-node > .paraui-selector-node-right > .lower-child {\n  font-size: 14px;\n  color: rgb(54, 102, 214);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-selector-node > .paraui-selector-node-right > .lower-child:hover {\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-selector-node > .paraui-selector-node-right > .close {\n  display: flex;\n  align-items: center;\n  color: rgb(54, 102, 214);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-selector-node > .paraui-selector-node-right > .close:hover {\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-selector-node > .paraui-selector-node-right > .close:hover > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-selector-node > .paraui-selector-node-right > .close > svg {\n  font-size: 16px;\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-selector-node.paraui-selector-node-edit > .paraui-selector-node-right > .detail, .paraui-selector-node.paraui-selector-node-edit > .paraui-selector-node-right > .lower-child {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-selector-node.paraui-selector-node-edit > .paraui-selector-node-right > .detail:hover, .paraui-selector-node.paraui-selector-node-edit > .paraui-selector-node-right > .lower-child:hover {\n  color: rgb(54, 102, 214);\n}\n.paraui-selector-node.paraui-selector-node-disabled {\n  cursor: not-allowed;\n}\n.paraui-selector-node.paraui-selector-node-disabled.paraui-selector-node-branch > .paraui-selector-node-left > .main-title {\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-selector-node.paraui-selector-node-disabled.paraui-selector-node-leaf > .paraui-selector-node-left > .title-box > .main-title-box > .main-title {\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-selector-node.paraui-selector-node-disabled > .paraui-selector-node-right > .lower-child {\n  cursor: not-allowed;\n  color: rgba(46, 55, 67, 0.4);\n}\n\n.paraui-selector-detail-popover-content.paraui-selector-detail-popover-content-loading {\n  min-width: 100px;\n  min-height: 50px;\n}";
 styleInject(css_248z$3);
 
-var BranchNode = function BranchNode(props) {
+var SelectorNode = function SelectorNode(props) {
   var className = props.className,
       style = props.style,
+      _props$nodeMode = props.nodeMode,
+      nodeMode = _props$nodeMode === void 0 ? 'branch' : _props$nodeMode,
       _props$useCase = props.useCase,
       useCase = _props$useCase === void 0 ? 'view' : _props$useCase,
       img = props.img,
@@ -52,99 +57,105 @@ var BranchNode = function BranchNode(props) {
       subTitle = props.subTitle,
       tag = props.tag,
       detail = props.detail,
-      level = props.level,
-      close = props.close; // 处理头像
+      detailRender = props.detailRender,
+      child = props.child,
+      close = props.close,
+      checked = props.checked,
+      indeterminate = props.indeterminate,
+      disabled = props.disabled,
+      onLevel = props.onLevel,
+      onSelect = props.onSelect,
+      onClose = props.onClose;
 
-  var handImg = function handImg() {
-    if (!img) return null;
-    var imgDom = img;
-    if (typeof img === "string") imgDom = jsx("img", {
-      src: img
-    });
-    return jsx("span", Object.assign({
-      className: "node-img"
-    }, {
-      children: imgDom
-    }));
+  var _useState = useState(),
+      _useState2 = _slicedToArray(_useState, 2),
+      detailDom = _useState2[0],
+      setDetailDom = _useState2[1]; // 详情内容
+
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      detailDomLoading = _useState4[0],
+      setDetailDomLoading = _useState4[1]; // 详情loading
+
+
+  var detailRef = useRef();
+  /** 点击节点 */
+
+  var onClickNode = function onClickNode() {
+    if (disabled) return;
+    onSelect && onSelect();
   };
+  /** 点击下级 */
 
-  var handSelectDom = function handSelectDom() {
-    if (selectMode === 'radio') return jsx(Radio, {
-      size: "small"
-    });
-    if (selectMode === 'check') return jsx(Checkbox, {
-      size: "small"
-    });
-    return null;
+
+  var onLevelBtn = function onLevelBtn(e) {
+    e.stopPropagation();
+    if (disabled) return;
+    onLevel && onLevel();
   };
+  /** 点击详情 */
 
-  var handClass = function handClass() {
-    var str = 'paraui-branch-node';
-    if (className) str += ' ' + className;
-    str += ' paraui-branch-node-' + useCase;
-    return str;
+
+  var onClickDetail = function onClickDetail(e) {
+    e.stopPropagation();
   };
+  /** 点击× */
 
-  return jsxs("div", Object.assign({
-    className: handClass(),
-    style: style
-  }, {
-    children: [jsxs("div", Object.assign({
-      className: "paraui-branch-node-left"
-    }, {
-      children: [handSelectDom(), handImg(), mainTitle && jsx("span", Object.assign({
-        className: "main-title"
-      }, {
-        children: mainTitle
-      })), subTitle && jsx("span", Object.assign({
-        className: "sub-title"
-      }, {
-        children: subTitle
-      })), tag && jsx("span", Object.assign({
-        className: "tag"
-      }, {
-        children: tag
-      }))]
-    })), jsxs("div", Object.assign({
-      className: "paraui-branch-node-right"
-    }, {
-      children: [detail && jsx("span", Object.assign({
-        className: "detail"
-      }, {
-        children: "\u8BE6\u60C5"
-      })), detail && level && jsx("span", {
-        className: "line"
-      }), level && jsx("span", Object.assign({
-        className: "lower-level"
-      }, {
-        children: "\u4E0B\u7EA7"
-      })), detail && close && jsx("span", {
-        className: "line"
-      }), close && jsx("span", Object.assign({
-        className: "close"
-      }, {
-        children: jsx(CloseIcon, {})
-      }))]
-    }))]
-  }));
-};
 
-var css_248z$2 = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-leaf-node {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 6px 16px;\n  height: 48px;\n  cursor: pointer;\n}\n.paraui-leaf-node:hover {\n  background-color: rgba(171, 176, 185, 0.12);\n}\n.paraui-leaf-node > .paraui-leaf-node-left {\n  display: flex;\n  align-items: center;\n}\n.paraui-leaf-node > .paraui-leaf-node-left > .paraui-radio {\n  margin-right: 8px;\n  display: flex;\n  align-items: center;\n}\n.paraui-leaf-node > .paraui-leaf-node-left > .paraui-radio .paraui-radio-box {\n  top: 0;\n}\n.paraui-leaf-node > .paraui-leaf-node-left > .paraui-check-box {\n  margin-right: 8px;\n  display: flex;\n  align-items: center;\n}\n.paraui-leaf-node > .paraui-leaf-node-left > .paraui-check-box .paraui-checkbox-box {\n  top: 0;\n}\n.paraui-leaf-node > .paraui-leaf-node-left > .node-img {\n  display: inline-block;\n  width: 30px;\n  height: 30px;\n  margin-right: 8px;\n}\n.paraui-leaf-node > .paraui-leaf-node-left > .node-img img {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n}\n.paraui-leaf-node > .paraui-leaf-node-left > .title-box > .main-title-box {\n  white-space: nowrap;\n}\n.paraui-leaf-node > .paraui-leaf-node-left > .title-box > .main-title-box > .main-title {\n  font-size: 14px;\n  color: rgb(46, 55, 67);\n  white-space: nowrap;\n}\n.paraui-leaf-node > .paraui-leaf-node-left > .title-box > .main-title-box > .tag {\n  margin-left: 8px;\n  background-color: rgba(54, 102, 214, 0.05);\n  color: rgb(54, 102, 214);\n  border-radius: 2px;\n  font-size: 12px;\n  padding: 1px 6px;\n  white-space: nowrap;\n}\n.paraui-leaf-node > .paraui-leaf-node-left > .title-box > .sub-title {\n  font-size: 12px;\n  color: rgba(46, 55, 67, 0.4);\n  white-space: nowrap;\n}\n.paraui-leaf-node > .paraui-leaf-node-right {\n  display: flex;\n  align-items: center;\n  height: 100%;\n}\n.paraui-leaf-node > .paraui-leaf-node-right > .detail {\n  font-size: 14px;\n  color: rgb(54, 102, 214);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-leaf-node > .paraui-leaf-node-right > .detail:hover {\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-leaf-node > .paraui-leaf-node-right > .line {\n  border-left: 1px solid rgba(171, 176, 185, 0.2);\n  margin: 0 8px;\n  content: \"\";\n  display: inline-block;\n  height: 12px;\n}\n.paraui-leaf-node > .paraui-leaf-node-right > .lower-level {\n  font-size: 14px;\n  color: rgb(54, 102, 214);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-leaf-node > .paraui-leaf-node-right > .lower-level:hover {\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-leaf-node > .paraui-leaf-node-right > .close {\n  display: flex;\n  align-items: center;\n  color: rgb(54, 102, 214);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-leaf-node > .paraui-leaf-node-right > .close:hover {\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-leaf-node > .paraui-leaf-node-right > .close:hover > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-leaf-node > .paraui-leaf-node-right > .close > svg {\n  font-size: 16px;\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-leaf-node.paraui-leaf-node-edit > .paraui-leaf-node-right > .detail, .paraui-leaf-node.paraui-leaf-node-edit > .paraui-leaf-node-right > .lower-level {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-leaf-node.paraui-leaf-node-edit > .paraui-leaf-node-right > .detail:hover, .paraui-leaf-node.paraui-leaf-node-edit > .paraui-leaf-node-right > .lower-level:hover {\n  color: rgb(54, 102, 214);\n}";
-styleInject(css_248z$2);
+  var onCloseCom = function onCloseCom(e) {
+    e.stopPropagation();
+    onClose && onClose();
+  };
+  /** 详情显示隐藏 */
+
+
+  var onVisibleChange = function onVisibleChange(bol) {
+    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee() {
+      var Dom;
+      return regenerator.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (detailRender) {
+                _context.next = 2;
+                break;
+              }
+
+              return _context.abrupt("return");
+
+            case 2:
+              setDetailDomLoading(false);
+
+              if (bol) {
+                _context.next = 5;
+                break;
+              }
+
+              return _context.abrupt("return", setDetailDom(null));
+
+            case 5:
+              setDetailDomLoading(true);
+              detailRef.current && detailRef.current.classList.add('paraui-selector-detail-popover-content-loading');
+              _context.next = 9;
+              return detailRender();
+
+            case 9:
+              Dom = _context.sent;
+              detailRef.current && detailRef.current.classList.remove('paraui-selector-detail-popover-content-loading');
+              setDetailDomLoading(false);
+              setDetailDom(Dom);
+
+            case 13:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+  };
+  /** 处理头像 */
 
-var LeafNode = function LeafNode(props) {
-  var className = props.className,
-      style = props.style,
-      _props$useCase = props.useCase,
-      useCase = _props$useCase === void 0 ? 'view' : _props$useCase,
-      img = props.img,
-      selectMode = props.selectMode,
-      mainTitle = props.mainTitle,
-      subTitle = props.subTitle,
-      tag = props.tag,
-      detail = props.detail,
-      level = props.level,
-      close = props.close; // 处理头像
 
   var handImg = function handImg() {
     if (!img) return null;
@@ -157,34 +168,78 @@ var LeafNode = function LeafNode(props) {
     }, {
       children: imgDom
     }));
-  }; // 处理 选择框
+  };
+  /** 处理选择框 */
 
 
   var handSelectDom = function handSelectDom() {
     if (selectMode === 'radio') return jsx(Radio, {
-      size: "small"
+      size: "small",
+      checked: checked,
+      disabled: disabled
     });
     if (selectMode === 'check') return jsx(Checkbox, {
-      size: "small"
+      size: "small",
+      checked: checked,
+      disabled: disabled,
+      indeterminate: indeterminate
     });
     return null;
   };
+  /** 处理详情弹窗 */
 
-  var handClass = function handClass() {
-    var str = 'paraui-leaf-node';
-    if (className) str += ' ' + className;
-    str += ' paraui-leaf-node-' + useCase;
-    return str;
+
+  var handDetailDom = function handDetailDom() {
+    return jsxs("div", Object.assign({
+      className: "paraui-selector-detail-popover-content",
+      ref: detailRef
+    }, {
+      children: [detailDom, detailDomLoading && jsx(Loading, {})]
+    }));
   };
+  /** 处理详情 */
 
-  return jsxs("div", Object.assign({
-    className: handClass(),
-    style: style
-  }, {
-    children: [jsxs("div", Object.assign({
-      className: "paraui-leaf-node-left"
+
+  var handDetail = function handDetail() {
+    if (!detail) return null;
+    return jsx(Popover, Object.assign({
+      content: handDetailDom(),
+      trigger: 'hover',
+      placement: 'bottomRight',
+      onVisibleChange: onVisibleChange
     }, {
-      children: [handSelectDom(), handImg(), jsxs("div", Object.assign({
+      children: jsx("span", Object.assign({
+        className: "detail",
+        onClick: onClickDetail
+      }, {
+        children: "\u8BE6\u60C5"
+      }))
+    }));
+  };
+  /** 处理标签内容 */
+
+
+  var handNodeLeft = function handNodeLeft() {
+    if (nodeMode === 'branch') {
+      return jsxs(Fragment, {
+        children: [mainTitle && jsx("span", Object.assign({
+          className: "main-title"
+        }, {
+          children: mainTitle
+        })), subTitle && jsx("span", Object.assign({
+          className: "sub-title"
+        }, {
+          children: subTitle
+        })), tag && jsx("span", Object.assign({
+          className: "tag"
+        }, {
+          children: tag
+        }))]
+      });
+    }
+
+    if (nodeMode === 'leaf') {
+      return jsxs("div", Object.assign({
         className: "title-box"
       }, {
         children: [jsxs("div", Object.assign({
@@ -204,24 +259,45 @@ var LeafNode = function LeafNode(props) {
         }, {
           children: subTitle
         }))]
-      }))]
+      }));
+    }
+  };
+  /** 处理className */
+
+
+  var handClass = function handClass() {
+    var str = 'paraui-selector-node';
+    str += ' paraui-selector-node-' + useCase;
+    str += ' paraui-selector-node-' + nodeMode;
+    if (disabled) str += ' paraui-selector-node-disabled';
+    if (className) str += ' ' + className;
+    return str;
+  };
+
+  return jsxs("div", Object.assign({
+    className: handClass(),
+    style: style,
+    onClick: onClickNode
+  }, {
+    children: [jsxs("div", Object.assign({
+      className: "paraui-selector-node-left"
+    }, {
+      children: [handSelectDom(), handImg(), handNodeLeft()]
     })), jsxs("div", Object.assign({
-      className: "paraui-leaf-node-right"
+      className: "paraui-selector-node-right"
     }, {
-      children: [detail && jsx("span", Object.assign({
-        className: "detail"
-      }, {
-        children: "\u8BE6\u60C5"
-      })), detail && level && jsx("span", {
+      children: [handDetail(), detail && child && jsx("span", {
         className: "line"
-      }), level && jsx("span", Object.assign({
-        className: "lower-level"
+      }), child && jsx("span", Object.assign({
+        className: "lower-child",
+        onClick: onLevelBtn
       }, {
         children: "\u4E0B\u7EA7"
       })), detail && close && jsx("span", {
         className: "line"
       }), close && jsx("span", Object.assign({
-        className: "close"
+        className: "close",
+        onClick: onCloseCom
       }, {
         children: jsx(CloseIcon, {})
       }))]
@@ -229,114 +305,1819 @@ var LeafNode = function LeafNode(props) {
   }));
 };
 
-var css_248z$1 = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-selector-main {\n  padding: 16px 0;\n  border: 1px solid;\n}\n.paraui-selector-main > .paraui-search {\n  padding: 0 16px;\n  margin-bottom: 16px;\n}\n.paraui-selector-main > .nav-box {\n  padding: 0 16px;\n  margin-bottom: 12px;\n  line-height: 0;\n}\n.paraui-selector-main > .paraui-selector-main-list > .paraui-selector-main-list-more {\n  padding: 0 16px;\n  cursor: pointer;\n  font-size: 14px;\n  color: rgb(54, 102, 214);\n  line-height: 36px;\n}\n.paraui-selector-main > .paraui-selector-main-list > .paraui-selector-main-list-more:hover {\n  background-color: rgba(171, 176, 185, 0.12);\n}\n.paraui-selector-main.paraui-selector-main-select > .paraui-selector-main-list > .paraui-selector-main-list-more {\n  padding-left: 38px;\n}";
-styleInject(css_248z$1);
+var en = {
+  root: 'root',
+  selectAll: 'Select all',
+  seeMore: 'See more',
+  selected: 'Selected',
+  pleaseEnter: 'Please enter'
+};
 
-var list = [{
-  label: '主页'
-}, {
-  label: '管理'
-}, {
-  label: '新建'
-}];
+var zh = {
+  root: '根',
+  selectAll: '全选',
+  seeMore: '查看更多',
+  selected: '已选',
+  pleaseEnter: '请输入'
+};
 
-var SelectorMain = function SelectorMain(props) {
+var localeJson = {
+  zh: zh,
+  en: en
+};
+
+var css_248z$2 = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-selector-main {\n  padding: 16px 0 0 0;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n}\n.paraui-selector-main > .paraui-search {\n  padding: 0 16px;\n  margin-bottom: 16px;\n}\n.paraui-selector-main > .paraui-selector-main-box {\n  position: relative;\n  width: 100%;\n  height: 100%;\n}\n.paraui-selector-main > .paraui-selector-main-box > .paraui-selector-main-content {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n}\n.paraui-selector-main > .paraui-selector-main-box > .paraui-selector-main-content > .nav-box {\n  padding: 0 16px;\n  margin-bottom: 12px;\n  line-height: 0;\n}\n.paraui-selector-main > .paraui-selector-main-box > .paraui-selector-main-content > .paraui-selector-main-list {\n  flex: 1;\n  overflow-y: auto;\n  padding-bottom: 16px;\n}\n.paraui-selector-main > .paraui-selector-main-box > .paraui-selector-main-content > .paraui-selector-main-list > .paraui-selector-main-list-no-data {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.paraui-selector-main > .paraui-selector-main-box > .paraui-selector-main-content > .paraui-selector-main-list > .paraui-selector-all-check + .paraui-selector-group-title.paraui-selector-group-title-first {\n  margin-top: 4px;\n}\n.paraui-selector-main > .paraui-selector-main-box > .paraui-selector-main-content > .paraui-selector-main-list > .paraui-selector-group-title {\n  padding: 0 12px;\n  margin-top: 24px;\n  margin-bottom: 12px;\n  font-size: 14px;\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-selector-main > .paraui-selector-main-box > .paraui-selector-main-content > .paraui-selector-main-list > .paraui-selector-group-title.paraui-selector-group-title-first {\n  margin-top: 0;\n}\n.paraui-selector-main > .paraui-selector-main-box > .paraui-selector-main-content > .paraui-selector-main-list > .paraui-selector-main-list-more {\n  padding: 0 16px;\n  cursor: pointer;\n  font-size: 14px;\n  color: rgb(54, 102, 214);\n  line-height: 36px;\n}\n.paraui-selector-main > .paraui-selector-main-box > .paraui-selector-main-content > .paraui-selector-main-list > .paraui-selector-main-list-more:hover {\n  background-color: rgba(171, 176, 185, 0.12);\n}\n.paraui-selector-main > .paraui-selector-main-box > .paraui-selector-main-content.paraui-selector-main-search-content {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  background-color: white;\n}\n.paraui-selector-main > .paraui-selector-main-box > .paraui-selector-main-content.paraui-selector-main-search-content > .paraui-selector-main-list {\n  padding-bottom: 16px;\n}\n.paraui-selector-main.paraui-selector-main-select > .paraui-selector-main-box > .paraui-selector-main-content > .paraui-selector-main-list > .paraui-selector-main-list-more {\n  padding-left: 38px;\n}\n.paraui-selector-main.paraui-selector-main-show-search > .paraui-selector-main-box {\n  height: calc(100% - 52px);\n}\n.paraui-selector-main.paraui-selector-main-show-search > .paraui-selector-main-box > .paraui-selector-main-content.paraui-selector-main-list-box {\n  display: none;\n}\n.paraui-selector-main.paraui-selector-main-search > .paraui-selector-main-box {\n  height: calc(100% - 52px);\n}";
+styleInject(css_248z$2);
+
+var SelectorMainContent = function SelectorMainContent(props) {
   var className = props.className,
-      style = props.style;
+      value = props.value,
+      _props$rowKey = props.rowKey,
+      rowKey = _props$rowKey === void 0 ? 'key' : _props$rowKey,
+      _props$nodeMode = props.nodeMode,
+      nodeMode = _props$nodeMode === void 0 ? 'branch' : _props$nodeMode,
+      selectMode = props.selectMode,
+      _props$loadMore = props.loadMore,
+      loadMore = _props$loadMore === void 0 ? false : _props$loadMore,
+      _props$isAllCheck = props.isAllCheck,
+      isAllCheck = _props$isAllCheck === void 0 ? false : _props$isAllCheck,
+      detail = props.detail,
+      detailRender = props.detailRender,
+      isLazy = props.isLazy,
+      list = props.list,
+      groupType = props.groupType,
+      breadcrumbs = props.breadcrumbs,
+      _props$breadcrumbsSep = props.breadcrumbsSeparator,
+      breadcrumbsSeparator = _props$breadcrumbsSep === void 0 ? '-' : _props$breadcrumbsSep,
+      _props$breadcrumbsLis = props.breadcrumbsList,
+      breadcrumbsList = _props$breadcrumbsLis === void 0 ? [] : _props$breadcrumbsLis,
+      fieldConfig = props.fieldConfig,
+      disabled = props.disabled,
+      emptyProps = props.emptyProps,
+      loading = props.loading,
+      onClickBreadcrumbs = props.onClickBreadcrumbs,
+      _onLevel = props.onLevel,
+      _onSelect = props.onSelect,
+      onLoad = props.onLoad,
+      onAllCheck = props.onAllCheck;
+  var intl = useFormatMessage('Selector', localeJson);
+
+  var _useState = useState({}),
+      _useState2 = _slicedToArray(_useState, 2),
+      listCom = _useState2[0],
+      setListCom = _useState2[1];
+
+  var constData = useRef({
+    listTypeJson: {},
+    fieldConfig: {}
+  });
+  constData.current.listTypeJson = ArrayToObject('value', groupType);
+  constData.current.fieldConfig = fieldConfig || {};
+  useEffect(function () {
+    if (list && groupType && groupType.length > 0) {
+      var json = {};
+
+      for (var i = 0, l = list.length; i < l; i++) {
+        var item = list[i];
+        var type = item[constData.current.fieldConfig.type || ''];
+        if (!json[type]) json[type] = [];
+        json[type].push(item);
+      }
+
+      setListCom(json);
+    }
+  }, [list]);
+  /** 判断是否全选,半选 */
+
+  var handAllCheckFunc = function handAllCheckFunc() {
+    var json = {
+      checked: false,
+      indeterminate: false
+    }; // 不存在value, 没有数据, 全选没转态
+
+    if (!value || !list || list.length === 0) return json;
+
+    for (var i = 0, l = list.length; i < l; i++) {
+      var item = list[i];
+      var key = item[rowKey];
+      var disabledItem = handDisabled(item);
+
+      if (disabledItem) {
+        if (value[key]) json.checked = true;
+        continue;
+      }
+
+      if (value[key]) {
+        json.checked = true;
+      } else {
+        json.indeterminate = true;
+      }
+    } // 半选
+
+
+    if (json.checked && json.indeterminate) {
+      json.checked = false;
+      return json;
+    } // 全不选
+
+
+    if (!json.checked && json.indeterminate) {
+      json.indeterminate = false;
+      return json;
+    }
+
+    return json;
+  };
+  /** 处理禁用状态 */
+
+
+  var handDisabled = function handDisabled(item) {
+    if (disabled) {
+      if (disabled === true) return true;
+
+      if (disabled instanceof Array) {
+        if (item.key && disabled.indexOf(item.key) !== -1) {
+          return true;
+        }
+      }
+    }
+
+    if (item.disabled) return true;
+    return false;
+  };
+  /** 全选 */
+
+
+  var handAllCheck = function handAllCheck() {
+    // 只存在复选框模式
+    if (!isAllCheck || selectMode !== "check") return null;
+    var checkJson = handAllCheckFunc();
+
+    var onAllCheckCom = function onAllCheckCom() {
+      var bol = true;
+      if (checkJson.checked) bol = false;
+      onAllCheck && onAllCheck(bol);
+    };
+
+    return jsx(SelectorNode, Object.assign({
+      disabled: disabled === true,
+      nodeMode: 'branch',
+      mainTitle: intl({
+        id: 'selectAll'
+      }),
+      selectMode: 'check'
+    }, checkJson, {
+      onSelect: onAllCheckCom,
+      className: 'paraui-selector-all-check'
+    }));
+  };
+  /** 点击查看更多 */
+
+
+  var clickLoad = function clickLoad() {
+    onLoad && onLoad();
+  };
+  /** 查看更多 */
+
+
+  var handLoadMore = function handLoadMore() {
+    if (!loadMore) return null;
+    return jsx("div", Object.assign({
+      className: "paraui-selector-main-list-more",
+      onClick: clickLoad
+    }, {
+      children: jsx("span", Object.assign({
+        className: "more-btn"
+      }, {
+        children: intl({
+          id: 'seeMore'
+        })
+      }))
+    }));
+  };
+  /** 判断是否选中 */
+
+
+  var handCheck = function handCheck(item) {
+    var bol = false;
+    if (value && value[item[rowKey]]) bol = true;
+    return bol;
+  };
+  /** 处理每个节点的配置 */
+
+
+  var handNodeConfig = function handNodeConfig(item) {
+    var json = {
+      useCase: 'view',
+      detail: detail,
+      nodeMode: nodeMode,
+      disabled: handDisabled(item),
+      onLevel: function onLevel() {
+        return _onLevel && _onLevel(item);
+      },
+      onSelect: function onSelect() {
+        return _onSelect && _onSelect(item);
+      },
+      checked: handCheck(item)
+    };
+    /** 节点类型 */
+
+    if (item.leaf !== undefined) json.nodeMode = item.leaf ? 'leaf' : 'branch';
+    /** 渲染字段 */
+
+    var arr = ['img', 'mainTitle', 'subTitle', 'tag'];
+
+    for (var i = 0, l = arr.length; i < l; i++) {
+      var key = arr[i];
+      json[key] = item[key];
+    }
+    /** 判断是否具有选择 */
+
+
+    if (item.choice !== false) {
+      // 当前节点可选择
+      if (selectMode) json.selectMode = selectMode;
+    }
+    /** 判断是否具有下级 */
+
+
+    if (isLazy) {
+      // 懒加载
+      json.child = item.child;
+    } else {
+      // 全量数据
+      var children = item.children || [];
+
+      if (children && children.length > 0) {
+        json.child = true;
+      } // 强制设置下级
+
+
+      if (item.child !== undefined) json.child = item.child;
+    }
+    /** 详情render */
+
+
+    if (detailRender) {
+      json.detailRender = function () {
+        return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee() {
+          var Dom;
+          return regenerator.wrap(function _callee$(_context) {
+            while (1) {
+              switch (_context.prev = _context.next) {
+                case 0:
+                  _context.next = 2;
+                  return detailRender(item, true);
+
+                case 2:
+                  Dom = _context.sent;
+                  return _context.abrupt("return", Dom);
+
+                case 4:
+                case "end":
+                  return _context.stop();
+              }
+            }
+          }, _callee);
+        }));
+      };
+    }
+
+    return json;
+  };
+  /** 渲染list节点 */
+
+
+  var handListNode = function handListNode(arr) {
+    return arr === null || arr === void 0 ? void 0 : arr.map(function (item, index) {
+      return jsx(SelectorNode, Object.assign({}, handNodeConfig(item)), index);
+    });
+  };
+  /** 处理节点dom */
+
+
+  var handNode = function handNode() {
+    // 分组渲染
+    if (groupType && groupType.length > 0) {
+      return jsx(Fragment, {
+        children: groupType.map(function (item, index) {
+          var type = item.value;
+          var listData = listCom[type] || [];
+          var str = 'paraui-selector-group-title';
+          if (index === 0) str += ' paraui-selector-group-title-first';
+          return jsxs(Fragment$1, {
+            children: [listData.length > 0 && jsx("div", Object.assign({
+              className: str
+            }, {
+              children: item.label || type
+            })), handListNode(listData)]
+          }, index);
+        })
+      });
+    }
+
+    return handListNode(list || []);
+  };
+  /** 点击面包屑 */
+
+
+  var onClickBreadcrums = function onClickBreadcrums(item) {
+    onClickBreadcrumbs && onClickBreadcrumbs(item);
+  };
+  /** 面包屑dom */
+
+
+  var handBreadcrumbs = function handBreadcrumbs() {
+    if (!breadcrumbs || breadcrumbsList.length === 0) return null;
+    return jsx("div", Object.assign({
+      className: "nav-box"
+    }, {
+      children: jsx(Breadcrumbs, {
+        list: breadcrumbsList,
+        separator: breadcrumbsSeparator,
+        onClickItem: onClickBreadcrums
+      })
+    }));
+  };
+  /** 处理内容 */
+
+
+  var handContent = function handContent() {
+    if ((list === null || list === void 0 ? void 0 : list.length) === 0 && !loading) {
+      // 空状态
+      return jsx("div", Object.assign({
+        className: "paraui-selector-main-list-no-data"
+      }, {
+        children: jsx(Empty, Object.assign({}, emptyProps, {
+          size: (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.size) || "small"
+        }))
+      }));
+    }
+
+    return jsxs(Fragment, {
+      children: [handAllCheck(), handNode(), handLoadMore()]
+    });
+  };
 
   var handClass = function handClass() {
-    var str = 'paraui-selector-main paraui-selector-main-select';
+    var str = 'paraui-selector-main-content';
     if (className) str += ' ' + className;
+    if (disabled) str += ' paraui-selector-main-content-disabled';
     return str;
   };
 
   return jsxs("div", Object.assign({
-    className: handClass(),
-    style: style
+    className: handClass()
   }, {
-    children: [jsx(Search, {
-      btnType: "inside"
-    }), jsx("div", Object.assign({
-      className: 'nav-box'
-    }, {
-      children: jsx(Breadcrumbs, {
-        list: list,
-        separator: '-'
-      })
-    })), jsxs("div", Object.assign({
+    children: [handBreadcrumbs(), jsx("div", Object.assign({
       className: "paraui-selector-main-list"
     }, {
-      children: [jsx(BranchNode, {
-        mainTitle: '全选',
-        selectMode: 'check'
-      }), jsx(LeafNode, {
-        selectMode: 'check',
-        mainTitle: "\u4E3B\u8981\u4FE1\u606F",
-        subTitle: "\u8F85\u52A9\u4FE1\u606F",
-        tag: "\u6807\u7B7E"
-      }), jsx(LeafNode, {
-        selectMode: 'check',
-        mainTitle: "\u4E3B\u8981\u4FE1\u606F",
-        subTitle: "\u8F85\u52A9\u4FE1\u606F",
-        tag: "\u6807\u7B7E"
-      }), jsx(BranchNode, {
-        selectMode: 'check',
-        mainTitle: '主要信息',
-        subTitle: "\u8F85\u52A9\u4FE1\u606F",
-        tag: "\u6807\u7B7E"
-      }), jsx(LeafNode, {
-        selectMode: 'check',
-        mainTitle: "\u4E3B\u8981\u4FE1\u606F",
-        subTitle: "\u8F85\u52A9\u4FE1\u606F",
-        tag: "\u6807\u7B7E"
-      }), jsx(BranchNode, {
-        selectMode: 'check',
-        mainTitle: '主要信息',
-        subTitle: "\u8F85\u52A9\u4FE1\u606F",
-        tag: "\u6807\u7B7E"
-      }), jsx(BranchNode, {
-        selectMode: 'check',
-        mainTitle: '主要信息',
-        subTitle: "\u8F85\u52A9\u4FE1\u606F",
-        tag: "\u6807\u7B7E"
-      }), jsx("div", Object.assign({
-        className: "paraui-selector-main-list-more"
-      }, {
-        children: jsx("span", Object.assign({
-          className: "more-btn"
-        }, {
-          children: "\u67E5\u770B\u66F4\u591A"
-        }))
-      }))]
+      children: handContent()
     }))]
   }));
 };
 
-var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/";
-styleInject(css_248z);
-
-var Selector = function Selector(props) {
+var SelectorMain = function SelectorMain(props) {
   var className = props.className,
       style = props.style,
-      _props$layout = props.layout,
-      layout = _props$layout === void 0 ? 'lr' : _props$layout;
-      props.ctx;
-      props.url;
-      props.data; // 处理className
+      value = props.value,
+      _props$rowKey2 = props.rowKey,
+      rowKey = _props$rowKey2 === void 0 ? 'key' : _props$rowKey2,
+      _props$nodeMode2 = props.nodeMode,
+      nodeMode = _props$nodeMode2 === void 0 ? 'branch' : _props$nodeMode2,
+      selectMode = props.selectMode,
+      _props$loadMore2 = props.loadMore,
+      loadMore = _props$loadMore2 === void 0 ? false : _props$loadMore2,
+      _props$isAllCheck2 = props.isAllCheck,
+      isAllCheck = _props$isAllCheck2 === void 0 ? false : _props$isAllCheck2,
+      disabled = props.disabled,
+      detail = props.detail,
+      detailRender = props.detailRender,
+      isLazy = props.isLazy,
+      list = props.list,
+      groupType = props.groupType,
+      groupRange = props.groupRange,
+      search = props.search,
+      searchPlaceholder = props.searchPlaceholder,
+      searchTrigger = props.searchTrigger,
+      searchLoading = props.searchLoading,
+      searchList = props.searchList,
+      loading = props.loading,
+      breadcrumbs = props.breadcrumbs,
+      _props$breadcrumbsSep2 = props.breadcrumbsSeparator,
+      breadcrumbsSeparator = _props$breadcrumbsSep2 === void 0 ? '-' : _props$breadcrumbsSep2,
+      _props$breadcrumbsLis2 = props.breadcrumbsList,
+      breadcrumbsList = _props$breadcrumbsLis2 === void 0 ? [] : _props$breadcrumbsLis2,
+      fieldConfig = props.fieldConfig,
+      onClickBreadcrumbs = props.onClickBreadcrumbs,
+      onLevel = props.onLevel,
+      onSelect = props.onSelect,
+      onLoad = props.onLoad,
+      onAllCheck = props.onAllCheck,
+      onSearch = props.onSearch;
+  var intl = useFormatMessage('Selector', localeJson);
 
-  var handClass = function handClass() {
-    var str = 'paraui-selector';
-    if (className) str += ' ' + className;
-    if (layout) str += ' paraui-selector-' + layout;
-    return str;
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      showSearch = _useState4[0],
+      setShowSearch = _useState4[1];
+
+  var _useState5 = useState(''),
+      _useState6 = _slicedToArray(_useState5, 2),
+      searchStr = _useState6[0],
+      setSearchStr = _useState6[1];
+
+  var constData = useRef({
+    searchTimer: null,
+    searchStr: ''
+  });
+  /** 改变搜索框 */
+
+  var changeSearch = function changeSearch(val) {
+    setSearchStr(val);
+    constData.current.searchStr = val;
+    if (searchTrigger !== 'onEnter') onSearchCom();
   };
+  /** 搜索框回车事件 */
 
-  return jsx("div", Object.assign({
+
+  var onEnterSearch = function onEnterSearch() {
+    onSearchCom(true);
+  };
+  /** 点击搜索按钮 */
+
+
+  var onClickRightIcon = function onClickRightIcon() {
+    onSearchCom(true);
+  };
+  /** 向外抛出搜索事件 */
+
+
+  var onSearchCom = function onSearchCom(bol) {
+    clearTimeout(constData.current.searchTimer);
+    constData.current.searchTimer = setTimeout(function () {
+      setShowSearch(!!constData.current.searchStr);
+      onSearch && onSearch(constData.current.searchStr, !!bol);
+    }, 100);
+  };
+  /** 搜索dom */
+
+
+  var handSearchDom = function handSearchDom() {
+    var handSearchIcon = function handSearchIcon() {
+      if (!searchStr) return jsx(Refresh, {});
+      return jsx(SearchIcon, {});
+    };
+
+    return jsx(Fragment, {
+      children: search && jsx(Search, {
+        value: searchStr,
+        rightIconExist: true,
+        showBtn: false,
+        rightIcon: handSearchIcon(),
+        btnType: "inside",
+        onChange: changeSearch,
+        onEnter: onEnterSearch,
+        placeholder: searchPlaceholder || intl({
+          id: 'pleaseEnter'
+        }),
+        onClickRightIcon: onClickRightIcon
+      })
+    });
+  };
+  /** 渲染列表 */
+
+
+  var handListDom = function handListDom() {
+    return jsx(SelectorMainContent, {
+      className: "paraui-selector-main-list-box",
+      value: value,
+      rowKey: rowKey,
+      nodeMode: nodeMode,
+      selectMode: selectMode,
+      loadMore: loadMore,
+      isAllCheck: isAllCheck,
+      disabled: disabled,
+      detail: detail,
+      detailRender: detailRender,
+      isLazy: isLazy,
+      list: list,
+      loading: loading,
+      groupType: groupRange === 'list' || groupRange === 'searchList' ? groupType : undefined,
+      breadcrumbs: breadcrumbs,
+      breadcrumbsSeparator: breadcrumbsSeparator,
+      breadcrumbsList: breadcrumbsList,
+      fieldConfig: fieldConfig,
+      onClickBreadcrumbs: onClickBreadcrumbs,
+      onLevel: onLevel,
+      onSelect: onSelect,
+      onLoad: onLoad,
+      onAllCheck: onAllCheck
+    }, "list");
+  };
+  /** 渲染搜索列表 */
+
+
+  var handSearchList = function handSearchList() {
+    if (!showSearch) return;
+    return jsx(SelectorMainContent, {
+      className: 'paraui-selector-main-search-content',
+      value: value,
+      rowKey: rowKey,
+      nodeMode: nodeMode,
+      selectMode: selectMode,
+      loadMore: false,
+      isAllCheck: false,
+      disabled: disabled,
+      detail: detail,
+      detailRender: detailRender,
+      isLazy: false,
+      list: searchList,
+      groupType: groupRange === 'search' || groupRange === 'searchList' ? groupType : undefined,
+      fieldConfig: fieldConfig,
+      loading: searchLoading,
+      onSelect: onSelect
+    }, "search");
+  };
+  /** 处理loading */
+
+
+  var handLoading = function handLoading() {
+    if (searchLoading || loading) {
+      return jsx(Loading, {});
+    }
+  }; // 处理class
+
+
+  var handClass = function handClass() {
+    var str = 'paraui-selector-main';
+    if (className) str += ' ' + className;
+    if (selectMode === 'check') str += ' paraui-selector-main-select';
+    if (showSearch) str += ' paraui-selector-main-show-search';
+    if (search) str += ' paraui-selector-main-search';
+    if (disabled === true) str += ' paraui-selector-main-disabled';
+    return str;
+  };
+
+  return jsxs("div", Object.assign({
+    className: handClass(),
+    style: style
+  }, {
+    children: [handSearchDom(), jsxs("div", Object.assign({
+      className: "paraui-selector-main-box"
+    }, {
+      children: [handListDom(), handSearchList(), handLoading()]
+    }))]
+  }));
+};
+
+var css_248z$1 = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-selector-data.paraui-selector-data-node > .paraui-selector-data-node-box {\n  padding: 24px 0 16px 0;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n}\n.paraui-selector-data.paraui-selector-data-node > .paraui-selector-data-node-box > .title {\n  font-size: 14px;\n  color: rgb(46, 55, 67);\n  padding: 0 16px;\n  margin-bottom: 16px;\n}\n.paraui-selector-data.paraui-selector-data-node > .paraui-selector-data-node-box > .title > .title-content {\n  margin-left: 8px;\n}\n.paraui-selector-data.paraui-selector-data-node > .paraui-selector-data-node-box > .content {\n  overflow-y: auto;\n}\n.paraui-selector-data.paraui-selector-data-tag > .paraui-selector-data-tag-box {\n  padding-top: 12px;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n}\n.paraui-selector-data.paraui-selector-data-tag > .paraui-selector-data-tag-box > .title {\n  font-size: 14px;\n  color: rgb(46, 55, 67);\n  padding: 0 16px;\n}\n.paraui-selector-data.paraui-selector-data-tag > .paraui-selector-data-tag-box > .content {\n  padding: 0 16px 12px 16px;\n  overflow: auto;\n}\n.paraui-selector-data.paraui-selector-data-tag > .paraui-selector-data-tag-box > .content > .content-tag {\n  display: inline-flex;\n  height: 24px;\n  align-items: center;\n  padding: 0 8px;\n  border-radius: 2px;\n  background-color: rgba(171, 176, 185, 0.2);\n  margin-right: 8px;\n  margin-top: 6px;\n}\n.paraui-selector-data.paraui-selector-data-tag > .paraui-selector-data-tag-box > .content > .content-tag > span {\n  font-size: 12px;\n  color: rgb(46, 55, 67);\n}\n.paraui-selector-data.paraui-selector-data-tag > .paraui-selector-data-tag-box > .content > .content-tag > svg {\n  font-size: 16px;\n  margin-left: 4px;\n  color: rgba(46, 55, 67, 0.7);\n  cursor: pointer;\n}";
+styleInject(css_248z$1);
+
+var SelectorData = function SelectorData(props) {
+  var className = props.className,
+      _props$layout = props.layout,
+      layout = _props$layout === void 0 ? 'node' : _props$layout,
+      style = props.style,
+      list = props.list,
+      groupType = props.groupType,
+      nodeMode = props.nodeMode,
+      backDataFieldConfig = props.backDataFieldConfig,
+      detail = props.detail,
+      detailRender = props.detailRender,
+      disabled = props.disabled,
+      handSelectorNodeInfo = props.handSelectorNodeInfo,
+      selectDataTitleRender = props.selectDataTitleRender,
+      _onClose = props.onClose;
+  var intl = useFormatMessage('Selector', localeJson);
+
+  var _useState = useState({}),
+      _useState2 = _slicedToArray(_useState, 2),
+      listCom = _useState2[0],
+      setListCom = _useState2[1];
+
+  var constData = useRef({
+    listTypeJson: {},
+    backDataFieldConfig: {}
+  });
+  constData.current.listTypeJson = ArrayToObject('value', groupType);
+  constData.current.backDataFieldConfig = backDataFieldConfig || {};
+  useEffect(function () {
+    if (list && groupType && groupType.length > 0) {
+      var json = {};
+
+      for (var i = 0, l = list.length; i < l; i++) {
+        var item = list[i];
+        var type = item[constData.current.backDataFieldConfig.type || ''];
+        if (!json[type]) json[type] = [];
+        json[type].push(item);
+      }
+
+      setListCom(json);
+    }
+  }, [list]);
+  /** 处理禁用 */
+
+  var handDisabled = function handDisabled(itemConfig) {
+    if (disabled) {
+      if (disabled === true) return true;
+
+      if (disabled instanceof Array) {
+        var keyStr = (backDataFieldConfig === null || backDataFieldConfig === void 0 ? void 0 : backDataFieldConfig.key) || '';
+        var val = itemConfig[keyStr];
+
+        if (disabled.indexOf(val) !== -1) {
+          return true;
+        }
+      }
+    }
+
+    return false;
+  };
+  /** 处理每个节点的配置 */
+
+
+  var handNodeConfig = function handNodeConfig(itemConfig, index) {
+    var item = itemConfig;
+    if (handSelectorNodeInfo) item = handSelectorNodeInfo(itemConfig);
+    var disabledItem = handDisabled(itemConfig);
+    var json = {
+      useCase: 'edit',
+      close: !disabledItem,
+      detail: detail,
+      data: item,
+      nodeMode: nodeMode,
+      onClose: function onClose() {
+        return _onClose && _onClose(item, index);
+      },
+      disabled: handDisabled(itemConfig)
+    };
+    /** 节点类型 */
+
+    if (item.leaf !== undefined) json.nodeMode = item.leaf ? 'leaf' : 'branch';
+    /** 渲染字段 */
+
+    var arr = ['img', 'mainTitle', 'subTitle', 'tag'];
+
+    for (var i = 0, l = arr.length; i < l; i++) {
+      var key = arr[i] || '';
+      var backName = backDataFieldConfig && backDataFieldConfig[key] || '';
+      json[key] = item[backName];
+    }
+    /** 详情render */
+
+
+    if (detailRender) {
+      json.detailRender = function () {
+        return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee() {
+          var Dom;
+          return regenerator.wrap(function _callee$(_context) {
+            while (1) {
+              switch (_context.prev = _context.next) {
+                case 0:
+                  _context.next = 2;
+                  return detailRender(item, false);
+
+                case 2:
+                  Dom = _context.sent;
+                  return _context.abrupt("return", Dom);
+
+                case 4:
+                case "end":
+                  return _context.stop();
+              }
+            }
+          }, _callee);
+        }));
+      };
+    }
+    /** 是否具有删除 */
+
+
+    if (item.close !== undefined) json.close = item.close;
+    return json;
+  };
+  /** 处理节点 */
+
+
+  var handNode = function handNode() {
+    return list === null || list === void 0 ? void 0 : list.map(function (item, index) {
+      return jsx(SelectorNode, Object.assign({}, handNodeConfig(item, index)), index);
+    });
+  };
+  /** 处理标题 */
+
+
+  var handTitle = function handTitle() {
+    var handTitleTag = function handTitleTag() {
+      if (selectDataTitleRender) return selectDataTitleRender(list);
+
+      if (groupType) {
+        return jsx(Fragment, {
+          children: groupType.map(function (item, index) {
+            var num = 0;
+            var val = item.value;
+            if (listCom[val]) num = listCom[val].length;
+            if (num === 0) return;
+            return jsxs("span", Object.assign({
+              className: "title-content"
+            }, {
+              children: [num, "\u4E2A", item.label || item.value]
+            }), index);
+          })
+        });
+      }
+    };
+
+    return jsxs("div", Object.assign({
+      className: "title"
+    }, {
+      children: [jsxs("span", Object.assign({
+        className: "title-tip"
+      }, {
+        children: [intl({
+          id: 'selected'
+        }), ":"]
+      })), handTitleTag()]
+    }));
+  }; // 处理节点内容
+
+
+  var handContentNode = function handContentNode() {
+    return jsxs("div", Object.assign({
+      className: "paraui-selector-data-node-box"
+    }, {
+      children: [handTitle(), jsx("div", Object.assign({
+        className: "content"
+      }, {
+        children: handNode()
+      }))]
+    }));
+  }; // 处理tag内容
+
+
+  var handContentTag = function handContentTag() {
+    return jsxs("div", Object.assign({
+      className: "paraui-selector-data-tag-box"
+    }, {
+      children: [handTitle(), jsx("div", Object.assign({
+        className: "content"
+      }, {
+        children: list === null || list === void 0 ? void 0 : list.map(function (item, index) {
+          var disabledItem = handDisabled(item);
+          return jsxs("span", Object.assign({
+            className: "content-tag"
+          }, {
+            children: [jsx("span", {
+              children: item[(backDataFieldConfig === null || backDataFieldConfig === void 0 ? void 0 : backDataFieldConfig.mainTitle) || ''] || item[(backDataFieldConfig === null || backDataFieldConfig === void 0 ? void 0 : backDataFieldConfig.key) || '']
+            }), !disabledItem && jsx(CloseIcon, {
+              onClick: function onClick() {
+                return _onClose && _onClose(item, index);
+              }
+            })]
+          }), index);
+        })
+      }))]
+    }));
+  };
+
+  var handClass = function handClass() {
+    var str = 'paraui-selector-data';
+    if (layout) str += ' paraui-selector-data-' + layout;
+    if (disabled === true) str += ' paraui-selector-data-disabled';
+    if (className) str += ' ' + className;
+    return str;
+  };
+
+  return jsx("div", Object.assign({
+    className: handClass(),
+    style: style
+  }, {
+    children: layout === 'node' ? handContentNode() : handContentTag()
+  }));
+};
+
+/**
+ * 发送请求
+ * @param obj {ReqFuncProps} 请求信息
+ */
+
+var reqFunc = function reqFunc(obj) {
+  var method = obj.method,
+      data = obj.data,
+      otherProps = __rest(obj, ["method", "data"]);
+
+  if (method === 'Get') {
+    return Get(Object.assign({
+      params: data
+    }, otherProps));
+  }
+
+  if (method === 'Post') {
+    return Post(Object.assign({
+      data: data
+    }, otherProps));
+  }
+};
+
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-selector {\n  border: 1px solid rgba(171, 176, 185, 0.4);\n  border-radius: 4px;\n  display: flex;\n  height: 100%;\n  width: 100%;\n}\n.paraui-selector.paraui-selector-lr > .paraui-selector-main {\n  width: 50%;\n}\n.paraui-selector.paraui-selector-lr > .paraui-selector-data {\n  width: 50%;\n  border-left: 1px solid rgba(171, 176, 185, 0.4);\n}\n.paraui-selector.paraui-selector-tb {\n  flex-direction: column;\n}\n.paraui-selector.paraui-selector-tb > .paraui-selector-data {\n  border-bottom: 1px solid rgba(171, 176, 185, 0.4);\n  max-height: 106px;\n}\n.paraui-selector.paraui-selector-tb > .paraui-selector-main {\n  overflow-y: auto;\n  height: auto;\n  flex: 1;\n}";
+styleInject(css_248z);
+
+var handFieldConfig = function handFieldConfig(fieldConfig, rowKey) {
+  var json = Object.assign({
+    mainTitle: 'label',
+    children: 'children',
+    parentId: 'parentId',
+    key: rowKey,
+    type: 'type'
+  }, fieldConfig);
+  return json;
+};
+
+var Selector = function Selector(props) {
+  var _useGlobalProps = useGlobalProps(props, 'Selector'),
+      className = _useGlobalProps.className,
+      style = _useGlobalProps.style,
+      _useGlobalProps$rowKe = _useGlobalProps.rowKey,
+      rowKey = _useGlobalProps$rowKe === void 0 ? 'key' : _useGlobalProps$rowKe,
+      _useGlobalProps$layou = _useGlobalProps.layout,
+      layout = _useGlobalProps$layou === void 0 ? 'lr' : _useGlobalProps$layou,
+      _useGlobalProps$nodeM = _useGlobalProps.nodeMode,
+      nodeMode = _useGlobalProps$nodeM === void 0 ? 'branch' : _useGlobalProps$nodeM,
+      selectMode = _useGlobalProps.selectMode,
+      refresh = _useGlobalProps.refresh,
+      ctx = _useGlobalProps.ctx,
+      url = _useGlobalProps.url,
+      _useGlobalProps$metho = _useGlobalProps.method,
+      method = _useGlobalProps$metho === void 0 ? 'Get' : _useGlobalProps$metho,
+      value = _useGlobalProps.value,
+      defaultValue = _useGlobalProps.defaultValue,
+      data = _useGlobalProps.data,
+      _useGlobalProps$pagin = _useGlobalProps.pagination,
+      pagination = _useGlobalProps$pagin === void 0 ? false : _useGlobalProps$pagin,
+      _useGlobalProps$size = _useGlobalProps.size,
+      size = _useGlobalProps$size === void 0 ? 10 : _useGlobalProps$size,
+      _useGlobalProps$isLaz = _useGlobalProps.isLazy,
+      isLazy = _useGlobalProps$isLaz === void 0 ? false : _useGlobalProps$isLaz,
+      _useGlobalProps$isAll = _useGlobalProps.isAllCheck,
+      isAllCheck = _useGlobalProps$isAll === void 0 ? true : _useGlobalProps$isAll,
+      disabled = _useGlobalProps.disabled,
+      detail = _useGlobalProps.detail,
+      detailRender = _useGlobalProps.detailRender,
+      backDataFieldConfig = _useGlobalProps.backDataFieldConfig,
+      search = _useGlobalProps.search,
+      searchPlaceholder = _useGlobalProps.searchPlaceholder,
+      _useGlobalProps$searc = _useGlobalProps.searchTrigger,
+      searchTrigger = _useGlobalProps$searc === void 0 ? 'onChange' : _useGlobalProps$searc,
+      _useGlobalProps$bread = _useGlobalProps.breadcrumbs,
+      breadcrumbs = _useGlobalProps$bread === void 0 ? true : _useGlobalProps$bread,
+      breadcrumbsSeparator = _useGlobalProps.breadcrumbsSeparator,
+      breadcrumbsHead = _useGlobalProps.breadcrumbsHead,
+      _useGlobalProps$showb = _useGlobalProps.showbreadcrumbsHead,
+      showbreadcrumbsHead = _useGlobalProps$showb === void 0 ? true : _useGlobalProps$showb,
+      groupType = _useGlobalProps.groupType,
+      _useGlobalProps$group = _useGlobalProps.groupRange,
+      groupRange = _useGlobalProps$group === void 0 ? 'search' : _useGlobalProps$group,
+      emptyProps = _useGlobalProps.emptyProps,
+      onChange = _useGlobalProps.onChange,
+      onSelect = _useGlobalProps.onSelect,
+      onSearch = _useGlobalProps.onSearch;
+
+  var intl = useFormatMessage('Selector', localeJson);
+  var fieldConfigHand = handFieldConfig(props.fieldConfig, rowKey); // 字段配置,对应数据字段
+
+  var selectorFieldConfigHand = Object.assign(Object.assign({}, fieldConfigHand), backDataFieldConfig); // 选中值字段配置,对应数据字段
+
+  var _useState = useState([]),
+      _useState2 = _slicedToArray(_useState, 2),
+      currentData = _useState2[0],
+      setCurrentData = _useState2[1]; // 当前展示的数据
+
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      loadMore = _useState4[0],
+      setLoadMore = _useState4[1]; // 加载更多
+
+
+  var _useState5 = useState([]),
+      _useState6 = _slicedToArray(_useState5, 2),
+      valueCom = _useState6[0],
+      setValueCom = _useState6[1]; // 绑定的值
+
+
+  var _useState7 = useState({}),
+      _useState8 = _slicedToArray(_useState7, 2),
+      valueJsonCom = _useState8[0],
+      setValueJsonCom = _useState8[1]; // 绑定的值,json
+
+
+  var _useState9 = useState([]),
+      _useState10 = _slicedToArray(_useState9, 2),
+      breadcrumbsList = _useState10[0],
+      setBreadcrumbsList = _useState10[1]; // 面包屑
+
+
+  var _useState11 = useState(false),
+      _useState12 = _slicedToArray(_useState11, 2),
+      searchLoading = _useState12[0],
+      setSearchLoading = _useState12[1]; // 搜索loading
+
+
+  var _useState13 = useState([]),
+      _useState14 = _slicedToArray(_useState13, 2),
+      searchList = _useState14[0],
+      setSearchList = _useState14[1]; // 搜索数据
+
+
+  var _useState15 = useState(true),
+      _useState16 = _slicedToArray(_useState15, 2),
+      loadingCom = _useState16[0],
+      setLoadingCom = _useState16[1];
+
+  var _useState17 = useState(),
+      _useState18 = _slicedToArray(_useState17, 2),
+      refreshCom = _useState18[0],
+      setRefreshCom = _useState18[1];
+
+  var constData = useRef({
+    /** 对象集合 所有的 */
+    jsonData: {},
+
+    /** 浅拷贝对象 所有的 */
+    jsonDataCopy: {},
+
+    /** 第一层数据 */
+    oneDataList: [],
+
+    /** 当前页数据源 本地数据为当前页所有的数据,请求数据为当前展示的数据 */
+    currentSourceData: [],
+
+    /** 当前选中值的mapping */
+    selectValueJson: {},
+
+    /** 面包屑数据 */
+    breadcrumbsList: [],
+
+    /** 接口id */
+    reqId: Math.random().toString(),
+
+    /** 请求数据 */
+    reqParams: {
+      size: 10,
+      pagination: false,
+      isLazy: false
+    },
+
+    /** 不是懒加载, 是否请求过 */
+    noLazyReq: false,
+
+    /** 更改数据定时器 */
+    reqTimer: null,
+
+    /** 页数 */
+    page: 1
+  }); // 常量
+
+  constData.current.reqParams.size = size;
+  constData.current.reqParams.pagination = pagination;
+  constData.current.reqParams.isLazy = isLazy; // 本地数据 有接口的全量数据 -> 走本地数据逻辑
+
+  var isReqLocalData = props.data || !constData.current.reqParams.isLazy && constData.current.noLazyReq;
+  useEffect(function () {
+    if (defaultValue !== undefined) handValue(defaultValue);
+    return function () {
+      clearTimeout(constData.current.reqTimer);
+    };
+  }, []);
+  useEffect(function () {
+    if (value !== undefined) handValue(value);
+  }, [value]); // 处理源数据
+
+  useEffect(function () {
+    if (data) {
+      var treeData = convertTree(data, false);
+      constData.current.oneDataList = treeData;
+      constData.current.currentSourceData = treeData;
+      setBreadcrumbsList([]);
+      handInitCurrent();
+    }
+  }, [data]);
+  useEffect(function () {
+    if (url) {
+      setBreadcrumbsList([]);
+      handInitCurrent();
+    }
+  }, [url]); // 请求数据
+
+  useEffect(function () {
+    clearTimeout(constData.current.reqTimer);
+    if (props.url) Cancel(constData.current.reqId);
+    constData.current.reqTimer = setTimeout(function () {
+      // 本地数据 不是懒加载的全量接口数据
+      if (isReqLocalData) {
+        var currentSourceData = constData.current.currentSourceData;
+
+        if (constData.current.reqParams.pagination) {
+          // 分页
+          var sliceData = currentSourceData.slice(0, constData.current.page * constData.current.reqParams.size);
+          setCurrentData(sliceData); // 没有加载更多
+
+          if (constData.current.page * constData.current.reqParams.size >= currentSourceData.length) {
+            setLoadMore(false);
+          } else {
+            setLoadMore(true);
+          }
+        } else {
+          // 不分页
+          setCurrentData(currentSourceData);
+        }
+
+        setLoadingCom(false);
+      } // 远程数据
+
+
+      if (props.url) {
+        var obj = {
+          method: method,
+          url: props.url,
+          ctx: ctx,
+          uuid: constData.current.reqId,
+          data: Object.assign({
+            parentId: handParentId()
+          }, props.params)
+        }; // 懒加载
+
+        if (constData.current.reqParams.isLazy) {
+          // 分页
+          if (constData.current.reqParams.pagination) {
+            obj.data.size = constData.current.reqParams.size;
+            obj.data.page = constData.current.page;
+          }
+
+          handReq(props.paramsCallback ? props.paramsCallback(obj) : obj);
+        } else {
+          // 不是懒加载 全量数据 只请求一次
+          if (!constData.current.noLazyReq) handReq(props.paramsCallback ? props.paramsCallback(obj) : obj);
+        }
+      }
+    }, 50);
+  }, [refreshCom]);
+  useEffect(function () {
+    if (refresh) refreshFunc();
+  }, [refresh]);
+  /** 刷新 */
+
+  var refreshFunc = function refreshFunc() {
+    if (!isReqLocalData) {
+      constData.current.currentSourceData = [];
+    }
+
+    handInitCurrent();
+  };
+  /**
+   * 处理节点数据
+   * @param item 节点数据
+   * @param bol 是否是搜索
+   * */
+
+
+  var handNodeData = function handNodeData(item, bol) {
+    var itemData = {
+      key: item[rowKey],
+      parentId: item[fieldConfigHand.parentId],
+      type: item[fieldConfigHand.type],
+      img: item[fieldConfigHand.img],
+      mainTitle: item[fieldConfigHand.mainTitle],
+      subTitle: item[fieldConfigHand.subTitle],
+      tag: item[fieldConfigHand.tag],
+      children: [],
+      disabled: false,
+      choice: selectMode !== undefined,
+      detail: detail,
+      leaf: nodeMode === 'leaf',
+      //child: false,
+      data: item
+    }; // 如果外部存在节点回调
+
+    if (props.handNodeInfo) itemData = props.handNodeInfo(itemData);
+    return itemData;
+  };
+  /**
+   * 转换树结构 记录原始数据,跟处理过的数据
+   * @param arr 数据源
+   * @param bol true不生成树
+   * */
+
+
+  var convertTree = function convertTree(arr, bol) {
+    var handArr = [];
+    var json = {}; // 生成mappingd对象
+
+    var recurrence = function recurrence(list) {
+      for (var i = 0, l = list.length; i < l; i++) {
+        var item = list[i];
+        var keyStr = item[rowKey];
+        var itemData = handNodeData(item);
+        json[keyStr] = itemData;
+        var childrenName = fieldConfigHand.children;
+        constData.current.jsonDataCopy[keyStr] = item; // 原始数据
+
+        constData.current.jsonData[keyStr] = itemData; // 处理过的数据
+
+        if (item[childrenName]) {
+          recurrence(item[childrenName]);
+        }
+      }
+    };
+
+    recurrence(arr); // 生成tree数据
+
+    var arrKey = Object.keys(json);
+
+    for (var i = 0, l = arrKey.length; i < l; i++) {
+      var keyStr = arrKey[i];
+      var item = json[keyStr];
+      var parentId = item.parentId || '';
+
+      if (bol) {
+        handArr.push(item);
+        continue;
+      }
+
+      if (parentId && json[parentId]) {
+        if (!json[parentId].children) json[parentId].children = [];
+        json[parentId].children.push(item);
+      } else {
+        handArr.push(item);
+      }
+    }
+
+    return handArr;
+  };
+  /** 处理parentId */
+
+
+  var handParentId = function handParentId() {
+    var parentId = undefined;
+    if (props.breadcrumbsHead) parentId = props.breadcrumbsHead.value;
+
+    if (constData.current.breadcrumbsList.length > 1) {
+      // 包含了根,所以要多加1
+      var item = constData.current.breadcrumbsList[constData.current.breadcrumbsList.length - 1];
+      parentId = item.value;
+    }
+
+    return parentId;
+  };
+  /** 请求 */
+
+
+  var handReq = function handReq(obj) {
+    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee() {
+      var _yield$reqFunc, data, err;
+
+      return regenerator.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              setLoadingCom(true);
+              _context.next = 3;
+              return reqFunc(obj);
+
+            case 3:
+              _yield$reqFunc = _context.sent;
+              data = _yield$reqFunc.data;
+              err = _yield$reqFunc.err;
+
+              if (!err) {
+                _context.next = 10;
+                break;
+              }
+
+              setLoadingCom(false); // cancel的接口不清除上次展示的数据
+
+              if (!err.__CANCEL__) {
+                if (constData.current.reqParams.isLazy) {
+                  // 懒加载
+                  if (constData.current.reqParams.pagination) {
+                    // 分页 第一页不处理
+                    if (constData.current.page !== 1) constData.current.page = constData.current.page - 1;
+                  }
+                }
+              }
+
+              return _context.abrupt("return");
+
+            case 10:
+              if (!props.requestCallback) {
+                _context.next = 13;
+                break;
+              }
+
+              props.requestCallback(data, function (handData) {
+                setLoadingCom(false);
+                handReqData(data);
+              });
+              return _context.abrupt("return");
+
+            case 13:
+              setLoadingCom(false);
+              handReqData(data);
+
+            case 15:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+  };
+  /** 接口回来处理数据 */
+
+
+  var handReqData = function handReqData(resultData) {
+    if (constData.current.reqParams.isLazy) {
+      // 懒加载
+      if (constData.current.reqParams.pagination) {
+        // 分页
+        var result = resultData.data || {};
+        var arr = result.list || [];
+        var total = result.total;
+        var arrHand = convertTree(arr, true);
+        var currentD = [].concat(_toConsumableArray(constData.current.currentSourceData), _toConsumableArray(arrHand));
+        constData.current.currentSourceData = currentD;
+        setCurrentData(currentD);
+
+        if (constData.current.page * constData.current.reqParams.size >= total) {
+          setLoadMore(false);
+        } else {
+          setLoadMore(true);
+        }
+      } else {
+        // 不分页 必须返回平铺的数组
+        var _arr = resultData.data || [];
+
+        var treeData = convertTree(_arr, true);
+        constData.current.currentSourceData = treeData;
+        setCurrentData(treeData);
+      }
+    } else {
+      // 不是懒加载 只请求一次
+      constData.current.noLazyReq = true;
+
+      var _arr2 = resultData.data || [];
+
+      var _treeData = convertTree(_arr2, false);
+
+      constData.current.oneDataList = _treeData; // 第一层数据
+
+      constData.current.currentSourceData = _treeData;
+      handInitCurrent();
+    }
+  };
+  /** 当前页初始更新 */
+
+
+  var handInitCurrent = function handInitCurrent() {
+    constData.current.page = 1;
+    setRefreshCom(Math.random());
+  };
+  /** 处理value */
+
+
+  var handValue = function handValue(val) {
+    var handVal = !val ? [] : [val];
+
+    if (val instanceof Array) {
+      handVal = _toConsumableArray(val);
+    }
+
+    var json = ArrayToObject(selectorFieldConfigHand.key, handVal);
+    constData.current.selectValueJson = json;
+    setValueJsonCom(json);
+    setValueCom(handVal);
+  };
+  /** 点击下级,添加面包屑 */
+
+
+  var onLevelAddBreadcrumbs = function onLevelAddBreadcrumbs(item) {
+    breadcrumbsList.push({
+      label: item.mainTitle,
+      value: item.key || ''
+    });
+    setBreadcrumbsList(_toConsumableArray(breadcrumbsList));
+  };
+  /** 点击下级 */
+
+
+  var onLevelCom = function onLevelCom(item) {
+    onLevelAddBreadcrumbs(item);
+
+    if (isReqLocalData) {
+      // 本地数据
+      constData.current.currentSourceData = item.children || [];
+      handInitCurrent();
+    } else {
+      // 请求数据
+      if (constData.current.reqParams.isLazy) {
+        // 懒加载
+        if (constData.current.reqParams.pagination) {
+          // 分页
+          constData.current.currentSourceData = [];
+        }
+
+        handInitCurrent();
+      }
+    }
+  };
+  /** 处理抛出去的数据 */
+
+
+  var handEmitValue = function handEmitValue(item) {
+    var arr = ['key', 'img', 'mainTitle', 'subTitle', 'tag'];
+
+    if (props.groupType && props.groupType.length > 0) {
+      arr.push('type');
+    }
+
+    var json = {};
+
+    for (var i = 0, l = arr.length; i < l; i++) {
+      var arrItem = arr[i];
+      var name = selectorFieldConfigHand[arrItem];
+      if (name) json[name] = item[arrItem];
+    }
+
+    return json;
+  };
+  /**
+   * 向外触发onchane事件
+   * @param val 向外抛的值
+   * @param valCom 设置组件的值
+   * @param node 处理过的节点数据
+   * @param rowData 原始数据节点
+   * */
+
+
+  var onChangeEmit = function onChangeEmit(val, valCom, node, rowData) {
+    onChange && onChange(val, node, rowData);
+
+    if (value == undefined) {
+      handValue(!val ? [] : val);
+    }
+  };
+  /** 选择数据 */
+
+
+  var onSelectCom = function onSelectCom(item) {
+    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee2() {
+      var keyStr, selectVal, bol, json, arr, node, rowData, i, l, valueComItem, valueComItemId, _json;
+
+      return regenerator.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              keyStr = item.key || ''; // key
+              // 单选且选中,点击不触发
+
+              if (!(selectMode === 'radio' && valueJsonCom[keyStr])) {
+                _context2.next = 3;
+                break;
+              }
+
+              return _context2.abrupt("return");
+
+            case 3:
+              selectVal = constData.current.selectValueJson[keyStr]; // 存在选中值当中 -> 选中变不选中
+
+              if (!onSelect) {
+                _context2.next = 10;
+                break;
+              }
+
+              _context2.next = 7;
+              return onSelect(item, selectMode === 'radio' ? true : !selectVal, false);
+
+            case 7:
+              bol = _context2.sent;
+
+              if (!bol) {
+                _context2.next = 10;
+                break;
+              }
+
+              return _context2.abrupt("return");
+
+            case 10:
+              // 单选
+              if (selectMode === 'radio') {
+                json = handEmitValue(item);
+                onChangeEmit(json, [json], constData.current.jsonData[keyStr], constData.current.jsonDataCopy[keyStr]);
+              } // 多选
+
+
+              if (selectMode === 'check') {
+                arr = [];
+                node = {}; // 处理过得数据
+
+                rowData = {}; // 原始数据
+                // 把即将不选中的值,从valueCom里面拿掉
+
+                for (i = 0, l = valueCom.length; i < l; i++) {
+                  valueComItem = valueCom[i]; // 选中valueCom都保留
+                  // 不选中 保留valueCom里面的key不等于当前的key
+
+                  if (!selectVal || item.key !== valueComItem[selectorFieldConfigHand.key]) {
+                    valueComItemId = valueComItem[selectorFieldConfigHand.key];
+                    node[valueComItemId] = constData.current.jsonData[valueComItemId];
+                    rowData[valueComItemId] = constData.current.jsonDataCopy[valueComItemId];
+                    arr.push(valueComItem);
+                  }
+                } // 不选中 -> 选中
+
+
+                if (!selectVal) {
+                  _json = handEmitValue(item);
+                  node[keyStr] = constData.current.jsonData[keyStr];
+                  rowData[keyStr] = constData.current.jsonDataCopy[keyStr];
+                  arr.push(_json);
+                }
+
+                onChangeEmit(arr, arr, node, rowData);
+              }
+
+            case 12:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }));
+  };
+  /** 处理禁用状态 */
+
+
+  var handDisabled = function handDisabled(item) {
+    if (disabled) {
+      if (disabled === true) return true;
+
+      if (disabled instanceof Array) {
+        if (item.key && disabled.indexOf(item.key) !== -1) {
+          return true;
+        }
+      }
+    }
+
+    if (item.disabled) return true;
+    return false;
+  };
+  /**
+   * 点击全选
+   * @param bol true全选
+   * */
+
+
+  var onAllCheckCom = function onAllCheckCom(bol) {
+    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee3() {
+      var arrList, arrVal, arrval1, node, rowData, selectArr, selectEmitData, i, l, item, keyStr, disabledItem, _i, _l, _item, _keyStr, emitArr, flag;
+
+      return regenerator.wrap(function _callee3$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              arrList = _toConsumableArray(currentData); // 当前列的数据
+
+              arrVal = _toConsumableArray(valueCom); // 全选 绑定的值
+
+              arrval1 = []; // 全不选 绑定的值
+
+              node = {}; // 处理过得数据
+
+              rowData = {}; // 原始数据
+
+              selectArr = []; // 全不选 - 当前列选中值
+
+              selectEmitData = []; // 选择事件抛出去的值
+              // 循环当前列数据
+
+              i = 0, l = arrList.length;
+
+            case 8:
+              if (!(i < l)) {
+                _context3.next = 18;
+                break;
+              }
+
+              item = arrList[i];
+              keyStr = item.key || '';
+              disabledItem = handDisabled(item);
+
+              if (!disabledItem) {
+                _context3.next = 14;
+                break;
+              }
+
+              return _context3.abrupt("continue", 15);
+
+            case 14:
+              if (bol) {
+                // 全选
+                if (!constData.current.selectValueJson[keyStr]) {
+                  // 不存在选中值中
+                  arrVal.push(handEmitValue(item));
+                  selectEmitData.push(item);
+                }
+              } else {
+                // 全不选
+                if (constData.current.selectValueJson[keyStr]) {
+                  // 存在选中值中,拿掉
+                  selectArr.push(keyStr);
+                  selectEmitData.push(item);
+                }
+              }
+
+            case 15:
+              i++;
+              _context3.next = 8;
+              break;
+
+            case 18:
+              for (_i = 0, _l = arrVal.length; _i < _l; _i++) {
+                _item = arrVal[_i];
+                _keyStr = _item[selectorFieldConfigHand.key];
+
+                if (bol) {
+                  // 全选
+                  node[_keyStr] = constData.current.jsonData[_keyStr];
+                  rowData[_keyStr] = constData.current.jsonDataCopy[_keyStr];
+                } else {
+                  // 全不选
+                  if (selectArr.indexOf(_keyStr) === -1) {
+                    // 不存在 全不选 - 当前列选中值
+                    node[_keyStr] = constData.current.jsonData[_keyStr];
+                    rowData[_keyStr] = constData.current.jsonDataCopy[_keyStr];
+                    arrval1.push(_item);
+                  }
+                }
+              }
+
+              emitArr = bol ? arrVal : arrval1;
+
+              if (!onSelect) {
+                _context3.next = 26;
+                break;
+              }
+
+              _context3.next = 23;
+              return onSelect(selectEmitData, !!bol, false);
+
+            case 23:
+              flag = _context3.sent;
+
+              if (!flag) {
+                _context3.next = 26;
+                break;
+              }
+
+              return _context3.abrupt("return");
+
+            case 26:
+              onChangeEmit(emitArr, emitArr, node, rowData);
+
+            case 27:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee3);
+    }));
+  };
+  /** 点击查看更多 */
+
+
+  var onLoadCom = function onLoadCom() {
+    constData.current.page = constData.current.page + 1;
+    setRefreshCom(Math.random());
+  };
+  /** 处理面包屑数组 */
+
+
+  var handBreadcrumbsList = function handBreadcrumbsList() {
+    var arr = _toConsumableArray(breadcrumbsList);
+
+    var oneItem = breadcrumbsHead || {
+      label: intl({
+        id: 'root'
+      }),
+      value: '_paraui_first_floor'
+    };
+    if (showbreadcrumbsHead) arr.unshift(oneItem);
+    constData.current.breadcrumbsList = arr;
+    return arr;
+  };
+  /** 截取面包屑数据 */
+
+
+  var spliceBreadcrumbs = function spliceBreadcrumbs(item) {
+    var arr = [];
+
+    for (var i = 0, l = breadcrumbsList.length; i < l; i++) {
+      var itemB = breadcrumbsList[i];
+      arr.push(itemB);
+
+      if (itemB.value === item.value) {
+        break;
+      }
+    }
+
+    return arr;
+  };
+  /** 点击面包屑 */
+
+
+  var onClickBreadcrumbsCom = function onClickBreadcrumbsCom(item) {
+    var list = constData.current.breadcrumbsList; // 点击最后一层,不触发数据变更
+
+    if (list.length === 0 || item.value === list[list.length - 1].value) {
+      return;
+    }
+
+    var keyStr = item.value || '';
+    var oneValue = breadcrumbsHead ? breadcrumbsHead.value : '_paraui_first_floor'; // 设置面包屑
+
+    if (keyStr === oneValue) {
+      // 第一层
+      setBreadcrumbsList([]);
+    } else {
+      // 除了第一级,最后一级
+      setBreadcrumbsList(spliceBreadcrumbs(item));
+    }
+
+    if (isReqLocalData) {
+      if (keyStr === oneValue) {
+        // 第一层
+        constData.current.currentSourceData = _toConsumableArray(constData.current.oneDataList);
+      } else {
+        // 除了第一级,最后一级
+        var itemData = constData.current.jsonData[keyStr];
+        constData.current.currentSourceData = itemData[fieldConfigHand.children];
+      }
+    } else {
+      // 请求数据
+      if (constData.current.reqParams.isLazy) {
+        // 懒加载
+        if (constData.current.reqParams.pagination) {
+          // 分页
+          constData.current.currentSourceData = [];
+        }
+      }
+    }
+
+    handInitCurrent();
+  };
+  /** 搜索回调 */
+
+
+  var onSearchCom = function onSearchCom(val, bol) {
+    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee4() {
+      var result, arr;
+      return regenerator.wrap(function _callee4$(_context4) {
+        while (1) {
+          switch (_context4.prev = _context4.next) {
+            case 0:
+              if (!(val === '')) {
+                _context4.next = 5;
+                break;
+              }
+
+              setSearchList([]);
+              setSearchLoading(false);
+
+              if (bol) {
+                // 当前页刷新
+                refreshFunc();
+              }
+
+              return _context4.abrupt("return");
+
+            case 5:
+              if (!onSearch) {
+                _context4.next = 13;
+                break;
+              }
+
+              setSearchLoading(true);
+              _context4.next = 9;
+              return onSearch(val);
+
+            case 9:
+              result = _context4.sent;
+              arr = convertTree(result || [], true);
+              setSearchList(arr);
+              setSearchLoading(false);
+
+            case 13:
+            case "end":
+              return _context4.stop();
+          }
+        }
+      }, _callee4);
+    }));
+  };
+  /** 删除数据 */
+
+
+  var onCloseCom = function onCloseCom(item, index) {
+    if (selectMode === 'radio') {
+      onChangeEmit(null, [], {}, {});
+    }
+
+    if (selectMode === 'check') {
+      var arr = _toConsumableArray(valueCom);
+
+      arr.splice(index, 1);
+      var node = {}; // 处理过得数据
+
+      var rowData = {}; // 原始数据
+
+      for (var i = 0, l = arr.length; i < l; i++) {
+        var _item2 = arr[i];
+        var keyStr = _item2[selectorFieldConfigHand.key];
+        node[keyStr] = constData.current.jsonData[keyStr];
+        rowData[keyStr] = constData.current.jsonDataCopy[keyStr];
+      }
+
+      onChangeEmit(arr, arr, node, rowData);
+    }
+  };
+  /** 处理返回数据dom配置 */
+
+
+  var handSelectorData = function handSelectorData() {
+    return jsx(SelectorData, {
+      layout: layout === 'tb' ? 'tag' : 'node',
+      backDataFieldConfig: selectorFieldConfigHand,
+      groupType: groupType,
+      handSelectorNodeInfo: props.handSelectorNodeInfo,
+      list: valueCom,
+      nodeMode: nodeMode,
+      detail: detail,
+      detailRender: detailRender,
+      emptyProps: emptyProps,
+      onClose: onCloseCom,
+      selectDataTitleRender: props.selectDataTitleRender,
+      disabled: disabled
+    });
+  }; // 处理className
+
+
+  var handClass = function handClass() {
+    var str = 'paraui-selector';
+    if (className) str += ' ' + className;
+    if (layout) str += ' paraui-selector-' + layout;
+    if (selectMode) str += ' paraui-selector-' + selectMode;
+    if (disabled === true) str += ' paraui-selector-disabled';
+    return str;
+  };
+
+  return jsxs("div", Object.assign({
     className: handClass(),
     style: style
   }, {
-    children: jsx(SelectorMain, {})
+    children: [layout === 'tb' && handSelectorData(), jsx(SelectorMain, {
+      rowKey: rowKey,
+      value: valueJsonCom,
+      loadMore: loadMore,
+      isAllCheck: isAllCheck,
+      list: currentData,
+      groupType: groupType,
+      groupRange: groupRange,
+      fieldConfig: fieldConfigHand,
+      nodeMode: nodeMode,
+      selectMode: selectMode,
+      isLazy: isLazy,
+      detail: detail,
+      detailRender: detailRender,
+      search: search,
+      searchTrigger: searchTrigger,
+      searchPlaceholder: searchPlaceholder,
+      searchLoading: searchLoading,
+      disabled: disabled,
+      loading: loadingCom,
+      searchList: searchList,
+      breadcrumbs: breadcrumbs,
+      breadcrumbsSeparator: breadcrumbsSeparator,
+      breadcrumbsList: handBreadcrumbsList(),
+      emptyProps: emptyProps,
+      onLevel: onLevelCom,
+      onSelect: onSelectCom,
+      onLoad: onLoadCom,
+      onAllCheck: onAllCheckCom,
+      onClickBreadcrumbs: onClickBreadcrumbsCom,
+      onSearch: onSearchCom
+    }), layout === 'lr' && handSelectorData()]
   }));
 };
 
-export { Selector as default };
+export { Selector as default, handFieldConfig };