@zgfe/business-lib 1.0.0-beta.1

package/es/targetSelector/components/BizEventNameEditBox.js

@@ -0,0 +1,57 @@
+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."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import { Input } from 'antd';
+import React, { useEffect, useRef, useState } from 'react';
+
+var BizEventNameEditBox = function BizEventNameEditBox(props) {
+  var defaultValue = props.defaultValue,
+      onCancel = props.onCancel,
+      onChange = props.onChange;
+  var inputRef = useRef(null);
+
+  var _useState = useState(defaultValue || ''),
+      _useState2 = _slicedToArray(_useState, 2),
+      alias = _useState2[0],
+      setAlias = _useState2[1];
+
+  useEffect(function () {
+    inputRef.current.focus({
+      cursor: 'end'
+    });
+  }, []);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "biz-edit-pop-modal"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "biz-search active"
+  }, /*#__PURE__*/React.createElement(Input, {
+    className: "biz-search-box",
+    placeholder: "\u8F93\u5165\u522B\u540D",
+    ref: inputRef,
+    value: alias,
+    onChange: function onChange(e) {
+      setAlias(e.target.value);
+    }
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "biz-modal-footer"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "biz-btn biz-btn-primary",
+    onClick: function onClick() {
+      onChange(alias);
+    }
+  }, "\u786E\u5B9A"), /*#__PURE__*/React.createElement("div", {
+    className: "biz-btn biz-btn-text",
+    onClick: onCancel
+  }, "\u53D6\u6D88")));
+};
+
+export default BizEventNameEditBox;

package/es/targetSelector/demo/form.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => JSX.Element;
+export default _default;

package/es/targetSelector/demo/form.js

@@ -0,0 +1,133 @@
+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."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import { Button, Form } from 'antd';
+import React, { useState } from 'react';
+import { BizTargetSelector, BizEventSelector } from 'business-lib';
+var cascadeOptions = [{
+  value: 1,
+  label: '整体',
+  children: [{
+    value: 'xihu',
+    label: 'West Lake'
+  }, {
+    value: 'xiasha',
+    label: 'Xia Sha'
+  }]
+}, {
+  value: 2,
+  label: '分组',
+  children: [{
+    value: 'xihu2',
+    label: 'West Lake2'
+  }, {
+    value: 'xiasha2',
+    label: 'Xia Sha2j'
+  }, {
+    value: 'xihu21',
+    label: 'West Lake2h'
+  }, {
+    value: 'xiasha21',
+    label: 'Xia Sha2'
+  }, {
+    value: 'xihu22',
+    label: 'West Lake2m'
+  }, {
+    value: 'xiasha22',
+    label: 'Xia Sha2n'
+  }, {
+    value: 'xihu27',
+    label: 'West Lake2b'
+  }, {
+    value: 'xiasha82',
+    label: 'Xia Sha2v'
+  }, {
+    value: 'xihu23',
+    label: 'West Lake2c'
+  }, {
+    value: 'xiasha23',
+    label: 'Xia Sha2z'
+  }, {
+    value: 'xihu24',
+    label: 'West Lake22x'
+  }, {
+    value: 'xiasha24',
+    label: 'Xia Sha2a'
+  }]
+}];
+
+var EventDemo = function EventDemo() {
+  var _Form$useForm = Form.useForm(),
+      _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
+      form = _Form$useForm2[0];
+
+  var _useState = useState(''),
+      _useState2 = _slicedToArray(_useState, 2),
+      formData = _useState2[0],
+      setFormData = _useState2[1];
+
+  var onFinish = function onFinish(values) {
+    setFormData(JSON.stringify(values));
+  };
+
+  var onFinishFailed = function onFinishFailed(errorInfo) {
+    console.log('Failed:', errorInfo);
+  };
+
+  var handleAdd = function handleAdd(data) {
+    console.log('add', data);
+  };
+
+  var handleDelete = function handleDelete(data) {
+    console.log('delete', data);
+  };
+
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Form, {
+    form: form,
+    onFinish: onFinish,
+    onFinishFailed: onFinishFailed,
+    initialValues: {
+      target: {
+        aliasName: '别名',
+        option: 'xiasha2'
+      }
+    }
+  }, /*#__PURE__*/React.createElement(Form.Item, {
+    label: "\u6307\u6807",
+    name: "target"
+  }, /*#__PURE__*/React.createElement(BizTargetSelector, {
+    onAdd: handleAdd,
+    onDelete: handleDelete
+  }, /*#__PURE__*/React.createElement(BizEventSelector, {
+    responseType: 'object',
+    fieldNames: {
+      label: 'label',
+      value: 'value',
+      groupLabel: 'label',
+      groupValue: 'value',
+      children: 'children'
+    },
+    options: cascadeOptions
+  }))), /*#__PURE__*/React.createElement(Form.Item, {
+    wrapperCol: {
+      offset: 8,
+      span: 16
+    }
+  }, /*#__PURE__*/React.createElement(Button, {
+    type: "primary",
+    htmlType: "submit"
+  }, "Submit"))), /*#__PURE__*/React.createElement("p", null, formData));
+};
+
+export default (function () {
+  return /*#__PURE__*/React.createElement(EventDemo, null);
+});

