tntd 3.0.0-beta.1 → 3.0.0-beta.2

package/lib/query-form/Field/Composition/index.js

@@ -1,89 +1,96 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
-const LocaleReceiver_1 = __importDefault(require("antd/es/locale-provider/LocaleReceiver"));
-const icon_1 = __importDefault(require("../../../icon"));
-const tag_1 = __importDefault(require("../../../tag"));
-const input_1 = __importDefault(require("../../../input"));
-const FieldPopover_1 = __importDefault(require("./FieldPopover"));
+exports["default"] = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _LocaleReceiver = _interopRequireDefault(require("antd/lib/locale-provider/LocaleReceiver"));
+var _icon = _interopRequireDefault(require("../../../icon"));
+var _tag = _interopRequireDefault(require("../../../tag"));
+var _input = _interopRequireDefault(require("../../../input"));
+var _FieldPopover = _interopRequireDefault(require("./FieldPopover"));
 require("./index.less");
-const parseObjectToArray = (value, data) => {
-    var _a, _b;
-    return (_b = (_a = Object.keys(value)) === null || _a === void 0 ? void 0 : _a.map((key) => {
-        var _a, _b, _c;
-        const target = data === null || data === void 0 ? void 0 : data.find((item) => { var _a; return ((_a = item.props) === null || _a === void 0 ? void 0 : _a.name) === key; });
-        if (!target)
-            return null;
-        const dataItem = (target === null || target === void 0 ? void 0 : target.props) || {};
-        const { type, component, setLabel, props: fieldProps, propsTitle, title, name, } = dataItem || {};
-        const _propsTitle = propsTitle || title || name;
-        const { options } = fieldProps || {};
-        const fieldNames = ((_a = dataItem === null || dataItem === void 0 ? void 0 : dataItem.props) === null || _a === void 0 ? void 0 : _a.fieldNames) || {
-            label: 'label',
-            value: 'value',
-        };
-        let labelValue = value[key];
-        if (!type && component) {
-            if (!setLabel) {
-                console.error('自定义组件需要传入setLabel()方法');
-            }
-        }
-        else if (options) {
-            if (type === 'selectInput') {
-                const selectKey = (_b = Object.keys(labelValue)) === null || _b === void 0 ? void 0 : _b[0];
-                const inputValue = labelValue[selectKey];
-                const selectLabel = (_c = options === null || options === void 0 ? void 0 : options.find((v) => v.value === selectKey)) === null || _c === void 0 ? void 0 : _c.label;
-                return {
-                    key,
-                    value: value[key],
-                    label: selectLabel + ':' + inputValue,
-                };
-            }
-            const target = options === null || options === void 0 ? void 0 : options.find((item) => {
-                const valueKey = fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.value;
-                const itemValue = item instanceof Object ? item[valueKey] : item;
-                return itemValue === value[key];
-            });
-            labelValue = target instanceof Object ? target === null || target === void 0 ? void 0 : target[fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.label] : target;
-        }
-        // setLabel: 对于自定义组件，无法控制label的显示，可以通过setLabel方法控制
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _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 _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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+var parseObjectToArray = function parseObjectToArray(value, data) {
+  var _a, _b;
+  return (_b = (_a = Object.keys(value)) === null || _a === void 0 ? void 0 : _a.map(function (key) {
+    var _a, _b, _c;
+    var target = data === null || data === void 0 ? void 0 : data.find(function (item) {
+      var _a;
+      return ((_a = item.props) === null || _a === void 0 ? void 0 : _a.name) === key;
+    });
+    if (!target) return null;
+    var dataItem = (target === null || target === void 0 ? void 0 : target.props) || {};
+    var _ref = dataItem || {},
+      type = _ref.type,
+      component = _ref.component,
+      setLabel = _ref.setLabel,
+      fieldProps = _ref.props,
+      propsTitle = _ref.propsTitle,
+      title = _ref.title,
+      name = _ref.name;
+    var _propsTitle = propsTitle || title || name;
+    var _ref2 = fieldProps || {},
+      options = _ref2.options;
+    var fieldNames = ((_a = dataItem === null || dataItem === void 0 ? void 0 : dataItem.props) === null || _a === void 0 ? void 0 : _a.fieldNames) || {
+      label: 'label',
+      value: 'value'
+    };
+    var labelValue = value[key];
+    if (!type && component) {
+      if (!setLabel) {
+        console.error('自定义组件需要传入setLabel()方法');
+      }
+    } else if (options) {
+      if (type === 'selectInput') {
+        var selectKey = (_b = Object.keys(labelValue)) === null || _b === void 0 ? void 0 : _b[0];
+        var inputValue = labelValue[selectKey];
+        var selectLabel = (_c = options === null || options === void 0 ? void 0 : options.find(function (v) {
+          return v.value === selectKey;
+        })) === null || _c === void 0 ? void 0 : _c.label;
         return {
-            key,
-            value: value[key],
-            label: setLabel ? setLabel(labelValue) : _propsTitle + ':' + labelValue,
+          key: key,
+          value: value[key],
+          label: selectLabel + ':' + inputValue
         };
-    })) === null || _b === void 0 ? void 0 : _b.filter((item) => !!item);
+      }
+      var _target = options === null || options === void 0 ? void 0 : options.find(function (item) {
+        var valueKey = fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.value;
+        var itemValue = item instanceof Object ? item[valueKey] : item;
+        return itemValue === value[key];
+      });
+      labelValue = _target instanceof Object ? _target === null || _target === void 0 ? void 0 : _target[fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.label] : _target;
+    }
+    // setLabel: 对于自定义组件，无法控制label的显示，可以通过setLabel方法控制
+    return {
+      key: key,
+      value: value[key],
+      label: setLabel ? setLabel(labelValue) : _propsTitle + ':' + labelValue
+    };
+  })) === null || _b === void 0 ? void 0 : _b.filter(function (item) {
+    return !!item;
+  });
 };
-const parseArrayToObject = (value) => value === null || value === void 0 ? void 0 : value.reduce((acc, v) => {
+var parseArrayToObject = function parseArrayToObject(value) {
+  return value === null || value === void 0 ? void 0 : value.reduce(function (acc, v) {
     acc[v.key] = v.value;
     return acc;
-}, {});
+  }, {});
+};
 // import './index.less';
 /**
  *
@@ -99,161 +106,225 @@ const parseArrayToObject = (value) => value === null || value === void 0 ? void
  * @param {*} ref
  * @returns
  */
-const CompositionInput = ({ value: _value, data, initialValues, onChange, placeholder, disabled, form, style, clsPrefix }, ref) => {
-    const prefix = `${clsPrefix}-composition-input`;
-    const [value, setValue] = (0, react_1.useState)([]);
-    const [tempItem, setTempItem] = (0, react_1.useState)();
-    const [searchText, setSearchText] = (0, react_1.useState)('');
-    const [visible, setVisible] = (0, react_1.useState)(false);
-    const [searchTarget, setSearchTarget] = (0, react_1.useState)(null);
-    const inputRef = (0, react_1.useRef)(null);
-    const widthRef = (0, react_1.useRef)(null);
-    const handleFocus = (e) => {
-        var _a;
-        e.preventDefault();
-        (_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        if (!visible) {
-            setVisible(true);
-        }
-    };
-    (0, react_1.useImperativeHandle)(ref, () => ({
-        changeVal: () => {
-            return value;
-        },
-    }));
-    (0, react_1.useEffect)(() => {
-        form.on('setValue', updateValue);
-        form.on('setValues', onFormChange);
-        return () => {
-            form.off('setValue', updateValue);
-            form.off('setValues', onFormChange);
-        };
-    }, []);
-    (0, react_1.useEffect)(() => {
-        if (initialValues) {
-            setValue(parseObjectToArray(initialValues, data));
-        }
-    }, [initialValues, data]);
-    (0, react_1.useEffect)(() => {
-        if (!visible) {
-            const newValues = value === null || value === void 0 ? void 0 : value.filter((v) => !!(v === null || v === void 0 ? void 0 : v.value));
-            if (newValues.length !== (value === null || value === void 0 ? void 0 : value.length)) {
-                setValue(newValues);
-            }
-        }
-    }, [visible, value]);
-    (0, react_1.useLayoutEffect)(() => {
-        const target = document.querySelector(`.${prefix} .inputClass`);
-        if (!target)
-            return;
-        if (searchText && widthRef.current.clientWidth > 50) {
-            target.style.width = widthRef.current.clientWidth + 10 + 'px';
-        }
-        else if (!(value === null || value === void 0 ? void 0 : value.length)) {
-            target.style.width = '300px';
-        }
-        else {
-            target.style.width = '100px';
-        }
-    }, [searchText, value]);
-    const updateValue = (name, value) => {
-        // if (name === this.props.name) {
-        //   this.setState({ value })
-        //   this.props.onChange(name, value)
-        // }
-    };
-    const onFormChange = (formData) => {
-        setValue(parseObjectToArray(formData, data));
-    };
-    const onClear = (e) => {
-        e.stopPropagation();
-        const deleteKeys = value === null || value === void 0 ? void 0 : value.map(({ key }) => key);
-        setValue([]);
-        onChange([], deleteKeys);
-    };
-    const onDelete = (key, e) => {
-        e.preventDefault();
-        if (value.length > 0) {
-            const newValue = value.filter((v) => v.key !== key);
-            setValue(newValue);
-            const deleteKeys = [key];
-            onChange(parseArrayToObject(newValue), deleteKeys);
-        }
+var CompositionInput = function CompositionInput(_ref3, ref) {
+  var _value = _ref3.value,
+    data = _ref3.data,
+    initialValues = _ref3.initialValues,
+    onChange = _ref3.onChange,
+    placeholder = _ref3.placeholder,
+    disabled = _ref3.disabled,
+    form = _ref3.form,
+    style = _ref3.style,
+    clsPrefix = _ref3.clsPrefix;
+  var prefix = "".concat(clsPrefix, "-composition-input");
+  var _useState = (0, _react.useState)([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    value = _useState2[0],
+    setValue = _useState2[1];
+  var _useState3 = (0, _react.useState)(),
+    _useState4 = _slicedToArray(_useState3, 2),
+    tempItem = _useState4[0],
+    setTempItem = _useState4[1];
+  var _useState5 = (0, _react.useState)(''),
+    _useState6 = _slicedToArray(_useState5, 2),
+    searchText = _useState6[0],
+    setSearchText = _useState6[1];
+  var _useState7 = (0, _react.useState)(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    visible = _useState8[0],
+    setVisible = _useState8[1];
+  var _useState9 = (0, _react.useState)(null),
+    _useState10 = _slicedToArray(_useState9, 2),
+    searchTarget = _useState10[0],
+    setSearchTarget = _useState10[1];
+  var inputRef = (0, _react.useRef)(null);
+  var widthRef = (0, _react.useRef)(null);
+  var handleFocus = function handleFocus(e) {
+    var _a;
+    e.preventDefault();
+    (_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    if (!visible) {
+      setVisible(true);
+    }
+  };
+  (0, _react.useImperativeHandle)(ref, function () {
+    return {
+      changeVal: function changeVal() {
+        return value;
+      }
     };
-    const handleFieldChange = (value, isInput, hasValue) => {
-        if (isInput) {
-            setSearchText(value === null || value === void 0 ? void 0 : value.label);
-            setTempItem(value);
-            return;
-        }
-        setValue(value);
+  });
+  (0, _react.useEffect)(function () {
+    var values = form.getValues();
+    if (values) {
+      setValue(parseObjectToArray(values, data));
+    }
+  }, [data, form]);
+  (0, _react.useEffect)(function () {
+    if (!visible) {
+      var newValues = value === null || value === void 0 ? void 0 : value.filter(function (v) {
+        return !!(v === null || v === void 0 ? void 0 : v.value);
+      });
+      if (newValues.length !== (value === null || value === void 0 ? void 0 : value.length)) {
+        setValue(newValues);
+      }
+    }
+  }, [visible, value]);
+  (0, _react.useLayoutEffect)(function () {
+    var target = document.querySelector(".".concat(prefix, " .inputClass"));
+    if (!target) return;
+    if (searchText && widthRef.current.clientWidth > 50) {
+      target.style.width = widthRef.current.clientWidth + 10 + 'px';
+    } else if (!(value === null || value === void 0 ? void 0 : value.length)) {
+      target.style.width = '300px';
+    } else {
+      target.style.width = '100px';
+    }
+  }, [searchText, value]);
+  var updateValue = function updateValue(name, value) {
+    // if (name === this.props.name) {
+    //   this.setState({ value })
+    //   this.props.onChange(name, value)
+    // }
+  };
+  var onFormChange = function onFormChange(formData) {
+    setValue(parseObjectToArray(formData, data));
+  };
+  var onClear = function onClear(e) {
+    e.stopPropagation();
+    var deleteKeys = value === null || value === void 0 ? void 0 : value.map(function (_ref4) {
+      var key = _ref4.key;
+      return key;
+    });
+    setValue([]);
+    onChange([], deleteKeys);
+  };
+  var onDelete = function onDelete(key, e) {
+    e.preventDefault();
+    if (value.length > 0) {
+      var newValue = value.filter(function (v) {
+        return v.key !== key;
+      });
+      setValue(newValue);
+      var deleteKeys = [key];
+      onChange(parseArrayToObject(newValue), deleteKeys);
+    }
+  };
+  var handleFieldChange = function handleFieldChange(value, isInput, hasValue) {
+    if (isInput) {
+      setSearchText(value === null || value === void 0 ? void 0 : value.label);
+      setTempItem(value);
+      return;
+    }
+    setValue(value);
+    setSearchText('');
+    setTempItem();
+    console.log('*****value****', value);
+    if (hasValue) onChange(parseArrayToObject(value));
+  };
+  var onInputChange = function onInputChange(value) {
+    if (tempItem) {
+      var regex = /^.+:.*$/;
+      if (regex.test(value)) {
+        // 有输入值
+        setSearchText(value);
+      } else {
+        // 没有输入值, 清空选择的属性类型重新显示属性列表
         setSearchText('');
         setTempItem();
-        console.log('*****value****', value);
-        if (hasValue)
-            onChange(parseArrayToObject(value));
-    };
-    const onInputChange = (value) => {
-        if (tempItem) {
-            const regex = /^.+:.*$/;
-            if (regex.test(value)) {
-                // 有输入值
-                setSearchText(value);
-            }
-            else {
-                // 没有输入值, 清空选择的属性类型重新显示属性列表
-                setSearchText('');
-                setTempItem();
-                setVisible(true);
-            }
-        }
-        else {
-            setSearchText(value);
-        }
-    };
-    const onPressEnter = (e) => {
-        var _a;
-        const inputValue = ((_a = searchText === null || searchText === void 0 ? void 0 : searchText.match(/[^:]+:(.*)/)) === null || _a === void 0 ? void 0 : _a[1]) || null;
-        if (tempItem && inputValue) {
-            setVisible(false);
-            tempItem.label = searchText;
-            tempItem.value = inputValue; // 得到输入值
-            if (!(value === null || value === void 0 ? void 0 : value.find((v) => v.key === tempItem.key))) {
-                const newValue = [...value, tempItem];
-                setValue(newValue);
-                onChange(parseArrayToObject(newValue));
-            }
-            else {
-                const newValue = value.map((v) => (v.key === tempItem.key ? tempItem : v));
-                setValue(newValue);
-                onChange(parseArrayToObject(newValue));
-            }
-            setTempItem();
-            setSearchText('');
-        }
-        if (searchText && !searchTarget) {
-            setSearchText('');
+        setVisible(true);
+      }
+    } else {
+      setSearchText(value);
+    }
+  };
+  var onPressEnter = function onPressEnter(e) {
+    var _a;
+    var inputValue = ((_a = searchText === null || searchText === void 0 ? void 0 : searchText.match(/[^:]+:(.*)/)) === null || _a === void 0 ? void 0 : _a[1]) || null;
+    if (tempItem && inputValue) {
+      setVisible(false);
+      tempItem.label = searchText;
+      tempItem.value = inputValue; // 得到输入值
+      if (!(value === null || value === void 0 ? void 0 : value.find(function (v) {
+        return v.key === tempItem.key;
+      }))) {
+        var newValue = [].concat(_toConsumableArray(value), [tempItem]);
+        setValue(newValue);
+        onChange(parseArrayToObject(newValue));
+      } else {
+        var _newValue = value.map(function (v) {
+          return v.key === tempItem.key ? tempItem : v;
+        });
+        setValue(_newValue);
+        onChange(parseArrayToObject(_newValue));
+      }
+      setTempItem();
+      setSearchText('');
+    }
+    if (searchText && !searchTarget) {
+      setSearchText('');
+    }
+  };
+  return _react["default"].createElement(_LocaleReceiver["default"], {
+    componentName: "QueryForm"
+  }, function (locale) {
+    return _react["default"].createElement("div", {
+      className: prefix,
+      style: style,
+      onClick: handleFocus
+    }, _react["default"].createElement("span", {
+      className: "".concat(prefix, "-width"),
+      ref: widthRef
+    }, searchText), _react["default"].createElement("ul", {
+      className: "".concat(prefix, "-items")
+    }, value && value.map(function (item, index) {
+      return _react["default"].createElement("li", {
+        key: index,
+        className: "".concat(prefix, "-items-item")
+      }, _react["default"].createElement(_tag["default"], {
+        closable: !disabled,
+        onClose: function onClose(e) {
+          return onDelete(item.key, e);
         }
-    };
-    return (react_1.default.createElement(LocaleReceiver_1.default, { componentName: "QueryForm" }, (locale) => {
-        return (react_1.default.createElement("div", { className: prefix, style: style, onClick: handleFocus },
-            react_1.default.createElement("span", { className: `${prefix}-width`, ref: widthRef }, searchText),
-            react_1.default.createElement("ul", { className: `${prefix}-items` },
-                value &&
-                    value.map((item, index) => (react_1.default.createElement("li", { key: index, className: `${prefix}-items-item` },
-                        react_1.default.createElement(tag_1.default, { closable: !disabled, onClose: (e) => onDelete(item.key, e) }, item === null || item === void 0 ? void 0 : item.label)))),
-                react_1.default.createElement("li", { className: `${prefix}-items-input` },
-                    react_1.default.createElement(FieldPopover_1.default, { onChange: handleFieldChange, clsPrefix: clsPrefix, options: data, trigger: "click", visible: visible, value: value, setVisible: setVisible, searchText: !tempItem && searchText ? searchText : null, locale: locale, searchTarget: searchTarget, setSearchTarget: setSearchTarget },
-                        react_1.default.createElement(input_1.default
-                        // onKeyDown={keyDown}
-                        , { 
-                            // onKeyDown={keyDown}
-                            ref: inputRef, value: searchText, className: "inputClass", onPressEnter: onPressEnter, onChange: (e) => onInputChange(e.target.value), placeholder: !(value === null || value === void 0 ? void 0 : value.length) ? placeholder || locale.placeholder : undefined, disabled: disabled })))),
-            react_1.default.createElement("div", { className: `${prefix}-prefix` },
-                react_1.default.createElement(icon_1.default, { type: "filter" })),
-            react_1.default.createElement("div", { className: `${prefix}-clear` },
-                react_1.default.createElement(icon_1.default, { onClick: onClear, type: "close-circle", theme: "filled" }))));
-    }));
+      }, item === null || item === void 0 ? void 0 : item.label));
+    }), _react["default"].createElement("li", {
+      className: "".concat(prefix, "-items-input")
+    }, _react["default"].createElement(_FieldPopover["default"], {
+      onChange: handleFieldChange,
+      clsPrefix: clsPrefix,
+      options: data,
+      trigger: "click",
+      visible: visible,
+      value: value,
+      setVisible: setVisible,
+      searchText: !tempItem && searchText ? searchText : null,
+      locale: locale,
+      searchTarget: searchTarget,
+      setSearchTarget: setSearchTarget
+    }, _react["default"].createElement(_input["default"]
+    // onKeyDown={keyDown}
+    , {
+      // onKeyDown={keyDown}
+      ref: inputRef,
+      value: searchText,
+      className: "inputClass",
+      onPressEnter: onPressEnter,
+      onChange: function onChange(e) {
+        return onInputChange(e.target.value);
+      },
+      placeholder: !(value === null || value === void 0 ? void 0 : value.length) ? placeholder || locale.placeholder : undefined,
+      disabled: disabled
+    })))), _react["default"].createElement("div", {
+      className: "".concat(prefix, "-prefix")
+    }, _react["default"].createElement(_icon["default"], {
+      type: "filter"
+    })), _react["default"].createElement("div", {
+      className: "".concat(prefix, "-clear")
+    }, _react["default"].createElement(_icon["default"], {
+      onClick: onClear,
+      type: "close-circle",
+      theme: "filled"
+    })));
+  });
 };
-exports.default = (0, react_1.forwardRef)(CompositionInput);
-//# sourceMappingURL=index.js.map
+var _default = exports["default"] = (0, _react.forwardRef)(CompositionInput);