@para-ui/core 4.0.0-rc.3 → 4.0.0-rc.5

package/TextField/index.js

@@ -1,5 +1,3 @@
-import { _ as _typeof } from '../_verture/typeof-adeedc13.js';
-import { _ as _slicedToArray } from '../_verture/slicedToArray-a8206399.js';
 import { _ as __rest } from '../_verture/tslib.es6-55ed4bd2.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { useState, useRef, useEffect, useMemo } from 'react';
@@ -12,11 +10,10 @@ import AutoTips from '../AutoTips/index.js';
 import { Loading } from '../Loading/index.js';
 import { Tooltip } from '../Tooltip/index.js';
 import HelperText from '../HelperText/index.js';
-import { u as useGlobalProps } from '../_verture/useGlobalProps-1b846a65.js';
-import { D as Dropdown } from '../_verture/index-e9007d6a.js';
-import { $ as $prefixCls } from '../_verture/constant-0d9802f7.js';
+import { u as useGlobalProps } from '../_verture/useGlobalProps-1e416658.js';
+import { D as Dropdown } from '../_verture/index-da9097d3.js';
+import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
-import '../_verture/unsupportedIterableToArray-cb478f24.js';
 import '../Help/index.js';
 import '@para-ui/icons/Help';
 import 'clsx';
@@ -26,152 +23,114 @@ import '@para-ui/icons/Forbid';
 import '@para-ui/icons/LoadingF';
 import '@para-ui/core/GlobalContext';
 import 'rc-dropdown';
