linkmore-design 1.1.27-beta.5 → 1.1.28

package/es/Typography/Base/index.js

@@ -1,16 +1,20 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _typeof from "@babel/runtime/helpers/esm/typeof";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
+
   for (var p in s) {
     if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
   }
+
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
     if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
+
 import CheckOutlined from '@ant-design/icons/CheckOutlined';
 import CopyOutlined from '@ant-design/icons/CopyOutlined';
 import EditOutlined from '@ant-design/icons/EditOutlined';
@@ -34,19 +38,22 @@ import useUpdatedEffect from '../hooks/useUpdatedEffect';
 import Typography from '../Typography';
 import Ellipsis from './Ellipsis';
 import EllipsisTooltip from './EllipsisTooltip';
+
 function wrapperDecorations(_ref, content) {
   var mark = _ref.mark,
-    code = _ref.code,
-    underline = _ref.underline,
-    del = _ref.delete,
-    strong = _ref.strong,
-    keyboard = _ref.keyboard,
-    italic = _ref.italic;
+      code = _ref.code,
+      underline = _ref.underline,
+      del = _ref.delete,
+      strong = _ref.strong,
+      keyboard = _ref.keyboard,
+      italic = _ref.italic;
   var currentContent = content;
+
   function wrap(needed, tag) {
     if (!needed) return;
     currentContent = /*#__PURE__*/React.createElement(tag, {}, currentContent);
   }
+
   wrap(strong, 'strong');
   wrap(underline, 'u');
   wrap(del, 'del');
@@ -56,154 +63,185 @@ function wrapperDecorations(_ref, content) {
   wrap(italic, 'i');
   return currentContent;
 }
+
 function getNode(dom, defaultNode, needDom) {
   if (dom === true || dom === undefined) {
     return defaultNode;
   }
+
   return dom || needDom && defaultNode;
 }
+
 function toList(val) {
   return Array.isArray(val) ? val : [val];
 }
+
 var ELLIPSIS_STR = '...';
 var Base = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var customizePrefixCls = props.prefixCls,
-    className = props.className,
-    style = props.style,
-    type = props.type,
-    disabled = props.disabled,
-    children = props.children,
-    ellipsis = props.ellipsis,
-    editable = props.editable,
-    copyable = props.copyable,
-    component = props.component,
-    title = props.title,
-    restProps = __rest(props, ["prefixCls", "className", "style", "type", "disabled", "children", "ellipsis", "editable", "copyable", "component", "title"]);
+      className = props.className,
+      style = props.style,
+      type = props.type,
+      disabled = props.disabled,
+      children = props.children,
+      ellipsis = props.ellipsis,
+      editable = props.editable,
+      copyable = props.copyable,
+      component = props.component,
+      title = props.title,
+      restProps = __rest(props, ["prefixCls", "className", "style", "type", "disabled", "children", "ellipsis", "editable", "copyable", "component", "title"]);
+
   var _React$useContext = React.useContext(ConfigContext),
-    getPrefixCls = _React$useContext.getPrefixCls,
-    direction = _React$useContext.direction;
+      getPrefixCls = _React$useContext.getPrefixCls,
+      direction = _React$useContext.direction;
+
   var textLocale = useLocaleReceiver('Text')[0]; // Force TS get this
+
   var typographyRef = React.useRef(null);
-  var editIconRef = React.useRef(null);
-  // ============================ MISC ============================
+  var editIconRef = React.useRef(null); // ============================ MISC ============================
+
   var prefixCls = getPrefixCls('typography', customizePrefixCls);
-  var textProps = omit(restProps, ['mark', 'code', 'delete', 'underline', 'strong', 'keyboard', 'italic']);
-  // ========================== Editable ==========================
+  var textProps = omit(restProps, ['mark', 'code', 'delete', 'underline', 'strong', 'keyboard', 'italic']); // ========================== Editable ==========================
+
   var _useMergedConfig = useMergedConfig(editable),
-    _useMergedConfig2 = _slicedToArray(_useMergedConfig, 2),
-    enableEdit = _useMergedConfig2[0],
-    editConfig = _useMergedConfig2[1];
+      _useMergedConfig2 = _slicedToArray(_useMergedConfig, 2),
+      enableEdit = _useMergedConfig2[0],
+      editConfig = _useMergedConfig2[1];
+
   var _useMergedState = useMergedState(false, {
-      value: editConfig.editing
-    }),
-    _useMergedState2 = _slicedToArray(_useMergedState, 2),
-    editing = _useMergedState2[0],
-    setEditing = _useMergedState2[1];
+    value: editConfig.editing
+  }),
+      _useMergedState2 = _slicedToArray(_useMergedState, 2),
+      editing = _useMergedState2[0],
+      setEditing = _useMergedState2[1];
+
   var _editConfig$triggerTy = editConfig.triggerType,