package/es/targetSelector/demo/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => JSX.Element;
+export default _default;

package/es/targetSelector/demo/index.js

@@ -0,0 +1,107 @@
+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."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import React, { useState } from 'react';
+import { BizTargetSelector, BizEventSelector } from 'business-lib';
+var cascadeOptions = [{
+  value: 1,
+  label: '整体',
+  children: [{
+    value: 'xihu',
+    label: 'West Lake'
+  }, {
+    value: 'xiasha',
+    label: 'Xia Sha'
+  }]
+}, {
+  value: 2,
+  label: '分组',
+  children: [{
+    value: 'xihu2',
+    label: 'West Lake2'
+  }, {
+    value: 'xiasha2',
+    label: 'Xia Sha2j'
+  }, {
+    value: 'xihu21',
+    label: 'West Lake2h'
+  }, {
+    value: 'xiasha21',
+    label: 'Xia Sha2'
+  }, {
+    value: 'xihu22',
+    label: 'West Lake2m'
+  }, {
+    value: 'xiasha22',
+    label: 'Xia Sha2n'
+  }, {
+    value: 'xihu27',
+    label: 'West Lake2b'
+  }, {
+    value: 'xiasha82',
+    label: 'Xia Sha2v'
+  }, {
+    value: 'xihu23',
+    label: 'West Lake2c'
+  }, {
+    value: 'xiasha23',
+    label: 'Xia Sha2z'
+  }, {
+    value: 'xihu24',
+    label: 'West Lake22x'
+  }, {
+    value: 'xiasha24',
+    label: 'Xia Sha2a'
+  }]
+}];
+
+var EventDemo = function EventDemo() {
+  var _useState = useState({}),
+      _useState2 = _slicedToArray(_useState, 2),
+      test = _useState2[0],
+      setTest = _useState2[1];
+
+  var handleChange = function handleChange(value) {
+    setTest(value);
+  };
+
+  var handleAdd = function handleAdd(data) {
+    console.log('add', data);
+  };
+
+  var handleDelete = function handleDelete(data) {
+    console.log('delete', data);
+  };
+
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(BizTargetSelector, {
+    defaultValue: {
+      aliasName: '别名',
+      option: 'xiasha2'
+    },
+    onChange: handleChange,
+    onAdd: handleAdd,
+    onDelete: handleDelete
+  }, /*#__PURE__*/React.createElement(BizEventSelector, {
+    fieldNames: {
+      label: 'label',
+      value: 'value',
+      groupLabel: 'label',
+      groupValue: 'value',
+      children: 'children'
+    },
+    options: cascadeOptions
+  })), /*#__PURE__*/React.createElement("p", null, "\u5F53\u524D\u9009\u62E9\u7684\u6307\u6807\u4FE1\u606F\u662F\uFF1A", JSON.stringify(test)));
+};
+
+export default (function () {
+  return /*#__PURE__*/React.createElement(EventDemo, null);
+});

package/es/targetSelector/demo/nodata.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => JSX.Element;
+export default _default;