-import '../_verture/usePopupContainer-87febeb9.js';
+import '../_verture/usePopupContainer-635f66f4.js';
 import 'dayjs';
 
 var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-text-field {\n  font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n  font-size: 14px;\n  font-weight: 400;\n  display: inline-block;\n  width: 100%;\n}\n.paraui-v4-text-field > .text-field-content {\n  border: 1px solid;\n  border-radius: 4px;\n  border-color: rgb(212, 218, 227);\n  display: flex;\n  width: 100%;\n  position: relative;\n  background-color: rgb(255, 255, 255);\n}\n.paraui-v4-text-field > .text-field-content:hover {\n  border-color: rgb(87, 131, 235);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-before {\n  color: rgb(92, 101, 115);\n  padding: 0 10px;\n  border-bottom-left-radius: 4px;\n  border-top-left-radius: 4px;\n  white-space: nowrap;\n  display: flex;\n  align-items: center;\n  position: relative;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-before:after {\n  position: absolute;\n  content: \"\";\n  right: 0;\n  width: 1px;\n  background-color: rgb(212, 218, 227);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-before svg {\n  font-size: 18px;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within {\n  position: relative;\n  display: flex;\n  flex-grow: 1;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within:hover > .clean-up-icon {\n  display: flex;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .clean-up-icon {\n  height: 100%;\n  align-items: center;\n  margin-right: 10px;\n  cursor: pointer;\n  display: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .clean-up-icon svg {\n  color: rgb(161, 168, 179);\n  font-size: 16px;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .clean-up-icon:hover svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .right-icon {\n  display: flex;\n  height: 100%;\n  align-items: center;\n  margin-right: 10px;\n  cursor: pointer;\n  color: rgb(29, 33, 38);\n  position: relative;\n  z-index: 1;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .right-icon.right-icon-password:hover svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .right-icon svg {\n  color: rgb(92, 101, 115);\n  font-size: 18px;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .length-limit {\n  display: flex;\n  height: 100%;\n  align-items: center;\n  margin-right: 10px;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n  width: 100%;\n  line-height: 0;\n  position: relative;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input input::-webkit-outer-spin-button,\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input input::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input input[type=number] {\n  -moz-appearance: textfield;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n  width: 100%;\n  height: 100%;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n  width: 100% !important;\n  padding: 10px;\n  resize: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n  font-size: 14px;\n  color: rgb(29, 33, 38);\n  border: 0;\n  border-radius: 4px;\n  background: transparent;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input::-ms-clear, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea::-ms-clear {\n  display: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input::-ms-reveal, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea::-ms-reveal {\n  display: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input:disabled, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea:disabled {\n  background-color: transparent;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n  width: 100%;\n  position: absolute;\n  left: 0;\n  top: 0;\n  height: 100%;\n  padding: 0 10px;\n  color: rgb(161, 168, 179);\n  cursor: text;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  text-align: left;\n  pointer-events: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder > .text-field-required {\n  margin-left: 2px;\n  color: rgb(244, 66, 66);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-after {\n  color: rgb(92, 101, 115);\n  padding: 0 10px;\n  border-bottom-right-radius: 4px;\n  border-top-right-radius: 4px;\n  white-space: nowrap;\n  display: flex;\n  align-items: center;\n  position: relative;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-after:after {\n  position: absolute;\n  content: \"\";\n  left: 0;\n  width: 1px;\n  background-color: rgb(212, 218, 227);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-after svg {\n  font-size: 18px;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-text-field.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .clean-up-icon {\n  display: none;\n}\n.paraui-v4-text-field.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .length-limit {\n  position: absolute;\n  height: 22px;\n  bottom: 0;\n  border-radius: 4px;\n  width: calc(100% - 10px);\n  background: white;\n  justify-content: flex-end;\n  padding-bottom: 2px;\n  margin-right: 0;\n  left: 0;\n}\n.paraui-v4-text-field.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n  padding-top: 10px;\n  line-height: 1;\n  height: calc(100% - 24px);\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content:hover {\n  border-color: rgb(212, 218, 227);\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-before {\n  background-color: transparent;\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n  cursor: not-allowed;\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-within > .text-field-content-within-input > input, .paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n  cursor: not-allowed;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-after {\n  background-color: transparent;\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .length-limit {\n  background-color: transparent;\n}\n.paraui-v4-text-field.paraui-v4-text-field-error > .text-field-content {\n  border-color: rgb(244, 66, 66) !important;\n}\n.paraui-v4-text-field.paraui-v4-text-field-error > .text-field-content:hover {\n  border-color: rgb(244, 66, 66);\n}\n.paraui-v4-text-field.paraui-v4-text-field-limit > .text-field-content {\n  border-color: rgb(244, 66, 66) !important;\n}\n.paraui-v4-text-field.paraui-v4-text-field-limit > .text-field-content:hover {\n  border-color: rgb(244, 66, 66) !important;\n}\n.paraui-v4-text-field.paraui-v4-text-field-limit-length > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n  padding-bottom: 25px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-focus > .text-field-content {\n  border-color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content {\n  height: 28px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-before {\n  line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-before:after {\n  top: 5px;\n  height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n  height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n  padding: 6px 10px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n  line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content .text-field-content-after {\n  line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content .text-field-content-after:after {\n  top: 5px;\n  height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content {\n  height: 28px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-before {\n  line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-before:after {\n  top: 5px;\n  height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n  height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n  padding: 6px 10px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n  line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content .text-field-content-after {\n  line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content .text-field-content-after:after {\n  top: 5px;\n  height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content {\n  height: 32px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-before {\n  line-height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-before:after {\n  top: 7px;\n  height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n  height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n  padding: 6px 10px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n  line-height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content .text-field-content-after {\n  line-height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content .text-field-content-after:after {\n  top: 7px;\n  height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-resize > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n  resize: both;\n}\n\n.paraui-v4-text-field-select.component-dropdown {\n  /*// 小\n  &.paraui-v4-text-field-select-small {\n    & > .text-field-select-content {\n      & > .text-field-select-content-item {\n        line-height: 28px;\n      }\n    }\n  }\n\n  // 中\n  &.paraui-v4-text-field-select-medium {\n    & > .text-field-select-content {\n      & > .text-field-select-content-item {\n        line-height: 32px;\n      }\n    }\n  }\n\n  // 大\n  &.paraui-v4-text-field-select-large {\n    & > .text-field-select-content {\n      & > .text-field-select-content-item {\n        line-height: 36px;\n      }\n    }\n  }*/\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content {\n  max-height: 320px;\n  overflow: auto;\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content > .text-field-select-content-item {\n  display: flex;\n  cursor: pointer;\n  color: rgb(29, 33, 38);\n  padding: 0 10px;\n  line-height: 30px;\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content > .text-field-select-content-item:hover {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content > .text-field-select-content-item.text-field-select-content-item-keydown {\n  background-color: rgb(247, 248, 250);\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content.text-field-select-content-loading {\n  height: 100px;\n  position: relative;\n  overflow: hidden;\n}\n.paraui-v4-text-field-select.paraui-v4-text-field-select-data.component-tooltip {\n  padding: 8px 0;\n}";
 styleInject(css_248z);
 
 // true:数值型的，false：非数值型
-var IsNaN = function IsNaN(value) {
+const IsNaN = value => {
   return typeof value === 'number' && !isNaN(value);
 };
-var TextField = function TextField(props) {
-  var _a = useGlobalProps(props, 'TextField'),
-    className = _a.className,
-    style = _a.style,
-    _a$size = _a.size,
-    size = _a$size === void 0 ? 'large' : _a$size,
-    _a$labelMode = _a.labelMode,
-    labelMode = _a$labelMode === void 0 ? 'outside' : _a$labelMode,
-    _a$placeholder = _a.placeholder,
-    placeholder = _a$placeholder === void 0 ? '' : _a$placeholder,
-    _a$label = _a.label,
-    label = _a$label === void 0 ? '' : _a$label,
-    labelTooltip = _a.labelTooltip,
-    _a$disabled = _a.disabled,
-    disabled = _a$disabled === void 0 ? false : _a$disabled,
-    disabledTooltip = _a.disabledTooltip,
-    _a$multiline = _a.multiline,
-    multiline = _a$multiline === void 0 ? false : _a$multiline,
-    _a$required = _a.required,
-    required = _a$required === void 0 ? false : _a$required,
-    labelSign = _a.labelSign,
-    _a$rows = _a.rows,
-    rows = _a$rows === void 0 ? 4 : _a$rows,
-    _a$error = _a.error,
-    error = _a$error === void 0 ? false : _a$error,
-    hideErrorDom = _a.hideErrorDom,
-    _a$helperText = _a.helperText,
-    helperText = _a$helperText === void 0 ? '' : _a$helperText,
-    _a$addonBefore = _a.addonBefore,
-    addonBefore = _a$addonBefore === void 0 ? '' : _a$addonBefore,
-    _a$addonAfter = _a.addonAfter,
-    addonAfter = _a$addonAfter === void 0 ? '' : _a$addonAfter;
-    _a.defaultValue;
-    var value = _a.value,
-    _a$type = _a.type,
-    type = _a$type === void 0 ? 'text' : _a$type,
-    onClickIcon = _a.onClickIcon,
-    rightIcon = _a.rightIcon,
-    _a$showRightIcon = _a.showRightIcon,
-    showRightIcon = _a$showRightIcon === void 0 ? true : _a$showRightIcon,
-    _a$allowClear = _a.allowClear,
-    allowClear = _a$allowClear === void 0 ? false : _a$allowClear,
-    limitLength = _a.limitLength,
-    fetchSuggestions = _a.fetchSuggestions,
-    selectPopoverClass = _a.selectPopoverClass,
-    renderSelectItem = _a.renderSelectItem,
-    _a$showSelectName = _a.showSelectName,
-    showSelectName = _a$showSelectName === void 0 ? 'value' : _a$showSelectName,
-    _a$resize = _a.resize,
-    resize = _a$resize === void 0 ? true : _a$resize,
-    searchEmpty = _a.searchEmpty,
-    onBlur = _a.onBlur,
-    onFocus = _a.onFocus,
-    onChange = _a.onChange,
-    onKeydown = _a.onKeydown,
-    onKeyUp = _a.onKeyUp,
-    onEnter = _a.onEnter,
-    onClickAddonBefore = _a.onClickAddonBefore,
-    onClickAddonAfter = _a.onClickAddonAfter,
-    onSelect = _a.onSelect,
-    onClear = _a.onClear,
+const TextField = props => {
+  const _a = useGlobalProps(props, 'TextField'),
+    {
+      className,
+      style,
+      size = 'large',
+      labelMode = 'outside',
+      placeholder = '',
+      label = '',
+      labelTooltip,
+      disabled = false,
+      disabledTooltip,
+      multiline = false,
+      required = false,
+      labelSign,
+      rows = 4,
+      error = false,
+      hideErrorDom,
+      helperText = '',
+      addonBefore = '',
+      addonAfter = '',
+      defaultValue,
+      value,
+      type = 'text',
+      onClickIcon,
+      rightIcon,
+      showRightIcon = true,
+      allowClear = false,
+      limitLength,
+      fetchSuggestions,
+      selectPopoverClass,
+      renderSelectItem,
+      showSelectName = 'value',
+      resize = true,
+      searchEmpty,
+      onBlur,
+      onFocus,
+      onChange,
+      onKeydown,
+      onKeyUp,
+      onEnter,
+      onClickAddonBefore,
+      onClickAddonAfter,
+      onSelect,
+      onClear
+    } = _a,
     otherProps = __rest(_a, ["className", "style", "size", "labelMode", "placeholder", "label", "labelTooltip", "disabled", "disabledTooltip", "multiline", "required", "labelSign", "rows", "error", "hideErrorDom", "helperText", "addonBefore", "addonAfter", "defaultValue", "value", "type", "onClickIcon", "rightIcon", "showRightIcon", "allowClear", "limitLength", "fetchSuggestions", "selectPopoverClass", "renderSelectItem", "showSelectName", "resize", "searchEmpty", "onBlur", "onFocus", "onChange", "onKeydown", "onKeyUp", "onEnter", "onClickAddonBefore", "onClickAddonAfter", "onSelect", "onClear"]);
-  var _useState = useState("text-field-select-content-".concat(UUID())),
-    _useState2 = _slicedToArray(_useState, 1),
-    classSearchOne = _useState2[0]; // 唯一class
-  var _useState3 = useState(true),
-    _useState4 = _slicedToArray(_useState3, 2),
-    showText = _useState4[0],
-    setShowText = _useState4[1]; // 是否显示输入框lable,placeholder true显示
-  var _useState5 = useState(''),
-    _useState6 = _slicedToArray(_useState5, 2),
-    valueCom = _useState6[0],
-    setValueCom = _useState6[1]; // 组件值
-  var _useState7 = useState(false),
-    _useState8 = _slicedToArray(_useState7, 2),
-    isFocus = _useState8[0],
-    setIsFocus = _useState8[1]; // 是否得到焦点
-  var _useState9 = useState('text'),
-    _useState10 = _slicedToArray(_useState9, 2),
-    typeCom = _useState10[0],
-    setTypeCom = _useState10[1];
-  var _useState11 = useState(false),
-    _useState12 = _slicedToArray(_useState11, 2),
-    open = _useState12[0],
-    setOpen = _useState12[1]; // 是否打开下拉框
-  var _useState13 = useState(false),
-    _useState14 = _slicedToArray(_useState13, 2),
-    selectLoading = _useState14[0],
-    setSelectLoading = _useState14[1]; // 下拉loading
-  var _useState15 = useState([]),
-    _useState16 = _slicedToArray(_useState15, 2),
-    selectData = _useState16[0],
-    setSelectData = _useState16[1];
+  const [classSearchOne] = useState("text-field-select-content-".concat(UUID())); // 唯一class
+  const [showText, setShowText] = useState(true); // 是否显示输入框lable,placeholder true显示
+  const [valueCom, setValueCom] = useState(''); // 组件值
+  const [isFocus, setIsFocus] = useState(false); // 是否得到焦点
+  const [typeCom, setTypeCom] = useState('text');
+  const [open, setOpen] = useState(false); // 是否打开下拉框
+  const [selectLoading, setSelectLoading] = useState(false); // 下拉loading
+  const [selectData, setSelectData] = useState([]);
   //const [constData] = useState<ConstDataProps>({});
-  var inputDom = useRef(null);
-  var selectPosDom = useRef(null); // 下拉框定位元素
-  useEffect(function () {
+  const inputDom = useRef(null);
+  const selectPosDom = useRef(null); // 下拉框定位元素
+  useEffect(() => {
     if (props.defaultValue !== undefined) {
       setValueCom(props.defaultValue === null ? '' : props.defaultValue);
     }
   }, []);
   // 组件类型
-  useEffect(function () {
+  useEffect(() => {
     if (type !== typeCom) setTypeCom(type);
   }, [type]);
   // 监听value
-  useEffect(function () {
+  useEffect(() => {
     if (value !== undefined) {
       setValueCom(value === null ? '' : value);
     }
   }, [value]);
   // 监听组件值,判断是否显示placehold,label
-  useEffect(function () {
+  useEffect(() => {
     if (valueCom !== '' && valueCom !== undefined) setShowText(false);else setShowText(true);
   }, [valueCom]);
   // 判断是否显示下拉
-  useEffect(function () {
+  useEffect(() => {
     if (!fetchSuggestions) return;
     setOpen(isFocus);
   }, [isFocus, fetchSuggestions]);
-  useEffect(function () {
+  useEffect(() => {
     if (open) {
       window.addEventListener('keydown', keydownCom);
     } else {
       window.removeEventListener('keydown', keydownCom);
     }
-    return function () {
+    return () => {
       window.removeEventListener('keydown', keydownCom);
     };
   }, [open]);
-  useEffect(function () {
+  useEffect(() => {
     // 失去焦点
     if (!isFocus && valueCom) {
-      var val = handValueLimit(valueCom);
+      const val = handValueLimit(valueCom);
       if (val !== valueCom) {
-        var e = {};
+        const e = {};
         e.target = inputDom.current;
         e.target.value = val;
         if (props.value === undefined) {
@@ -185,8 +144,8 @@ var TextField = function TextField(props) {
    * 处理value值
    * 超出字符长度限制,截取符合长度内容,并且触发onchange事件
    * */
-  var handValueLimit = function handValueLimit(val) {
-    var valHand = val;
+  const handValueLimit = val => {
+    let valHand = val;
     if (IsNaN(props.limitLength) && val.toString().length > Number(props.limitLength)) {
       valHand = valHand.toString().substr(0, props.limitLength);
     }
@@ -209,13 +168,15 @@ var TextField = function TextField(props) {
    *     currentDom: 当前元素
    * }
    */
-  var handKeydown = function handKeydown(config) {
-    var selectDom = config.selectDom,
-      keyCode = config.keyCode,
-      currentDom = config.currentDom;
-    var brotherDom = currentDom;
-    var type = 'nextSibling';
-    var classSelectStr = '.text-field-select-content-item';
+  const handKeydown = config => {
+    const {
+      selectDom,
+      keyCode,
+      currentDom
+    } = config;
+    let brotherDom = currentDom;
+    let type = 'nextSibling';
+    let classSelectStr = '.text-field-select-content-item';
     if (keyCode === 38) {
       // 上
       type = 'previousSibling';
@@ -240,10 +201,10 @@ var TextField = function TextField(props) {
    * @param currentDom 当前元素
    * @param selectDom 外容器
    */
-  var domClientTop = function domClientTop(currentDom, selectDom) {
-    var clientHeight = selectDom.clientHeight; // 可见区域的高度
-    var top = currentDom.offsetTop + currentDom.clientHeight;
-    var difference = top - clientHeight;
+  const domClientTop = (currentDom, selectDom) => {
+    const clientHeight = selectDom.clientHeight; // 可见区域的高度
+    const top = currentDom.offsetTop + currentDom.clientHeight;
+    const difference = top - clientHeight;
     if (difference > 0) {
       selectDom.scrollTop = difference;
     } else {
@@ -254,16 +215,16 @@ var TextField = function TextField(props) {
    * 键盘事件
    * @param e 键盘信息
    */
-  var keydownCom = function keydownCom(e) {
-    var selectDom = document.querySelector(".".concat(classSearchOne));
-    var currentDom = null;
-    var keydownDom = selectDom.querySelector('.text-field-select-content-item-keydown');
+  const keydownCom = e => {
+    const selectDom = document.querySelector(".".concat(classSearchOne));
+    let currentDom = null;
+    const keydownDom = selectDom.querySelector('.text-field-select-content-item-keydown');
     // 回车
     if (e.keyCode === 13) {
       if (keydownDom) {
-        var val = keydownDom.dataset.val;
+        const val = keydownDom.dataset.val;
         clickSelectItem(JSON.parse(val))(e);
-        var dom = inputDom && inputDom.current;
+        const dom = inputDom && inputDom.current;
         dom.blur();
       }
     }
@@ -274,17 +235,17 @@ var TextField = function TextField(props) {
     // 下
     if (e.keyCode === 40) {
       handKeydown({
-        selectDom: selectDom,
+        selectDom,
         keyCode: e.keyCode,
-        currentDom: currentDom
+        currentDom
       });
     }
     // 上
     if (e.keyCode === 38) {
       handKeydown({
-        selectDom: selectDom,
+        selectDom,
         keyCode: e.keyCode,
-        currentDom: currentDom
+        currentDom
       });
     }
   };
@@ -292,7 +253,7 @@ var TextField = function TextField(props) {
    * 失去焦点
    * @param event 失去焦点元素对象
    */
-  var onBlurCom = function onBlurCom(event) {
+  const onBlurCom = event => {
     setIsFocus(false);
     if (event.target.value === '') setShowText(true);
     onBlur && onBlur(event);
@@ -301,10 +262,10 @@ var TextField = function TextField(props) {
    * 下拉搜索
    * @param val 搜索值
    */
-  var fetchSuggestionsCom = function fetchSuggestionsCom(val) {
+  const fetchSuggestionsCom = val => {
     if (fetchSuggestions) {
       setSelectLoading(true);
-      fetchSuggestions(val, function (data) {
+      fetchSuggestions(val, data => {
         setSelectData(data || []);
         setSelectLoading(false);
       });
@@ -314,7 +275,7 @@ var TextField = function TextField(props) {
    * 得到焦点
    * @param event 得到焦点元素
    */
-  var onFocusCom = function onFocusCom(event) {
+  const onFocusCom = event => {
     setIsFocus(true);
     onFocus && onFocus(event);
     fetchSuggestionsCom(event.target.value);
@@ -323,8 +284,8 @@ var TextField = function TextField(props) {
    * 改变输入框
    * @param event 输入框元素
    */
-  var onChangeCom = function onChangeCom(event) {
-    var val = event.target.value;
+  const onChangeCom = event => {
+    const val = event.target.value;
     if (val) setShowText(false); // 有值不显示placehold,防止浏览器默认填充
     /*if (limitLength && val !== undefined && val !== '' && val.toString().length > limitLength) {
         return;
@@ -339,7 +300,7 @@ var TextField = function TextField(props) {
    * 键盘按下事件
    * @param event 输入框元素
    */
-  var onKeyDownCom = function onKeyDownCom(event) {
+  const onKeyDownCom = event => {
     if (event.keyCode === 13) onEnter && onEnter(event);
     onKeydown && onKeydown(event);
   };
@@ -347,14 +308,14 @@ var TextField = function TextField(props) {
    * 键盘抬起事件
    * @param event 输入框元素
    */
-  var onKeyUpCom = function onKeyUpCom(event) {
+  const onKeyUpCom = event => {
     onKeyUp && onKeyUp(event);
   };
   /**
    * 点击图标
    * @param event 图标元素
    */
-  var onClickRightIcon = function onClickRightIcon(event) {
+  const onClickRightIcon = event => {
     if (type === 'password') {
       if (typeCom === 'text') {
         setTypeCom('password');
@@ -365,26 +326,24 @@ var TextField = function TextField(props) {
     }
     onClickIcon && onClickIcon(event);
   };
-  var handValue = function handValue() {
+  const handValue = () => {
     if (props.value === undefined) return valueCom;
     return value;
   };
   // 处理下拉框样式
-  var handleClassPopover = function handleClassPopover() {
-    var str = "".concat($prefixCls, "-text-field-select ").concat($prefixCls, "-scrollbar-small");
+  const handleClassPopover = () => {
+    let str = "".concat($prefixCls, "-text-field-select ").concat($prefixCls, "-scrollbar-small");
     if (size) str += " ".concat($prefixCls, "-text-field-select-").concat(size);
     if (selectPopoverClass) str += " ".concat(selectPopoverClass);
     if (selectData.length > 0) str += " ".concat($prefixCls, "-text-field-select-data");
     return str;
   };
   // 点击下拉
-  var clickSelectItem = function clickSelectItem(item) {
-    return function (e) {
-      onSelect && onSelect(item);
-    };
+  const clickSelectItem = item => e => {
+    onSelect && onSelect(item);
   };
   // 限制长度
-  var limitMemo = useMemo(function () {
+  const limitMemo = useMemo(() => {
     return jsx(Fragment, {
       children: IsNaN(limitLength) && jsx("span", Object.assign({
         className: "length-limit"
@@ -394,13 +353,13 @@ var TextField = function TextField(props) {
     });
   }, [limitLength, valueCom]);
   // 图标
-  var rightIconMemo = useMemo(function () {
-    var rightIconFunc = function rightIconFunc() {
+  const rightIconMemo = useMemo(() => {
+    const rightIconFunc = () => {
       return rightIcon ? rightIcon :
       // 只有密码模式有默认图标
       type === 'password' ? typeCom === 'password' ? jsx(VisibilityOff, {}) : jsx(Visibility, {}) : null;
     };
-    var rightIconContent = rightIconFunc();
+    const rightIconContent = rightIconFunc();
     return jsx(Fragment, {
       children: showRightIcon && rightIconContent && jsx("span", Object.assign({
         className: type === 'password' ? 'right-icon right-icon-password' : 'right-icon',
@@ -411,7 +370,7 @@ var TextField = function TextField(props) {
     });
   }, [showRightIcon, rightIcon, type, typeCom, onClickIcon]);
   // 输入框
-  var renderInputDom = function renderInputDom() {
+  const renderInputDom = () => {
     if (multiline) {
       return jsx("textarea", Object.assign({
         ref: inputDom,
@@ -438,21 +397,21 @@ var TextField = function TextField(props) {
     }, otherProps));
   };
   // 点击清楚按钮
-  var clickClean = function clickClean() {
-    var target = inputDom.current;
+  const clickClean = () => {
+    const target = inputDom.current;
     target.value = '';
     if (props.value === undefined) {
       setValueCom('');
     }
     onChange && onChange({
-      target: target
+      target
     });
     fetchSuggestionsCom('');
     onClear && onClear();
   };
   // 清空内容
-  var clearRender = function clearRender() {
-    var valCom = handValue();
+  const clearRender = () => {
+    const valCom = handValue();
     if ((valCom || valCom === 0) && !disabled && allowClear) {
       return jsx("span", Object.assign({
         className: "clean-up-icon",
@@ -463,8 +422,8 @@ var TextField = function TextField(props) {
     }
   };
   // 中间主体
-  var contentMemo = useMemo(function () {
-    var handPlaceholderCon = function handPlaceholderCon() {
+  const contentMemo = useMemo(() => {
+    const handPlaceholderCon = () => {
       if (labelMode === 'outside') return placeholder;
       return jsxs(Fragment, {
         children: [label || placeholder, required && jsx("span", Object.assign({
@@ -476,8 +435,8 @@ var TextField = function TextField(props) {
         })]
       });
     };
-    var valCom = handValue();
-    var contentRender = function contentRender() {
+    const valCom = handValue();
+    const contentRender = () => {
       return jsxs("div", Object.assign({
         className: "text-field-content-within",
         ref: selectPosDom
@@ -496,15 +455,15 @@ var TextField = function TextField(props) {
     return contentRender();
   }, [showText, isFocus, typeCom, valueCom, limitMemo, rightIconMemo, labelMode, placeholder, label, disabled, multiline, rows, otherProps, onChange, fetchSuggestions, onClickIcon, allowClear, onClear]);
   // 搜索下拉内容
-  var selectContentMemo = useMemo(function () {
-    var handSelectContentClass = function handSelectContentClass() {
-      var str = 'text-field-select-content';
+  const selectContentMemo = useMemo(() => {
+    const handSelectContentClass = () => {
+      let str = 'text-field-select-content';
       if (selectLoading) str += ' text-field-select-content-loading';
       if (classSearchOne) str += " ".concat(classSearchOne);
       return str;
     };
-    var handText = function handText(item) {
-      if (_typeof(item) === 'object' && item !== null) {
+    const handText = item => {
+      if (typeof item === 'object' && item !== null) {
         return item[showSelectName];
       }
       return item;
@@ -515,7 +474,7 @@ var TextField = function TextField(props) {
         width: "".concat(selectPosDom && selectPosDom.current ? selectPosDom.current.offsetWidth : 0, "px")
       }
     }, {
-      children: [selectData && selectData.map(function (item, index) {
+      children: [selectData && selectData.map((item, index) => {
         return jsx("div", Object.assign({
           className: "text-field-select-content-item",
           onMouseDown: clickSelectItem(item),
@@ -529,7 +488,7 @@ var TextField = function TextField(props) {
     }));
   }, [selectPosDom, open, selectData, renderSelectItem, showSelectName, onSelect, selectLoading, classSearchOne, searchEmpty]);
   // 带有搜索的中间主体
-  var searchContentMemo = useMemo(function () {
+  const searchContentMemo = useMemo(() => {
     return jsx(Dropdown, Object.assign({
       visible: open,
       placement: 'bottomLeft',
@@ -543,11 +502,11 @@ var TextField = function TextField(props) {
     }));
   }, [showText, isFocus, typeCom, valueCom, limitMemo, rightIconMemo, labelMode, placeholder, label, disabled, multiline, rows, otherProps, onChange, fetchSuggestions, onSelect, selectPosDom, open, selectPopoverClass, size, onClickIcon, selectData, allowClear, onClear]);
   // 外标题
-  var outSideMemo = useMemo(function () {
-    var showTag = Boolean(required || labelSign || label);
+  const outSideMemo = useMemo(() => {
+    const showTag = Boolean(required || labelSign || label);
     if (labelMode === 'outside' && showTag) {
-      var handLabelClass = function handLabelClass() {
-        var str = 'text-field-label';
+      const handLabelClass = () => {
+        let str = 'text-field-label';
         if (labelTooltip && labelTooltip.className) {
           str += " ".concat(labelTooltip.className);
         }
@@ -564,8 +523,8 @@ var TextField = function TextField(props) {
     return null;
   }, [labelMode, label, labelSign, required, labelTooltip]);
   // 处理class
-  var handClass = function handClass() {
-    var str = "".concat($prefixCls, "-text-field");
+  const handClass = () => {
+    let str = "".concat($prefixCls, "-text-field");
     if (className) str += " ".concat(className);
     if (size && !multiline) str += " ".concat($prefixCls, "-text-field-").concat(size);
     if (error) str += " ".concat($prefixCls, "-text-field-error");
@@ -575,20 +534,20 @@ var TextField = function TextField(props) {
     if (IsNaN(props.limitLength)) str += " ".concat($prefixCls, "-text-field-limit-length");
     if (IsNaN(props.limitLength) && valueCom && valueCom.toString().length > Number(props.limitLength)) str += " ".concat($prefixCls, "-text-field-limit");
     if (resize) str += " ".concat($prefixCls, "-text-field-resize");
-    var valCom = handValue();
+    const valCom = handValue();
     if (valCom || valCom === 0) str += " ".concat($prefixCls, "-text-field-value");
     if (allowClear) str += " ".concat($prefixCls, "-text-field-allow-clear");
     return str;
   };
   // 点击前缀
-  var clickBefore = function clickBefore(event) {
+  const clickBefore = event => {
     onClickAddonBefore && onClickAddonBefore(event);
   };
   // 点击后缀
-  var clickAfter = function clickAfter(event) {
+  const clickAfter = event => {
     onClickAddonAfter && onClickAddonAfter(event);
   };
-  var contentRender = function contentRender() {
+  const contentRender = () => {
     return jsxs("div", Object.assign({
       className: "text-field-content"
     }, {
@@ -605,7 +564,7 @@ var TextField = function TextField(props) {
       }))]
     }));
   };
-  var handleContentRender = function handleContentRender() {
+  const handleContentRender = () => {
     if (disabledTooltip) {
       return jsx(Tooltip, Object.assign({
         disabled: true