-    triggerType = _editConfig$triggerTy === void 0 ? ['icon'] : _editConfig$triggerTy;
+      triggerType = _editConfig$triggerTy === void 0 ? ['icon'] : _editConfig$triggerTy;
+
   var triggerEdit = function triggerEdit(edit) {
     var _a;
+
     if (edit) {
       (_a = editConfig.onStart) === null || _a === void 0 ? void 0 : _a.call(editConfig);
     }
+
     setEditing(edit);
-  };
-  // Focus edit icon when back
+  }; // Focus edit icon when back
+
+
   useUpdatedEffect(function () {
     var _a;
+
     if (!editing) {
       (_a = editIconRef.current) === null || _a === void 0 ? void 0 : _a.focus();
     }
   }, [editing]);
+
   var onEditClick = function onEditClick(e) {
     e === null || e === void 0 ? void 0 : e.preventDefault();
     triggerEdit(true);
   };
+
   var onEditChange = function onEditChange(value) {
     var _a;
+
     (_a = editConfig.onChange) === null || _a === void 0 ? void 0 : _a.call(editConfig, value);
     triggerEdit(false);
   };
+
   var onEditCancel = function onEditCancel() {
     var _a;
+
     (_a = editConfig.onCancel) === null || _a === void 0 ? void 0 : _a.call(editConfig);
     triggerEdit(false);
-  };
-  // ========================== Copyable ==========================
+  }; // ========================== Copyable ==========================
+
+
   var _useMergedConfig3 = useMergedConfig(copyable),
-    _useMergedConfig4 = _slicedToArray(_useMergedConfig3, 2),
-    enableCopy = _useMergedConfig4[0],
-    copyConfig = _useMergedConfig4[1];
+      _useMergedConfig4 = _slicedToArray(_useMergedConfig3, 2),
+      enableCopy = _useMergedConfig4[0],
+      copyConfig = _useMergedConfig4[1];
+
   var _React$useState = React.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    copied = _React$useState2[0],
-    setCopied = _React$useState2[1];
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      copied = _React$useState2[0],
+      setCopied = _React$useState2[1];
+
   var copyIdRef = React.useRef();
   var copyOptions = {};
+
   if (copyConfig.format) {
     copyOptions.format = copyConfig.format;
   }
+
   var cleanCopyId = function cleanCopyId() {
     clearTimeout(copyIdRef.current);
   };
+
   var onCopyClick = function onCopyClick(e) {
     var _a;
+
     e === null || e === void 0 ? void 0 : e.preventDefault();
     e === null || e === void 0 ? void 0 : e.stopPropagation();
     copy(copyConfig.text || String(children) || '', copyOptions);
-    setCopied(true);
-    // Trigger tips update
+    setCopied(true); // Trigger tips update
+
     cleanCopyId();
     copyIdRef.current = setTimeout(function () {
       setCopied(false);
     }, 3000);
     (_a = copyConfig.onCopy) === null || _a === void 0 ? void 0 : _a.call(copyConfig, e);
   };
+
   React.useEffect(function () {
     return cleanCopyId;
-  }, []);
-  // ========================== Ellipsis ==========================
+  }, []); // ========================== Ellipsis ==========================
+
   var _React$useState3 = React.useState(false),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    isLineClampSupport = _React$useState4[0],
-    setIsLineClampSupport = _React$useState4[1];
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      isLineClampSupport = _React$useState4[0],
+      setIsLineClampSupport = _React$useState4[1];
+
   var _React$useState5 = React.useState(false),
-    _React$useState6 = _slicedToArray(_React$useState5, 2),
-    isTextOverflowSupport = _React$useState6[0],
-    setIsTextOverflowSupport = _React$useState6[1];
+      _React$useState6 = _slicedToArray(_React$useState5, 2),
+      isTextOverflowSupport = _React$useState6[0],
+      setIsTextOverflowSupport = _React$useState6[1];
+
   var _React$useState7 = React.useState(false),
