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

package/Radio/index.js

@@ -1,11 +1,9 @@
-import { _ as _slicedToArray } from '../_verture/slicedToArray-a8206399.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
 import Label from '../Label/index.js';
-import { $ as $prefixCls } from '../_verture/constant-0d9802f7.js';
+import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
 import { Tooltip } from '../Tooltip/index.js';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
-import '../_verture/unsupportedIterableToArray-cb478f24.js';
 import '../_verture/tslib.es6-55ed4bd2.js';
 import '../Help/index.js';
 import '@para-ui/icons/Help';
@@ -17,32 +15,27 @@ import '@para-ui/icons/Forbid';
 var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-radio {\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  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  line-height: 16px;\n}\n.paraui-v4-radio:hover {\n  /*& > .radio-label {\n    color: $NP1;\n    cursor: pointer;\n\n    svg {\n      color: $NP1;\n    }\n  }*/\n  /*& > .radio-help {\n    & > .radio-label {\n      color: $NP1;\n      cursor: pointer;\n\n      svg {\n        color: $NP1;\n      }\n    }\n  }*/\n}\n.paraui-v4-radio:hover > .radio-box > .radio-box-inner {\n  border-color: rgb(46, 101, 230);\n}\n.paraui-v4-radio > .radio-box {\n  position: relative;\n}\n.paraui-v4-radio > .radio-box > input {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 1;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  cursor: pointer;\n}\n.paraui-v4-radio > .radio-box > .radio-box-inner {\n  position: relative;\n  top: 0;\n  left: 0;\n  display: block;\n  background-color: white;\n  border: 1px solid rgb(212, 218, 227);\n  border-radius: 50%;\n}\n.paraui-v4-radio > .radio-box > .radio-box-inner:after {\n  position: absolute;\n  display: table;\n  content: \" \";\n  transform: scale(1) translate(-50%, -50%);\n  background-color: white;\n  border-radius: 50%;\n  left: 50%;\n  top: 50%;\n}\n.paraui-v4-radio > .radio-label {\n  color: rgb(29, 33, 38);\n  padding: 0 8px;\n  margin: 0;\n  display: inline-flex;\n  align-items: flex-start;\n  overflow: hidden;\n  cursor: pointer;\n}\n.paraui-v4-radio > .radio-label > .radio-help > svg {\n  top: 0;\n}\n.paraui-v4-radio .radio-label {\n  line-height: 16px;\n}\n.paraui-v4-radio > .radio-help {\n  padding: 0 8px;\n  position: relative;\n  top: -1px;\n  overflow: hidden;\n}\n.paraui-v4-radio > .radio-help > .radio-label {\n  width: 100%;\n  color: rgb(29, 33, 38);\n  margin: 0;\n  display: inline-flex;\n  align-items: center;\n  overflow: hidden;\n  cursor: pointer;\n}\n.paraui-v4-radio.paraui-v4-radio-checked > .radio-box > .radio-box-inner {\n  border-color: transparent;\n  background-color: rgb(46, 101, 230);\n}\n.paraui-v4-radio.paraui-v4-radio-checked:hover > .radio-box > .radio-box-inner {\n  border-color: transparent;\n  background-color: rgb(87, 131, 235);\n}\n.paraui-v4-radio.paraui-v4-radio-disabled {\n  cursor: not-allowed;\n}\n.paraui-v4-radio.paraui-v4-radio-disabled:hover > .radio-box > .radio-box-inner {\n  background-color: rgb(234, 236, 241);\n  border-color: rgb(212, 218, 227);\n}\n.paraui-v4-radio.paraui-v4-radio-disabled > .radio-label {\n  color: rgb(161, 168, 179);\n  cursor: not-allowed;\n}\n.paraui-v4-radio.paraui-v4-radio-disabled > .radio-label svg {\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-radio.paraui-v4-radio-disabled > .radio-box > input {\n  cursor: not-allowed;\n}\n.paraui-v4-radio.paraui-v4-radio-disabled > .radio-box > .radio-box-inner {\n  background-color: rgb(234, 236, 241);\n  border-color: rgb(212, 218, 227);\n}\n.paraui-v4-radio.paraui-v4-radio-disabled > .radio-box > .radio-box-inner:after {\n  background-color: rgb(234, 236, 241);\n}\n.paraui-v4-radio.paraui-v4-radio-disabled.paraui-v4-radio-checked > .radio-box > .radio-box-inner {\n  background-color: rgb(212, 218, 227);\n  border-color: rgb(212, 218, 227);\n}\n.paraui-v4-radio.paraui-v4-radio-disabled.paraui-v4-radio-checked > .radio-box > .radio-box-inner:hover > .radio-box > .radio-box-inner {\n  background-color: rgb(212, 218, 227);\n  border-color: rgb(212, 218, 227);\n}\n.paraui-v4-radio.paraui-v4-radio-disabled.paraui-v4-radio-checked > .radio-box > .radio-box-inner:after {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-radio.paraui-v4-radio-disabled > .radio-help {\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-radio.paraui-v4-radio-disabled > .radio-help > .radio-label {\n  color: rgb(161, 168, 179);\n  cursor: not-allowed;\n}\n.paraui-v4-radio.paraui-v4-radio-small > .radio-box > .radio-box-inner {\n  width: 14px;\n  height: 14px;\n}\n.paraui-v4-radio.paraui-v4-radio-small > .radio-box > .radio-box-inner:after {\n  width: 4px;\n  height: 4px;\n}\n.paraui-v4-radio.paraui-v4-radio-medium > .radio-box > .radio-box-inner {\n  width: 14px;\n  height: 14px;\n}\n.paraui-v4-radio.paraui-v4-radio-medium > .radio-box > .radio-box-inner:after {\n  width: 4px;\n  height: 4px;\n}\n.paraui-v4-radio.paraui-v4-radio-large > .radio-box > .radio-box-inner {\n  width: 14px;\n  height: 14px;\n}\n.paraui-v4-radio.paraui-v4-radio-large > .radio-box > .radio-box-inner:after {\n  width: 4px;\n  height: 4px;\n}";
 styleInject(css_248z);
 
-var Radio = function Radio(props) {
-  var _props$className = props.className,
-    className = _props$className === void 0 ? '' : _props$className,
-    labelTooltip = props.labelTooltip,
-    _props$label = props.label,
-    label = _props$label === void 0 ? '' : _props$label,
-    _props$size = props.size,
-    size = _props$size === void 0 ? 'large' : _props$size,
-    _props$disabled = props.disabled,
-    disabled = _props$disabled === void 0 ? false : _props$disabled,
-    disabledTooltip = props.disabledTooltip,
-    width = props.width,
-    onChange = props.onChange,
-    style = props.style;
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    checkedCom = _useState2[0],
-    setCheckedCom = _useState2[1]; // 复选框状态
-  useEffect(function () {
+const Radio = props => {
+  const {
+    className = '',
+    labelTooltip,
+    label = '',
+    size = 'large',
+    disabled = false,
+    disabledTooltip,
+    width,
+    onChange,
+    style
+  } = props;
+  const [checkedCom, setCheckedCom] = useState(false); // 复选框状态
+  useEffect(() => {
     if (props.defaultChecked !== undefined) setCheckedCom(props.defaultChecked);
   }, []);
-  useEffect(function () {
+  useEffect(() => {
     if (props.checked !== undefined) setCheckedCom(props.checked);
   }, [props.checked]);
   // 点击选择
-  var clickCheck = function clickCheck(e) {
+  const clickCheck = e => {
     e.preventDefault();
     if (disabled) return;
     // 不可受控组件
@@ -51,36 +44,36 @@ var Radio = function Radio(props) {
     onChange && onChange(e, !checkedCom);
   };
   // 处理className
-  var handClass = function handClass() {
-    var str = "".concat($prefixCls, "-radio");
+  const handClass = () => {
+    let str = "".concat($prefixCls, "-radio");
     if (className) str += " ".concat(className);
     if (size) str += " ".concat($prefixCls, "-radio-").concat(size);
     if (disabled) str += " ".concat($prefixCls, "-radio-disabled");
     if (checkedCom) str += " ".concat($prefixCls, "-radio-checked");
     return str;
   };
-  var handLabelClass = function handLabelClass() {
-    var str = 'radio-label';
+  const handLabelClass = () => {
+    let str = 'radio-label';
     if (labelTooltip && labelTooltip.className) {
       str += " ".concat(labelTooltip.className);
     }
     return str;
   };
   /** 处理帮组classNaem */
-  var handHelpClassName = function handHelpClassName() {
-    var str = ' radio-help';
+  const handHelpClassName = () => {
+    let str = ' radio-help';
     if (labelTooltip && labelTooltip.helpClassName) {
       str += " ".concat(labelTooltip.helpClassName);
     }
     return str;
   };
   /** 处理样式 */
-  var handStyle = function handStyle() {
-    var obj = Object.assign({}, style);
+  const handStyle = () => {
+    const obj = Object.assign({}, style);
     if (width) obj.width = width;
     return obj;
   };
-  var contentRender = function contentRender() {
+  const contentRender = () => {
     return jsxs("label", Object.assign({
       className: handClass(),
       style: handStyle(),
@@ -103,7 +96,7 @@ var Radio = function Radio(props) {
       })) : null]
     }));
   };
-  var handleContentRender = function handleContentRender() {
+  const handleContentRender = () => {
     if (disabledTooltip) {
       return jsx(Tooltip, Object.assign({
         disabled: true

package/RadioGroup/index.js

@@ -1,12 +1,10 @@
-import { _ as _slicedToArray } from '../_verture/slicedToArray-a8206399.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
 import { Radio } from '../Radio/index.js';
 import Label from '../Label/index.js';
 import HelperText from '../HelperText/index.js';
-import { $ as $prefixCls } from '../_verture/constant-0d9802f7.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 '../Tooltip/index.js';
 import '../_verture/tslib.es6-55ed4bd2.js';
 import 'rc-tooltip';
@@ -19,59 +17,47 @@ import '@para-ui/icons/Help';
 var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-radio-group {\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  width: 100%;\n}\n.paraui-v4-radio-group > .radio-group-label {\n  margin-bottom: 6px;\n}\n.paraui-v4-radio-group > .radio-group-content {\n  line-height: 0;\n}\n.paraui-v4-radio-group > .radio-group-content .radio-item-box {\n  margin-bottom: 4px;\n}\n.paraui-v4-radio-group > .radio-group-content > .radio-group-content-item {\n  margin-bottom: 6px;\n}\n.paraui-v4-radio-group > .radio-group-content > .radio-group-content-item:last-child {\n  margin-bottom: 0;\n}\n.paraui-v4-radio-group.paraui-v4-radio-group-column > .radio-group-content {\n  display: flex;\n  flex-direction: column;\n}\n.paraui-v4-radio-group.paraui-v4-radio-group-column > .radio-group-content > span {\n  margin-bottom: 10px;\n}\n.paraui-v4-radio-group.paraui-v4-radio-group-column > .radio-group-content > span:last-child {\n  margin-bottom: 0;\n}";
 styleInject(css_248z);
 
-var RadioGroup = function RadioGroup(props) {
-  var _props$className = props.className,
-    className = _props$className === void 0 ? '' : _props$className,
-    style = props.style,
-    label = props.label,
-    labelTooltip = props.labelTooltip,
-    _props$spacing = props.spacing,
-    spacing = _props$spacing === void 0 ? '32px' : _props$spacing,
-    itemWidth = props.itemWidth,
-    _props$size = props.size,
-    size = _props$size === void 0 ? 'large' : _props$size,
-    _props$row = props.row,
-    row = _props$row === void 0 ? true : _props$row,
-    _props$disabled = props.disabled,
-    disabled = _props$disabled === void 0 ? false : _props$disabled,
-    _props$required = props.required,
-    required = _props$required === void 0 ? false : _props$required,
-    _props$error = props.error,
-    error = _props$error === void 0 ? false : _props$error,
-    hideErrorDom = props.hideErrorDom,
-    _props$helperText = props.helperText,
-    helperText = _props$helperText === void 0 ? '' : _props$helperText,
-    _props$id = props.id,
-    id = _props$id === void 0 ? 'name' : _props$id,
-    value = props.value,
-    list = props.list,
-    onChange = props.onChange;
-  var _useState = useState(),
-    _useState2 = _slicedToArray(_useState, 2),
-    valueCom = _useState2[0],
-    setValueCom = _useState2[1];
-  useEffect(function () {
+const RadioGroup = props => {
+  const {
+    className = '',
+    style,
+    label,
+    labelTooltip,
+    spacing = '32px',
+    itemWidth,
+    size = 'large',
+    row = true,
+    disabled = false,
+    required = false,
+    error = false,
+    hideErrorDom,
+    helperText = '',
+    id = 'name',
+    value,
+    list,
+    onChange
+  } = props;
+  const [valueCom, setValueCom] = useState();
+  useEffect(() => {
     if (props.defaultValue !== undefined) setValueCom(props.defaultValue);
   }, []);
-  useEffect(function () {
+  useEffect(() => {
     if (value !== undefined) setValueCom(value);
   }, [value]);
   /**
    * 改变值
    * @param item 点击当前项数据
    */
-  var onchangeCom = function onchangeCom(item) {
-    return function () {
-      var name = item[id]; // 值
-      if (value === name) return;
-      if (props.value === undefined) setValueCom(name);
-      onChange && onChange(name, item);
-    };
+  const onchangeCom = item => () => {
+    const name = item[id]; // 值
+    if (value === name) return;
+    if (props.value === undefined) setValueCom(name);
+    onChange && onChange(name, item);
   };
-  var handLabel = function handLabel() {
+  const handLabel = () => {
     if (label || required) {
-      var handLabelClass = function handLabelClass() {
-        var str = 'radio-group-label';
+      const handLabelClass = () => {
+        let str = 'radio-group-label';
         if (labelTooltip && labelTooltip.className) {
           str += " ".concat(labelTooltip.className);
         }
@@ -88,8 +74,8 @@ var RadioGroup = function RadioGroup(props) {
   /**
    * @description 处理单选框每一项样式
    * */
-  var handStyleItem = function handStyleItem(item, index, arr) {
-    var obj = Object.assign({
+  const handStyleItem = (item, index, arr) => {
+    const obj = Object.assign({
       display: 'inline-block'
     }, item.style);
     if (spacing && row && arr.length !== index + 1) {
@@ -101,8 +87,8 @@ var RadioGroup = function RadioGroup(props) {
     return obj;
   };
   // 处理class
-  var handClass = function handClass() {
-    var str = "".concat($prefixCls, "-radio-group");
+  const handClass = () => {
+    let str = "".concat($prefixCls, "-radio-group");
     if (className) str += " ".concat(className);
     if (size) str += " ".concat($prefixCls, "-radio-group-size");
     if (error) str += " ".concat($prefixCls, "-radio-group-error");
@@ -117,12 +103,12 @@ var RadioGroup = function RadioGroup(props) {
     children: [handLabel(), jsx("div", Object.assign({
       className: "radio-group-content"
     }, {
-      children: list.map(function (item, index) {
+      children: list.map((item, index) => {
         if (Array.isArray(item)) {
           return jsx("div", Object.assign({
             className: "radio-group-content-item"
           }, {
-            children: item.map(function (itemChild, inx) {
+            children: item.map((itemChild, inx) => {
               return jsx("span", Object.assign({
                 className: 'radio-item-box',
                 style: handStyleItem(itemChild, inx, item)

package/Search/index.js

@@ -1,12 +1,9 @@
-import { _ as _slicedToArray } from '../_verture/slicedToArray-a8206399.js';
 import { jsx } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
 import { TextField } from '../TextField/index.js';
 import SearchIcon from '@para-ui/icons/Search';
-import { $ as $prefixCls } from '../_verture/constant-0d9802f7.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 '../_verture/typeof-adeedc13.js';
 import '../_verture/tslib.es6-55ed4bd2.js';
 import '../Label/index.js';
 import '../Help/index.js';
@@ -24,50 +21,44 @@ import '../AutoTips/index.js';
 import '../Loading/index.js';
 import '@para-ui/icons/LoadingF';
 import '../HelperText/index.js';
-import '../_verture/useGlobalProps-1b846a65.js';
+import '../_verture/useGlobalProps-1e416658.js';
 import '@para-ui/core/GlobalContext';
-import '../_verture/index-e9007d6a.js';
+import '../_verture/index-da9097d3.js';
 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-search .search-text-field .text-field-content .text-field-content-within .right-icon svg {\n  font-size: 18px;\n}\n.paraui-v4-search .search-text-field .text-field-content .text-field-content-within .right-icon:hover svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-search.paraui-v4-search-small.paraui-v4-search-radius .search-text-field .text-field-content {\n  border-radius: 14px;\n}\n.paraui-v4-search.paraui-v4-search-small.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input input {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-small.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input .text-field-label-placeholder {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-small.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .right-icon {\n  margin-right: 16px;\n}\n.paraui-v4-search.paraui-v4-search-medium.paraui-v4-search-radius .search-text-field .text-field-content {\n  border-radius: 14px;\n}\n.paraui-v4-search.paraui-v4-search-medium.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input input {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-medium.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input .text-field-label-placeholder {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-medium.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .right-icon {\n  margin-right: 16px;\n}\n.paraui-v4-search.paraui-v4-search-large.paraui-v4-search-radius .search-text-field .text-field-content {\n  border-radius: 16px;\n}\n.paraui-v4-search.paraui-v4-search-large.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input input {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-large.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input .text-field-label-placeholder {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-large.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .right-icon {\n  margin-right: 16px;\n}";
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-search {\n  display: flex;\n  width: 100%;\n}\n.paraui-v4-search .search-text-field .text-field-content .text-field-content-within .right-icon svg {\n  font-size: 18px;\n}\n.paraui-v4-search .search-text-field .text-field-content .text-field-content-within .right-icon:hover svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-search.paraui-v4-search-small.paraui-v4-search-radius .search-text-field .text-field-content {\n  border-radius: 14px;\n}\n.paraui-v4-search.paraui-v4-search-small.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input input {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-small.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input .text-field-label-placeholder {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-small.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .right-icon {\n  margin-right: 16px;\n}\n.paraui-v4-search.paraui-v4-search-medium.paraui-v4-search-radius .search-text-field .text-field-content {\n  border-radius: 14px;\n}\n.paraui-v4-search.paraui-v4-search-medium.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input input {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-medium.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input .text-field-label-placeholder {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-medium.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .right-icon {\n  margin-right: 16px;\n}\n.paraui-v4-search.paraui-v4-search-large.paraui-v4-search-radius .search-text-field .text-field-content {\n  border-radius: 16px;\n}\n.paraui-v4-search.paraui-v4-search-large.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input input {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-large.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .text-field-content-within-input .text-field-label-placeholder {\n  padding-left: 16px;\n}\n.paraui-v4-search.paraui-v4-search-large.paraui-v4-search-radius .search-text-field .text-field-content .text-field-content-within .right-icon {\n  margin-right: 16px;\n}";
 styleInject(css_248z);
 
-var Search = function Search(props) {
-  var _props$className = props.className,
-    className = _props$className === void 0 ? '' : _props$className,
-    style = props.style,
-    _props$size = props.size,
-    size = _props$size === void 0 ? 'large' : _props$size,
-    _props$radius = props.radius,
-    radius = _props$radius === void 0 ? false : _props$radius,
-    _props$placeholder = props.placeholder,
-    placeholder = _props$placeholder === void 0 ? '' : _props$placeholder,
-    value = props.value,
-    rightIcon = props.rightIcon,
-    _props$allowClear = props.allowClear,
-    allowClear = _props$allowClear === void 0 ? true : _props$allowClear,
-    onChange = props.onChange,
-    onBlur = props.onBlur,
-    onFocus = props.onFocus,
-    onKeydown = props.onKeydown,
-    onKeyUp = props.onKeyUp,
-    onClickBtn = props.onClickBtn,
-    onEnter = props.onEnter,
-    onClear = props.onClear,
-    otherProps = props.otherProps;
-  var _useState = useState(''),
-    _useState2 = _slicedToArray(_useState, 2),
-    valueCom = _useState2[0],
-    setValueCom = _useState2[1];
-  useEffect(function () {
+const Search = props => {
+  const {
+    className = '',
+    style,
+    size = 'large',
+    radius = false,
+    placeholder = '',
+    value,
+    rightIcon,
+    allowClear = true,
+    onChange,
+    onBlur,
+    onFocus,
+    onKeydown,
+    onKeyUp,
+    onClickBtn,
+    onEnter,
+    onClear,
+    otherProps
+  } = props;
+  const [valueCom, setValueCom] = useState('');
+  useEffect(() => {
     if (props.defaultValue !== undefined) {
       setValueCom(props.defaultValue);
     }
   }, []);
   // 监听value
-  useEffect(function () {
+  useEffect(() => {
     if (value !== undefined) {
       setValueCom(value);
     }
@@ -76,14 +67,14 @@ var Search = function Search(props) {
    * 输入框右侧按钮
    * @return {ReactNode}
    */
-  var clearIcon = function clearIcon() {
+  const clearIcon = () => {
     if (rightIcon) return rightIcon;
     return jsx(SearchIcon, {});
   };
   /**
    * 点击输入框右侧按钮
    */
-  var clickRightIcon = function clickRightIcon() {
+  const clickRightIcon = () => {
     if (onClickBtn) {
       onClickBtn(valueCom);
       return;
@@ -94,8 +85,8 @@ var Search = function Search(props) {
    * 改变输入框
    * @param event {React.ChangeEvent<HTMLInputElement>} 元素
    */
-  var changeInput = function changeInput(event) {
-    var val = event.target.value;
+  const changeInput = event => {
+    const val = event.target.value;
     if (props.value === undefined) {
       setValueCom(val);
     }
@@ -105,14 +96,14 @@ var Search = function Search(props) {
    * 处理class
    * @return {string}
    */
-  var handClass = function handClass() {
-    var str = "".concat($prefixCls, "-search");
+  const handClass = () => {
+    let str = "".concat($prefixCls, "-search");
     if (className) str += " ".concat(className);
     if (size) str += " ".concat($prefixCls, "-search-").concat(size);
     if (radius) str += " ".concat($prefixCls, "-search-radius");
     return str;
   };
-  var handValue = function handValue() {
+  const handValue = () => {
     if (props.value === undefined) {
       return valueCom;
     }