package/es/targetSelector/demo/nodata.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { BizTargetSelector, BizEventSelector } from 'business-lib';
+var optionGroup = [];
+
+var EventDemo = function EventDemo() {
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(BizTargetSelector, null, /*#__PURE__*/React.createElement(BizEventSelector, {
+    options: optionGroup
+  })));
+};
+
+export default (function () {
+  return /*#__PURE__*/React.createElement(EventDemo, null);
+});

package/es/targetSelector/index.d.ts

@@ -0,0 +1,40 @@
+import React, { ReactNode } from 'react';
+import './index.less';
+interface ValueType {
+    aliasName?: string;
+    option?: object | string | number;
+}
+interface EventBoxProps {
+    /**
+     * @description     默认的选中项
+     * @default         -
+     */
+    defaultValue?: ValueType;
+    /**
+     * @description     指定选中项
+     * @default         -
+     */
+    value?: ValueType;
+    /**
+     * @description     内嵌组件
+     * @default         -
+     */
+    children?: ReactNode;
+    /**
+     * @description     添加筛选的回调
+     * @default         -
+     */
+    onAdd?: (value: string | number | object) => void;
+    /**
+     * @description     删除的回调
+     * @default         -
+     */
+    onDelete?: () => void;
+    /**
+     * @description     选择完成后的回调
+     * @default         -
+     */
+    onChange: (data: ValueType) => void;
+}
+declare const BizTargetSelector: React.FC<EventBoxProps>;
+export default BizTargetSelector;

package/es/targetSelector/index.js

@@ -0,0 +1,204 @@
+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 _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 _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."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import React, { useEffect, useRef, useState } from 'react';
+import BizEventNameEditBox from './components/BizEventNameEditBox';
+import { IconFont } from '..';
+import { Dropdown, Menu, Tooltip } from 'antd';
+import './index.less';
+
+var BizTargetSelector = function BizTargetSelector(props) {
+  var _props$defaultValue = props.defaultValue,
+      defaultValue = _props$defaultValue === void 0 ? {} : _props$defaultValue,
+      _props$value = props.value,
+      value = _props$value === void 0 ? {} : _props$value,
+      _onChange = props.onChange,
+      onAdd = props.onAdd,
+      onDelete = props.onDelete,
+      children = props.children;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      showEditModal = _useState2[0],
+      setShowEditModal = _useState2[1];
+
+  var _useState3 = useState(),
+      _useState4 = _slicedToArray(_useState3, 2),
+      defaultData = _useState4[0],
+      setDefaultData = _useState4[1];
+
+  var _useState5 = useState(defaultValue.aliasName || value.aliasName || ''),
+      _useState6 = _slicedToArray(_useState5, 2),
+      alias = _useState6[0],
+      setAlias = _useState6[1];
+
+  var editModalRef = useRef(null);
+  var editMenuRef = useRef(null); // 更多操作
+
+  var menu = /*#__PURE__*/React.createElement(Menu, null, /*#__PURE__*/React.createElement(Menu.Item, {
+    key: "1"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "biz-menu-item-edit",
+    ref: editMenuRef,
+    onClick: function onClick(e) {
+      e.stopPropagation();
+      e.nativeEvent.stopImmediatePropagation();
+      setShowEditModal(true);
+    }
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    className: "ant-dropdown-menu-item-icon",
+    type: 'icon-bianji'
+  }), "\u7F16\u8F91\u522B\u540D")), /*#__PURE__*/React.createElement(Menu.Divider, null), /*#__PURE__*/React.createElement(Menu.Item, {
+    key: "2",
+    onClick: function onClick() {
+      return _onAdd();
+    },
+    icon: /*#__PURE__*/React.createElement(IconFont, {
+      className: "",
+      type: 'icon-shaixuan'
+    })
+  }, "\u6DFB\u52A0\u7B5B\u9009"), /*#__PURE__*/React.createElement(Menu.Item, {
+    key: "3",
+    onClick: function onClick() {
+      return _onDelete();
+    },
+    icon: /*#__PURE__*/React.createElement(IconFont, {
+      className: "",
+      type: 'icon-shanchu'
+    })
+  }, "\u5220\u9664\u6307\u6807"));
+
+  var _onAdd = function _onAdd() {
+    if (!defaultData) return;
+    onAdd && onAdd(defaultData);
+  };
+
+  var _onDelete = function _onDelete() {
+    onDelete && onDelete();
+  }; // 初始化
+
+
+  useEffect(function () {
+    var handleClick = function handleClick(e) {
+      if (!editModalRef.current || !editModalRef.current.contains(e.target)) {
+        setShowEditModal(false);
+      }
+    };
+
+    document.addEventListener('click', handleClick, false);
+    return function () {
+      document.removeEventListener('click', handleClick, false);
+    };
+  }, []);
+  useEffect(function () {
+    var inValue = defaultValue.option || value.option;
+    var inAlias = defaultValue.aliasName || value.aliasName;
+    console.log('value>>>', inValue);
+
+    if (JSON.stringify(inValue) !== JSON.stringify(defaultData)) {
+      setDefaultData(function () {
+        if (_typeof(inValue) === 'object') {
+          return _objectSpread({}, inValue);
+        } else {
+          return inValue;
+        }
+      });
+    }
+
+    if (inAlias !== alias) {
+      setAlias(function () {
+        return inAlias || '';
+      });
+    }
+  }, [defaultValue, value]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "biz-select-cotainer biz-target-container",
+    tabIndex: 0
+  }, /*#__PURE__*/React.cloneElement(children, {
+    aliasName: alias,
+    defaultValue: defaultData,
+    onChange: function onChange(data) {
+      _onChange && _onChange({
+        aliasName: alias,
+        option: data
+      });
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "biz-options"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "biz-option-icon",
+    onClick: _onAdd
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    title: function title() {
+      return '添加筛选';
+    },
+    color: "#242541",
+    key: 'delete'
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    className: "",
+    type: 'icon-shaixuan'
+  }))), /*#__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: "",
+    type: 'icon-qingchu'
+  }))), defaultData && /*#__PURE__*/React.createElement(Dropdown, {
+    overlay: menu,
+    overlayClassName: "large",
+    trigger: ['click']
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "biz-option-icon"
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    title: function title() {
+      return '编辑别名、筛选、删除';
+    },
+    color: "#242541",
+    key: 'delete'
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    type: 'icon-gengduocaozuo1'
+  }))))), showEditModal && /*#__PURE__*/React.createElement("div", {
+    className: "biz-edit-modal",
+    ref: editModalRef
+  }, /*#__PURE__*/React.createElement(BizEventNameEditBox, {
+    defaultValue: alias,
+    onCancel: function onCancel() {
+      return setShowEditModal(false);
+    },
+    onChange: function onChange(value) {
+      setAlias(function () {
+        return value;
+      });
+      setShowEditModal(false);
+      _onChange && _onChange({
+        aliasName: value,
+        option: defaultData
+      });
+    }
+  })));
+};
+
+export default BizTargetSelector;