-    _React$useState8 = _slicedToArray(_React$useState7, 2),
-    expanded = _React$useState8[0],
-    setExpanded = _React$useState8[1];
+      _React$useState8 = _slicedToArray(_React$useState7, 2),
+      expanded = _React$useState8[0],
+      setExpanded = _React$useState8[1];
+
   var _React$useState9 = React.useState(false),
-    _React$useState10 = _slicedToArray(_React$useState9, 2),
-    isJsEllipsis = _React$useState10[0],
-    setIsJsEllipsis = _React$useState10[1];
+      _React$useState10 = _slicedToArray(_React$useState9, 2),
+      isJsEllipsis = _React$useState10[0],
+      setIsJsEllipsis = _React$useState10[1];
+
   var _React$useState11 = React.useState(false),
-    _React$useState12 = _slicedToArray(_React$useState11, 2),
-    isNativeEllipsis = _React$useState12[0],
-    setIsNativeEllipsis = _React$useState12[1];
+      _React$useState12 = _slicedToArray(_React$useState11, 2),
+      isNativeEllipsis = _React$useState12[0],
+      setIsNativeEllipsis = _React$useState12[1];
+
   var _React$useState13 = React.useState(true),
-    _React$useState14 = _slicedToArray(_React$useState13, 2),
-    isNativeVisible = _React$useState14[0],
-    setIsNativeVisible = _React$useState14[1];
+      _React$useState14 = _slicedToArray(_React$useState13, 2),
+      isNativeVisible = _React$useState14[0],
+      setIsNativeVisible = _React$useState14[1];
+
   var _useMergedConfig5 = useMergedConfig(ellipsis, {
-      expandable: false
-    }),
-    _useMergedConfig6 = _slicedToArray(_useMergedConfig5, 2),
-    enableEllipsis = _useMergedConfig6[0],
-    ellipsisConfig = _useMergedConfig6[1];
-  var mergedEnableEllipsis = enableEllipsis && !expanded;
-  // Shared prop to reduce bundle size
+    expandable: false
+  }),
+      _useMergedConfig6 = _slicedToArray(_useMergedConfig5, 2),
+      enableEllipsis = _useMergedConfig6[0],
+      ellipsisConfig = _useMergedConfig6[1];
+
+  var mergedEnableEllipsis = enableEllipsis && !expanded; // Shared prop to reduce bundle size
+
   var _ellipsisConfig$rows = ellipsisConfig.rows,
