@zgfe/business-lib 1.0.0-beta.6 → 1.0.3

package/es/attributeSelector/index.js

@@ -1,27 +1,9 @@
-var _excluded = ["children"];
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-
-function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -34,561 +16,124 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import { Anchor, Input, Tooltip } from 'antd';
-import React, { useContext, useEffect, useRef, useState } from 'react';
-import { BizGlobalDataContext } from '..';
+import React, { useContext, useEffect, useState } from 'react';
+import './styles/index.less';
+import { Dropdown, Tooltip } from 'antd';
+import AttrListPanel from './listPanel';
 import IconFont from '../components/iconFont';
-import { util } from '../utils';
-import './index.less';
-var Link = Anchor.Link;
+import { BizGlobalDataContext } from '..';
+import SelectHandle from '../select/handle';
 
 var BizAttributeSelector = function BizAttributeSelector(props) {
-  var defaultValue = props.defaultValue,
-      value = props.value,
-      eventIds = props.eventIds,
-      _props$responseType = props.responseType,
-      responseType = _props$responseType === void 0 ? 'id' : _props$responseType,
-      _props$showDeleteIcon = props.showDeleteIcon,
-      showDeleteIcon = _props$showDeleteIcon === void 0 ? false : _props$showDeleteIcon,
-      _props$showUserProp = props.showUserProp,
-      showUserProp = _props$showUserProp === void 0 ? true : _props$showUserProp,
-      _props$showEventEnv = props.showEventEnv,
-      showEventEnv = _props$showEventEnv === void 0 ? true : _props$showEventEnv,
-      _props$showEventProp = props.showEventProp,
-      showEventProp = _props$showEventProp === void 0 ? true : _props$showEventProp,
-      options = props.options,
-      onDelete = props.onDelete,
-      onChange = props.onChange,
-      _props$index = props.index,
-      index = _props$index === void 0 ? 0 : _props$index,
-      _props$disabled = props.disabled,
-      disabled = _props$disabled === void 0 ? [] : _props$disabled,
-      _props$placeholder = props.placeholder,
-      placeholder = _props$placeholder === void 0 ? '请选择' : _props$placeholder,
-      children = props.children;
-
-  var _useContext = useContext(BizGlobalDataContext),
-      eventMeta = _useContext.eventMeta,
-      userProps = _useContext.userProps,
-      eventEnv = _useContext.eventEnv;
+  var enableDelete = props.enableDelete,
+      placeholder = props.placeholder;
 
-  var _useState = useState([]),
+  var _useState = useState(),
       _useState2 = _slicedToArray(_useState, 2),
-      attrOptions = _useState2[0],
-      setAttrOptions = _useState2[1];
+      currentAttr = _useState2[0],
+      setCurrentAttr = _useState2[1];
 
-  var _useState3 = useState([]),
+  var _useState3 = useState(false),
       _useState4 = _slicedToArray(_useState3, 2),
-      primaryAttrOptions = _useState4[0],
-      setPrimaryAttrOptions = _useState4[1];
-
-  var _useState5 = useState(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      showDropdown = _useState6[0],
-      setShowDropdown = _useState6[1];
-
-  var attrsRef = useRef(null); // 锚点：{event:{id,children}, user:{id,children}}
-
-  var _useState7 = useState({}),
-      _useState8 = _slicedToArray(_useState7, 2),
-      anchorList = _useState8[0],
-      setAnchorList = _useState8[1]; // 动态id
+      visible = _useState4[0],
+      setVisible = _useState4[1];
 
+  var classPrefix = 'biz-attr-select';
 
-  var _useState9 = useState('list_1}'),
-      _useState10 = _slicedToArray(_useState9, 2),
-      listID = _useState10[0],
-      setListID = _useState10[1];
+  var _useState5 = useState(String(Math.random())),
+      _useState6 = _slicedToArray(_useState5, 1),
+      id = _useState6[0];
 
-  var _useState11 = useState('list_2'),
-      _useState12 = _slicedToArray(_useState11, 2),
-      allID = _useState12[0],
-      setAllID = _useState12[1]; // 搜索框是否是聚焦状态
-
-
-  var _useState13 = useState(false),
-      _useState14 = _slicedToArray(_useState13, 2),
-      focused = _useState14[0],
-      setFocused = _useState14[1]; // 搜索值
-
-
-  var _useState15 = useState(''),
-      _useState16 = _slicedToArray(_useState15, 2),
-      searchValue = _useState16[0],
-      setSearchValue = _useState16[1]; // 选中值
-
-
-  var _useState17 = useState({
-    value: ''
-  }),
-      _useState18 = _slicedToArray(_useState17, 2),
-      attrs = _useState18[0],
-      setAttrs = _useState18[1];
-
-  var _useState19 = useState(''),
-      _useState20 = _slicedToArray(_useState19, 2),
-      defaultAttrValue = _useState20[0],
-      setDefaultAttrValue = _useState20[1]; // 处理事件数据
-  // data: 所有事件（分组+属性） eventIds: 要提取属性的事件id
-
-
-  var formateEvent = function formateEvent(data, eventIds) {
-    var eventList = [];
-    var idMap = {};
-    var nameMap = {}; // 获取事件列表
+  var _useContext = useContext(BizGlobalDataContext),
+      eventGroupList = _useContext.eventGroupList,
+      userPropList = _useContext.userPropList,
+      eventEnvList = _useContext.eventEnvList;
 
-    data.forEach(function (group) {
-      var eList = group.eventList || [];
-      eList.forEach(function (event) {
-        event.event_attrs.forEach(function (prop) {
-          // prop.attrId = Math.random().toString();
-          prop.id = prop.attr_id;
-          prop.label = prop.alias_name || prop.attr_name;
-          prop.value = prop.attr_name;
-          prop.type = prop.prop_type;
-          prop.dimensionId = [prop.dimension_sub, prop.value].join(','); // 增加属性细分唯一字段，区分同名自定义属性
+  useEffect(function () {
+    if (!props.defaultValue) return;
+    setCurrentAttr(getValue(props.defaultValue));
+  }, []);
+  useEffect(function () {
+    setCurrentAttr(getValue(props.value));
+  }, [props.value]);
 
-          prop.isEventProp = true;
-          prop.realTime = true;
-          prop.custom = true;
-          prop.attrType = 'EVENT_PROP';
-        });
-        var randomId = Math.random().toString(); // 事件（分组）添加锚点id
+  function getValue(param) {
+    var res = undefined;
 
-        event.attrId = randomId;
-        if (!idMap[event.event_id]) eventList.push(event);
-        idMap[event.event_id] = event;
-        nameMap[event.event_name] = event;
+    if ((param === null || param === void 0 ? void 0 : param.propCategory) === 'envProp') {
+      eventEnvList === null || eventEnvList === void 0 ? void 0 : eventEnvList.forEach(function (attr) {
+        if (attr.name === param.name) res = attr;
       });
-    }); // 取得要展示的所有数据event
-
-    var eventResult = [];
-    var anchorList = []; // 事件属性的定位id
-
-    var firstId = Math.random().toString(); // 如果没传eventid,就展示所有属性
-
-    var ids = [];
-
-    if (eventIds) {
-      if (typeof eventIds === 'number') {
-        ids = [JSON.stringify(eventIds)];
-      } else {
-        ids = eventIds.split(',');
-      }
-    }
-
-    if (ids.length > 0) {
-      ids.forEach(function (id) {
-        var event = idMap[id.trim()];
-
-        if (event) {
-          // 要展示的属性
-          var eventProps = event.event_attrs.filter(function (prop) {
-            return !prop.hidden;
-          });
-          var randomId = Math.random().toString(); // 添加锚点
-
-          anchorList.push({
-            attrId: event.attrId || randomId,
-            name: event.alias_name || event.event_name
+    } else if ((param === null || param === void 0 ? void 0 : param.propCategory) === 'eventProp') {
+      eventGroupList === null || eventGroupList === void 0 ? void 0 : eventGroupList.forEach(function (group) {
+        group.eventList.forEach(function (event) {
+          event.attrList.forEach(function (attr) {
+            if (attr.id === param.id) res = attr;
           });
-          eventResult.push({
-            attrId: event.attrId || randomId,
-            name: ids.length > 1 ? "\u4E8B\u4EF6[".concat(event.alias_name || event.event_name, "]\u5C5E\u6027") : '事件属性',
-            children: eventProps
-          });
-        }
+        });
       });
-    }
-
-    if (eventResult.length <= 0) {
-      var _attrs = [];
-
-      var _iterator = _createForOfIteratorHelper(eventList),
-          _step;
-
-      try {
-        for (_iterator.s(); !(_step = _iterator.n()).done;) {
-          var _event = _step.value;
-
-          var eventProps = _event.event_attrs.filter(function (prop) {
-            return !prop.hidden;
-          });
-
-          _attrs = _attrs.concat(eventProps);
-        }
-      } catch (err) {
-        _iterator.e(err);
-      } finally {
-        _iterator.f();
-      }
-
-      eventResult.push({
-        attrId: firstId,
-        name: '事件属性',
-        children: _toConsumableArray(_attrs)
+    } else if ((param === null || param === void 0 ? void 0 : param.propCategory) === 'userProp') {
+      userPropList === null || userPropList === void 0 ? void 0 : userPropList.forEach(function (attr) {
+        if (attr.name === param.name && attr.category === param.category) res = attr;
       });
-    } else {
-      firstId = eventResult[0].attrId || firstId;
     }
 
-    var event = {
-      attrId: firstId,
-      name: '事件属性',
-      children: anchorList.length > 1 ? [].concat(anchorList) : []
-    };
-    return {
-      event: event,
-      eventResult: eventResult
-    };
-  };
-
-  var getOptions = function getOptions() {
-    // 所有属性 eventMeta, userProps, eventEnv
-    var attrsList = [],
-        anchors = {}; // 事件属性
-
-    if (showEventProp) {
-      var eventOptions = JSON.parse(JSON.stringify(options && options.event || eventMeta));
-
-      var _formateEvent = formateEvent(eventOptions, eventIds),
-          event = _formateEvent.event,
-          eventResult = _formateEvent.eventResult;
-
-      anchors = _objectSpread({
-        event: event
-      }, anchors);
-      attrsList = attrsList.concat(eventResult);
-    } // 如果展示用户属性
-
-
-    if (showUserProp) {
-      // 添加锚点
-      var attrId = Math.random().toString();
-      var user = {
-        attrId: attrId,
-        name: '用户属性'
-      };
-      var userOptions = JSON.parse(JSON.stringify(options && options.user || userProps)); // 添加属性
-
-      var userList = userOptions.map(function (prop) {
-        prop.attrId = Math.random().toString();
-        prop.label = prop.alias_name || prop.text;
-        prop.value = prop.name;
-        prop.isUserProp = true;
-        prop.custom = prop.category === 'custom';
-        prop.attrType = 'USER_PROP'; // 内置属性（名称、类型、诸葛ID 、用户ID）： 实时
-
-        if (prop.name === 'name' || prop.name === 'is_anonymous' || prop.name === 'zg_id' || prop.name === 'app_user_id') {
-          prop.realTime = true;
-        } else {
-          prop.realTime = false;
-        }
-
-        prop.dimensionId = [prop.dimension_sub, prop.value].join(','); // 增加属性细分唯一字段，区分同名自定义属性
-
-        return prop;
-      });
-      anchors = _objectSpread(_objectSpread({}, anchors), {}, {
-        user: user
-      });
-      attrsList.push(_objectSpread(_objectSpread({}, user), {}, {
-        children: _toConsumableArray(userList)
-      }));
-    } // 如果展示环境属性
-
+    return res;
+  }
 
-    if (showEventEnv) {
-      var _attrId = Math.random().toString();
+  function onDelete() {
+    if (props.onDelete) props.onDelete(currentAttr);
+  }
 
-      var env = {
-        attrId: _attrId,
-        name: '触发环境'
-      };
-      var envOptions = JSON.parse(JSON.stringify(options && options.env || eventEnv));
-      var envList = envOptions.map(function (prop) {
-        prop.attrId = Math.random().toString();
-        prop.label = prop.text;
-        prop.value = prop.name;
-        prop.dimensionId = [prop.dimension_sub, prop.value].join(','); // 增加属性细分唯一字段，区分同名自定义属性
-
-        prop.isEnvProp = true;
-        prop.realTime = true;
-        prop.custom = false;
-        prop.attrType = 'ENV_PROP';
-        return prop;
-      });
-      anchors = _objectSpread(_objectSpread({}, anchors), {}, {
-        env: env
-      });
-      attrsList.push(_objectSpread(_objectSpread({}, env), {}, {
-        children: _toConsumableArray(envList)
-      }));
-    }
+  function onChange(val) {
+    setVisible(false);
+    setCurrentAttr(val);
+    if (props.onChange) props.onChange(val);
+  }
 
-    setAnchorList(anchors);
-    setAttrOptions(function () {
-      return _toConsumableArray(attrsList);
-    });
-    setPrimaryAttrOptions(function () {
-      return _toConsumableArray(attrsList);
-    });
+  var onVisibleChange = function onVisibleChange(flag) {
+    setVisible(flag);
   };
 
-  useEffect(function () {
-    setListID(function () {
-      var id = Math.random().toString();
-      return "list_".concat(id);
-    });
-    setAllID(function () {
-      var id = Math.random().toString();
-      return "list_".concat(id);
-    }); // 添加点击事件监听，隐藏下拉框
-
-    var handleClick = function handleClick(e) {
-      if (!attrsRef.current || !attrsRef.current.contains(e.target)) {
-        setShowDropdown(false);
-      }
-    };
-
-    document.addEventListener('click', handleClick);
-    return function () {
-      document.removeEventListener('click', handleClick);
-    };
-  }, []);
-  useEffect(function () {
-    var intoValue = defaultValue || value;
-
-    if (intoValue) {
-      var defaultData;
-
-      if (_typeof(intoValue) === 'object') {
-        defaultData = intoValue.value || intoValue.attr_name || intoValue.name || '';
-      } else {
-        defaultData = intoValue || '';
-      }
-
-      if (util.equal(defaultAttrValue, defaultData)) return;
-      setDefaultAttrValue(function () {
-        return defaultData || '';
-      });
-    }
-  }, [defaultValue, value]);
-  useEffect(function () {
-    getOptions();
-  }, [eventIds]); // 初始内容
-
-  useEffect(function () {
-    if (defaultAttrValue === '') return;
-
-    var _iterator2 = _createForOfIteratorHelper(primaryAttrOptions),
-        _step2;
-
-    try {
-      for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-        var attr = _step2.value;
-
-        var _iterator3 = _createForOfIteratorHelper(attr.children),
-            _step3;
-
-        try {
-          var _loop = function _loop() {
-            var data = _step3.value;
-
-            if (data.value === defaultAttrValue) {
-              setAttrs(function () {
-                return _objectSpread({}, data);
-              });
-              return "break";
-            }
-          };
-
-          for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
-            var _ret = _loop();
-
-            if (_ret === "break") break;
-          }
-        } catch (err) {
-          _iterator3.e(err);
-        } finally {
-          _iterator3.f();
-        }
-      }
-    } catch (err) {
-      _iterator2.e(err);
-    } finally {
-      _iterator2.f();
-    }
-  }, [defaultAttrValue, primaryAttrOptions]); // 初始化搜索框
-
-  useEffect(function () {
-    setSearchValue(function () {
-      return '';
-    });
-  }, [showDropdown]);
-  useEffect(function () {
-    if (!showDropdown) return;
-    var searchOptions = [];
-
-    var _iterator4 = _createForOfIteratorHelper(primaryAttrOptions),
-        _step4;
-
-    try {
-      for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
-        var attr = _step4.value;
-
-        var _children = attr.children,
-            res = _objectWithoutProperties(attr, _excluded);
-
-        var child = _children.filter(function (item) {
-          return item.label && item.label.indexOf(searchValue) > -1;
-        });
-
-        searchOptions.push(_objectSpread(_objectSpread({}, res), {}, {
-          children: _toConsumableArray(child)
-        }));
-      }
-    } catch (err) {
-      _iterator4.e(err);
-    } finally {
-      _iterator4.f();
-    }
-
-    setAttrOptions(function () {
-      return [].concat(searchOptions);
-    });
-  }, [searchValue, primaryAttrOptions, showDropdown]);
   return /*#__PURE__*/React.createElement("div", {
-    className: "biz-select-cotainer biz-select-hover",
-    ref: attrsRef
+    className: classPrefix
   }, /*#__PURE__*/React.createElement("div", {
-    className: "biz-select-content",
-    onClick: function onClick() {
-      setShowDropdown(function (status) {
-        return !status;
-      });
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "biz-input ".concat(children && 'biz-bg-gray')
-  }, attrs.label ? attrs.label : /*#__PURE__*/React.createElement("span", {
-    className: "biz-placeholder"
-  }, placeholder)), /*#__PURE__*/React.createElement(IconFont, {
-    className: "biz-select-zhankai",
-    type: 'icon-xiangxia'
-  })), showDeleteIcon && /*#__PURE__*/React.createElement("div", {
-    className: "biz-option-icon biz-option-icon-delete",
-    onClick: onDelete
-  }, /*#__PURE__*/React.createElement(Tooltip, {
-    title: function title() {
-      return '删除';
-    },
-    color: "#242541",
-    key: 'delete'
-  }, /*#__PURE__*/React.createElement(IconFont, {
-    className: "biz-icon-delete",
-    type: 'icon-qingchu'
-  }))), /*#__PURE__*/React.createElement("br", null), children, showDropdown && (attrOptions.length === 0 ? /*#__PURE__*/React.createElement("div", {
-    className: "biz-select-nodata"
-  }, "\u6682\u65E0\u6570\u636E") : /*#__PURE__*/React.createElement("div", {
-    className: "biz-dropdown-container"
-  }, /*#__PURE__*/React.createElement(Input, {
-    className: "biz-search-box",
-    prefix: /*#__PURE__*/React.createElement(IconFont, {
-      className: "biz-icon",
-      type: 'icon-sousuo'
-    }),
-    value: searchValue,
-    allowClear: {
-      clearIcon: /*#__PURE__*/React.createElement(IconFont, {
-        className: "biz-icon",
-        type: 'icon-qingchu'
-      })
+    className: "".concat(classPrefix, "-handle")
+  }, /*#__PURE__*/React.createElement(Dropdown, {
+    overlay: /*#__PURE__*/React.createElement(AttrListPanel, _objectSpread(_objectSpread({
+      id: id
+    }, props), {}, {
+      value: currentAttr,
+      onChange: onChange
+    })),
+    trigger: ['click'],
+    overlayStyle: {
+      minWidth: 0
     },
-    placeholder: "\u641C\u7D22\u57CB\u70B9\u4E8B\u4EF6",
-    onChange: function onChange(e) {
-      setSearchValue(e.target.value);
-    }
-  }), /*#__PURE__*/React.createElement(Anchor, {
-    className: "biz-archon biz-archon-first",
-    affix: false,
-    onClick: function onClick(e) {
-      e.preventDefault();
-    },
-    getContainer: function getContainer() {
-      return document.getElementById(listID) || window;
-    }
-  }, /*#__PURE__*/React.createElement(Link, {
-    href: "#".concat(allID),
-    title: '全部属性'
-  }), anchorList.event && /*#__PURE__*/React.createElement(Link, {
-    href: "#".concat(anchorList.event.attrId),
-    title: anchorList.event.name
-  }), anchorList.user && /*#__PURE__*/React.createElement(Link, {
-    href: "#".concat(anchorList.user.attrId),
-    title: anchorList.user.name
-  }), anchorList.env && /*#__PURE__*/React.createElement(Link, {
-    "data-type": 'event',
-    href: "#".concat(anchorList.env.attrId),
-    title: anchorList.env.name
-  })), /*#__PURE__*/React.createElement("div", {
-    id: listID,
-    className: "biz-select-list-container"
+    visible: visible,
+    onVisibleChange: onVisibleChange
   }, /*#__PURE__*/React.createElement("div", {
-    id: allID,
     style: {
-      width: '100%',
-      height: '5px'
+      width: '100%'
     }
-  }), attrOptions.map(function (item) {
-    var group = /*#__PURE__*/React.createElement("div", {
-      key: item.attrId,
-      id: item.attrId,
-      className: "biz-drop-option biz-drop-menu"
-    }, /*#__PURE__*/React.createElement("span", null, item.name), /*#__PURE__*/React.createElement("div", {
-      className: "biz-menu-split"
-    }));
-    var childList = item.children.map(function (child) {
-      var _item$name;
-
-      return /*#__PURE__*/React.createElement("div", {
-        // key={child.attrId}
-        key: child.dimensionId,
-        className: "biz-drop-option biz-drop-index boxBg\n                    ".concat(child.value === attrs.value && 'box-active', "\n                    ").concat(child.value && attrs.value !== child.value && disabled.indexOf(child.value) > -1 && 'box-disabled'),
-        onClick: function onClick(e) {
-          e.stopPropagation();
-
-          if (child.value && attrs.value !== child.value && disabled.indexOf(child.value) > -1) {
-            return;
-          }
-
-          setAttrs(function () {
-            return _objectSpread({}, child);
-          });
-          setShowDropdown(false);
-
-          if (onChange) {
-            var data = JSON.parse(JSON.stringify(child));
-            delete data.attrId;
-
-            if (responseType === 'id') {
-              onChange(data.value || '', data, index);
-            } else {
-              onChange(data, data.value || '', index);
-            }
-          }
-        }
-      }, /*#__PURE__*/React.createElement(IconFont, {
-        className: "biz-icon biz-icon-index",
-        type: "".concat(item.name && item.name.indexOf('用户') > -1 ? 'icon-yonghushuxing' : item.name && ((_item$name = item.name) === null || _item$name === void 0 ? void 0 : _item$name.indexOf('事件')) > -1 ? 'icon-shijianshuxing1' : 'icon-chufahuanjing')
-      }), /*#__PURE__*/React.createElement("span", {
-        dangerouslySetInnerHTML: {
-          __html: util.setHighLight(child.label || '', searchValue)
-        }
-      }));
-    });
-    childList.unshift(group);
-    return childList;
-  })))));
+  }, /*#__PURE__*/React.createElement(SelectHandle, {
+    theme: "secondary",
+    border: false,
+    label: currentAttr === null || currentAttr === void 0 ? void 0 : currentAttr.label,
+    placeholder: placeholder
+  }))), enableDelete && /*#__PURE__*/React.createElement(Tooltip, {
+    title: function title() {
+      return '删除';
+    }
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    className: "".concat(classPrefix, "-del-icon"),
+    type: 'icon-qingchu',
+    onClick: onDelete
+  }))));
 };
 
+BizAttributeSelector.defaultProps = {
+  enableDelete: false,
+  placeholder: '请选择'
+};
 export default BizAttributeSelector;

package/es/attributeSelector/listPanel.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { AttributeSelect } from './types';
+declare const AttrListPanel: React.FC<AttributeSelect.Props>;
+export default AttrListPanel;