package/es/targetSelector/index.less

@@ -0,0 +1,53 @@
+@import '../commonStyle/icon.less';
+@import '../commonStyle/index.less';
+
+// .ant-dropdown-menu {
+//   width: 200px;
+//   padding: 8px;
+//   background: #ffffff;
+//   border-radius: 10px;
+//   box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
+// }
+
+// .ant-dropdown-menu-item {
+//   padding: 14px 8px;
+//   line-height: 20px;
+//   border-radius: 10px;
+
+//   &:not(.box-active):hover {
+//     .box-hover();
+//   }
+//   &.box-active:hover {
+//     .box-active();
+//   }
+//   .ant-dropdown-menu-item-icon {
+//     margin-right: 15px;
+//     font-size: @iconSize;
+//   }
+// }
+
+.biz-placeholder {
+  color: #9797af;
+}
+
+.biz-menu-item-edit {
+  width: 100%;
+  height: 100%;
+  .ant-dropdown-menu-item-icon {
+    margin-right: 15px;
+    font-size: @iconSize;
+  }
+}
+.biz-target-container {
+  .biz-select-cotainer {
+    margin-bottom: 0;
+    padding: 0;
+    border: none;
+  }
+  .ant-form {
+    flex: 1;
+    .ant-form-item {
+      margin-bottom: 0;
+    }
+  }
+}

package/es/userGroup/demo/cluster.d.ts

@@ -0,0 +1,3 @@
+import './index.less';
+declare const _default: () => JSX.Element;
+export default _default;