-    rows = _ellipsisConfig$rows === void 0 ? 1 : _ellipsisConfig$rows;
+      rows = _ellipsisConfig$rows === void 0 ? 1 : _ellipsisConfig$rows;
   var needMeasureEllipsis = React.useMemo(function () {
-    return (
-      // Disable ellipsis
-      !mergedEnableEllipsis ||
-      // Provide suffix
-      ellipsisConfig.suffix !== undefined || ellipsisConfig.onEllipsis ||
-      // Can't use css ellipsis since we need to provide the place for button
+    return (// Disable ellipsis
+      !mergedEnableEllipsis || // Provide suffix
+      ellipsisConfig.suffix !== undefined || ellipsisConfig.onEllipsis || // Can't use css ellipsis since we need to provide the place for button
       ellipsisConfig.expandable || enableEdit || enableCopy
     );
   }, [mergedEnableEllipsis, ellipsisConfig, enableEdit, enableCopy]);
@@ -217,56 +255,69 @@ var Base = /*#__PURE__*/React.forwardRef(function (props, ref) {
     if (needMeasureEllipsis) {
       return false;
     }
+
     if (rows === 1) {
       return isTextOverflowSupport;
     }
+
     return isLineClampSupport;
   }, [needMeasureEllipsis, isTextOverflowSupport, isLineClampSupport]);
   var isMergedEllipsis = mergedEnableEllipsis && (cssEllipsis ? isNativeEllipsis : isJsEllipsis);
   var cssTextOverflow = mergedEnableEllipsis && rows === 1 && cssEllipsis;
-  var cssLineClamp = mergedEnableEllipsis && rows > 1 && cssEllipsis;
-  // >>>>> Expand
+  var cssLineClamp = mergedEnableEllipsis && rows > 1 && cssEllipsis; // >>>>> Expand
+
   var onExpandClick = function onExpandClick(e) {
     var _a;
+
     setExpanded(true);
     (_a = ellipsisConfig.onExpand) === null || _a === void 0 ? void 0 : _a.call(ellipsisConfig, e);
   };
+
   var _React$useState15 = React.useState(0),
-    _React$useState16 = _slicedToArray(_React$useState15, 2),
-    ellipsisWidth = _React$useState16[0],
-    setEllipsisWidth = _React$useState16[1];
+      _React$useState16 = _slicedToArray(_React$useState15, 2),
+      ellipsisWidth = _React$useState16[0],
+      setEllipsisWidth = _React$useState16[1];
+
   var onResize = function onResize(_ref2) {
     var offsetWidth = _ref2.offsetWidth;
     setEllipsisWidth(offsetWidth);
-  };
-  // >>>>> JS Ellipsis
+  }; // >>>>> JS Ellipsis
+
+
   var onJsEllipsis = function onJsEllipsis(jsEllipsis) {
     var _a;
-    setIsJsEllipsis(jsEllipsis);
-    // Trigger if changed
+
+    setIsJsEllipsis(jsEllipsis); // Trigger if changed
+
     if (isJsEllipsis !== jsEllipsis) {
       (_a = ellipsisConfig.onEllipsis) === null || _a === void 0 ? void 0 : _a.call(ellipsisConfig, jsEllipsis);
     }
-  };
-  // >>>>> Native ellipsis
+  }; // >>>>> Native ellipsis
+
+
   React.useEffect(function () {
     var textEle = typographyRef.current;
+
     if (enableEllipsis && cssEllipsis && textEle) {
       var currentEllipsis = cssLineClamp ? textEle.offsetHeight < textEle.scrollHeight : textEle.offsetWidth < textEle.scrollWidth;
+
       if (isNativeEllipsis !== currentEllipsis) {
         setIsNativeEllipsis(currentEllipsis);
       }
     }
-  }, [enableEllipsis, cssEllipsis, children, cssLineClamp, isNativeVisible]);
-  // https://github.com/ant-design/ant-design/issues/36786
+  }, [enableEllipsis, cssEllipsis, children, cssLineClamp, isNativeVisible]); // https://github.com/ant-design/ant-design/issues/36786
   // Use IntersectionObserver to check if element is invisible
+
   React.useEffect(function () {
     var textEle = typographyRef.current;
+
     if (typeof IntersectionObserver === 'undefined' || !textEle || !cssEllipsis || !mergedEnableEllipsis) {
       // @ts-ignore
       return;
     }
     /* eslint-disable-next-line compat/compat */
+
+
     var observer = new IntersectionObserver(function () {
       setIsNativeVisible(!!textEle.offsetParent);
     });
@@ -274,9 +325,10 @@ var Base = /*#__PURE__*/React.forwardRef(function (props, ref) {
     return function () {
       observer.disconnect();
     };
-  }, [cssEllipsis, mergedEnableEllipsis]);
-  // ========================== Tooltip ===========================
+  }, [cssEllipsis, mergedEnableEllipsis]); // ========================== Tooltip ===========================
+
   var tooltipProps = {};
+
   if (ellipsisConfig.tooltip === true) {
     tooltipProps = {
       title: children
@@ -294,26 +346,32 @@ var Base = /*#__PURE__*/React.forwardRef(function (props, ref) {
       title: ellipsisConfig.tooltip
     };
   }
+
   var topAriaLabel = React.useMemo(function () {
     var isValid = function isValid(val) {
       return ['string', 'number'].includes(_typeof(val));
     };
+
     if (!enableEllipsis || cssEllipsis) {
       return undefined;
     }
+
     if (isValid(children)) {
       return children;
     }
+
     if (isValid(title)) {
       return title;
     }
+
     if (isValid(tooltipProps.title)) {
       return tooltipProps.title;
     }
+
     return undefined;
-  }, [enableEllipsis, cssEllipsis, title, tooltipProps.title, isMergedEllipsis]);
-  // =========================== Render ===========================
+  }, [enableEllipsis, cssEllipsis, title, tooltipProps.title, isMergedEllipsis]); // =========================== Render ===========================
   // >>>>>>>>>>> Editing input
+
   if (editing) {
     return /*#__PURE__*/React.createElement(Editable, {
       value: typeof children === 'string' ? children : '',
@@ -329,32 +387,36 @@ var Base = /*#__PURE__*/React.forwardRef(function (props, ref) {
       autoSize: editConfig.autoSize,
       enterIcon: editConfig.enterIcon
     });
-  }
-  // >>>>>>>>>>> Typography
+  } // >>>>>>>>>>> Typography
   // Expand
+
+
   var renderExpand = function renderExpand() {
     var expandable = ellipsisConfig.expandable,
-      symbol = ellipsisConfig.symbol;
+        symbol = ellipsisConfig.symbol;
     if (!expandable) return null;
     var expandContent;
+
     if (symbol) {
       expandContent = symbol;
     } else {
       expandContent = textLocale.expand;
     }
+
     return /*#__PURE__*/React.createElement("a", {
       key: "expand",
       className: "".concat(prefixCls, "-expand"),
       onClick: onExpandClick,
       "aria-label": textLocale.expand
     }, expandContent);
-  };
-  // Edit
+  }; // Edit
+
+
   var renderEdit = function renderEdit() {
     // @ts-ignore
     if (!enableEdit) return;
     var icon = editConfig.icon,
-      tooltip = editConfig.tooltip;
+        tooltip = editConfig.tooltip;
     var editTitle = toArray(tooltip)[0] || textLocale.edit;
     var ariaLabel = typeof editTitle === 'string' ? editTitle : '';
     return triggerType.includes('icon') ? /*#__PURE__*/React.createElement(Tooltip, {
@@ -368,13 +430,14 @@ var Base = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }, icon || /*#__PURE__*/React.createElement(EditOutlined, {
       role: "button"
     }))) : null;
-  };
-  // Copy
+  }; // Copy
+
+
   var renderCopy = function renderCopy() {
     // @ts-ignore
     if (!enableCopy) return;
     var tooltips = copyConfig.tooltips,
-      icon = copyConfig.icon;
+        icon = copyConfig.icon;
     var tooltipNodes = toList(tooltips);
     var iconNodes = toList(icon);
     var copyTitle = copied ? getNode(tooltipNodes[1], textLocale.copied) : getNode(tooltipNodes[0], textLocale.copy);
@@ -389,20 +452,24 @@ var Base = /*#__PURE__*/React.forwardRef(function (props, ref) {
       "aria-label": ariaLabel
     }, copied ? getNode(iconNodes[1], /*#__PURE__*/React.createElement(CheckOutlined, null), true) : getNode(iconNodes[0], /*#__PURE__*/React.createElement(CopyOutlined, null), true)));
   };
+
   var renderOperations = function renderOperations(renderExpanded) {
     return [renderExpanded && renderExpand(), renderEdit(), renderCopy()];
   };
+
   var renderEllipsis = function renderEllipsis(needEllipsis) {
     return [needEllipsis && /*#__PURE__*/React.createElement("span", {
       "aria-hidden": true,
       key: "ellipsis"
     }, ELLIPSIS_STR), ellipsisConfig.suffix, renderOperations(needEllipsis)];
   };
+
   return /*#__PURE__*/React.createElement(ResizeObserver, {
     onResize: onResize,
     disabled: !mergedEnableEllipsis || cssEllipsis
   }, function (resizeRef) {
     var _classNames;
+
     return /*#__PURE__*/React.createElement(EllipsisTooltip, {
       tooltipProps: tooltipProps,
       enabledEllipsis: mergedEnableEllipsis,
@@ -426,12 +493,14 @@ var Base = /*#__PURE__*/React.forwardRef(function (props, ref) {
       onEllipsis: onJsEllipsis
     }, function (node, needEllipsis) {
       var renderNode = node;
+
       if (node.length && needEllipsis && topAriaLabel) {
         renderNode = /*#__PURE__*/React.createElement("span", {
           key: "show-content",
           "aria-hidden": true
         }, renderNode);
       }
+
       var wrappedContext = wrapperDecorations(props, /*#__PURE__*/React.createElement(React.Fragment, null, renderNode, renderEllipsis(needEllipsis)));
       return wrappedContext;
     })));

package/es/Typography/Editable.js

@@ -7,29 +7,32 @@ import * as React from 'react';
 import { Input } from 'linkmore-design';
 import { cloneElement } from '../_util/reactNode';
 var TextArea = Input.TextArea;
+
 var Editable = function Editable(_ref) {
   var prefixCls = _ref.prefixCls,
-    ariaLabel = _ref['aria-label'],
-    className = _ref.className,
-    style = _ref.style,
-    direction = _ref.direction,
-    maxLength = _ref.maxLength,
-    _ref$autoSize = _ref.autoSize,
-    autoSize = _ref$autoSize === void 0 ? true : _ref$autoSize,
-    value = _ref.value,
-    onSave = _ref.onSave,
-    onCancel = _ref.onCancel,
-    onEnd = _ref.onEnd,
-    component = _ref.component,
-    _ref$enterIcon = _ref.enterIcon,
-    enterIcon = _ref$enterIcon === void 0 ? /*#__PURE__*/React.createElement(EnterOutlined, null) : _ref$enterIcon;
+      ariaLabel = _ref['aria-label'],
+      className = _ref.className,
+      style = _ref.style,
+      direction = _ref.direction,
+      maxLength = _ref.maxLength,
+      _ref$autoSize = _ref.autoSize,
+      autoSize = _ref$autoSize === void 0 ? true : _ref$autoSize,
+      value = _ref.value,
+      onSave = _ref.onSave,
+      onCancel = _ref.onCancel,
+      onEnd = _ref.onEnd,
+      component = _ref.component,
+      _ref$enterIcon = _ref.enterIcon,
+      enterIcon = _ref$enterIcon === void 0 ? /*#__PURE__*/React.createElement(EnterOutlined, null) : _ref$enterIcon;
   var ref = React.useRef();
   var inComposition = React.useRef(false);
   var lastKeyCode = React.useRef();
+
   var _React$useState = React.useState(value),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    current = _React$useState2[0],
-    setCurrent = _React$useState2[1];
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      current = _React$useState2[0],
+      setCurrent = _React$useState2[1];
+
   React.useEffect(function () {
     setCurrent(value);
   }, [value]);
@@ -41,31 +44,38 @@ var Editable = function Editable(_ref) {
       textArea.setSelectionRange(length, length);
     }
   }, []);
+
   var onChange = function onChange(_ref2) {
     var target = _ref2.target;
     setCurrent(target.value.replace(/[\n\r]/g, ''));
   };
+
   var onCompositionStart = function onCompositionStart() {
     inComposition.current = true;
   };
+
   var onCompositionEnd = function onCompositionEnd() {
     inComposition.current = false;
   };
+
   var onKeyDown = function onKeyDown(_ref3) {
     var keyCode = _ref3.keyCode;
     // We don't record keyCode when IME is using
     if (inComposition.current) return;
     lastKeyCode.current = keyCode;
   };
+
   var confirmChange = function confirmChange() {
     onSave(current.trim());
   };
+
   var onKeyUp = function onKeyUp(_ref4) {
     var keyCode = _ref4.keyCode,
-      ctrlKey = _ref4.ctrlKey,
-      altKey = _ref4.altKey,
-      metaKey = _ref4.metaKey,
-      shiftKey = _ref4.shiftKey;
+        ctrlKey = _ref4.ctrlKey,
+        altKey = _ref4.altKey,
+        metaKey = _ref4.metaKey,
+        shiftKey = _ref4.shiftKey;
+
     // Check if it's a real key
     if (lastKeyCode.current === keyCode && !inComposition.current && !ctrlKey && !altKey && !metaKey && !shiftKey) {
       if (keyCode === KeyCode.ENTER) {
@@ -76,9 +86,11 @@ var Editable = function Editable(_ref) {
       }
     }
   };
+
   var onBlur = function onBlur() {
     confirmChange();
   };
+
   var textClassName = component ? "".concat(prefixCls, "-").concat(component) : '';
   var textAreaClassName = classNames(prefixCls, "".concat(prefixCls, "-edit-content"), _defineProperty({}, "".concat(prefixCls, "-rtl"), direction === 'rtl'), className, textClassName);
   return /*#__PURE__*/React.createElement("div", {
@@ -101,4 +113,5 @@ var Editable = function Editable(_ref) {
     className: "".concat(prefixCls, "-edit-content-confirm")
   }) : null);
 };
+
 export default Editable;