@para-ui/core 4.0.0-rc.4 → 4.0.0-rc.6

package/DragVerify/index.js

@@ -1,5 +1,3 @@
-import { _ as _slicedToArray } from '../_verture/slicedToArray-a8206399.js';
-import { r as regenerator } from '../_verture/index-232d890b.js';
 import { a as __awaiter } from '../_verture/tslib.es6-55ed4bd2.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState, useRef, useEffect } from 'react';
@@ -8,12 +6,10 @@ import DoubleRight from '@para-ui/icons/DoubleRight';
 import CloseIcon from '@para-ui/icons/Close';
 import Check from '@para-ui/icons/Check';
 import Refresh from '@para-ui/icons/Refresh';
-import { $ as $prefixCls } from '../_verture/constant-0d9802f7.js';
-import { u as useFormatMessage } from '../_verture/useFormatMessage-703f8b20.js';
+import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
+import { u as useFormatMessage } from '../_verture/useFormatMessage-eb13cf56.js';
 import { Loading } from '../Loading/index.js';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
-import '../_verture/unsupportedIterableToArray-cb478f24.js';
-import '../_verture/typeof-c310ee4a.js';
 import '@para-ui/core/GlobalContext';
 import '@para-ui/icons/LoadingF';
 
@@ -28,120 +24,88 @@ var zh = {
 };
 
 var localeJson = {
-  zh: zh,
-  en: en
+  zh,
+  en
 };
 
 var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-drag-verify {\n  width: 100%;\n  position: relative;\n}\n.paraui-v4-drag-verify > .refresh {\n  position: absolute;\n  right: 4px;\n  top: 4px;\n  z-index: 10;\n  cursor: pointer;\n  display: none;\n  font-size: 24px;\n  color: rgb(255, 255, 255);\n  opacity: 0.7;\n}\n.paraui-v4-drag-verify > .refresh:hover {\n  opacity: 1;\n}\n.paraui-v4-drag-verify > .slider-img {\n  position: relative;\n  border-radius: 4px;\n  overflow: hidden;\n  line-height: 0;\n  min-height: 60px;\n}\n.paraui-v4-drag-verify > .slider-img .slider-img-bg {\n  width: 100%;\n  height: auto;\n  border-radius: 4px;\n}\n.paraui-v4-drag-verify > .slider-img .slider-img-move {\n  position: absolute;\n  left: 0;\n  height: auto;\n}\n.paraui-v4-drag-verify > .slider-move {\n  position: relative;\n  text-align: center;\n  line-height: 32px;\n  height: 32px;\n  margin-top: 12px;\n}\n.paraui-v4-drag-verify > .slider-move > .slider-move-bg {\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0;\n  background-color: rgb(247, 248, 250);\n  height: 32px;\n  border-radius: 4px;\n  border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-drag-verify > .slider-move > .slider-move-mask {\n  position: absolute;\n  left: 0;\n  top: 0;\n  height: 32px;\n  width: 2px;\n  border-bottom-left-radius: 4px;\n  border-top-left-radius: 4px;\n}\n.paraui-v4-drag-verify > .slider-move > .slider-move-mask > .slider-move-box {\n  position: absolute;\n  top: 0;\n  left: -1px;\n  width: 32px;\n  height: 32px;\n  background: rgb(255, 255, 255);\n  cursor: pointer;\n  border-radius: 4px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-drag-verify > .slider-move > .slider-move-mask > .slider-move-box:hover .svg-right {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-drag-verify > .slider-move > .slider-move-mask > .slider-move-box .svg-right {\n  display: inline-block;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-drag-verify > .slider-move > .slider-move-mask > .slider-move-box .svg-close {\n  display: none;\n}\n.paraui-v4-drag-verify > .slider-move > .slider-move-mask > .slider-move-box .svg-check {\n  display: none;\n}\n.paraui-v4-drag-verify > .slider-move > .slider-move-text {\n  color: rgb(161, 168, 179);\n  font-size: 14px;\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-move > .slider-move > .slider-move-mask {\n  border: 1px solid rgb(46, 101, 230);\n  border-width: 1px 0 1px 1px;\n  background-color: rgb(213, 224, 250);\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-move > .slider-move > .slider-move-mask > .slider-move-box {\n  background-color: rgb(46, 101, 230);\n  border-top: 1px solid rgb(46, 101, 230);\n  border-bottom: 1px solid rgb(46, 101, 230);\n  top: -1px;\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-move > .slider-move > .slider-move-mask > .slider-move-box > .svg-right {\n  color: rgb(255, 255, 255);\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-error > .slider-move > .slider-move-mask {\n  border: 1px solid rgb(244, 66, 66);\n  border-width: 1px 0 1px 1px;\n  background-color: rgba(244, 66, 66, 0.1);\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-error > .slider-move > .slider-move-mask > .slider-move-box {\n  background-color: rgb(244, 66, 66);\n  border-top: 1px solid rgb(244, 66, 66);\n  border-bottom: 1px solid rgb(244, 66, 66);\n  top: -1px;\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-error > .slider-move > .slider-move-mask > .slider-move-box > .svg-close {\n  display: inline-block;\n  color: rgb(255, 255, 255);\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-error > .slider-move > .slider-move-mask > .slider-move-box > .svg-right {\n  display: none;\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-error > .slider-move > .slider-move-mask > .slider-move-box > .svg-check {\n  display: none;\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-success > .slider-move > .slider-move-mask {\n  border: 1px solid rgb(19, 191, 76);\n  border-width: 1px 0 1px 1px;\n  background-color: rgba(19, 191, 76, 0.1);\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-success > .slider-move > .slider-move-mask > .slider-move-box {\n  background-color: rgb(19, 191, 76);\n  border-top: 1px solid rgb(19, 191, 76);\n  border-bottom: 1px solid rgb(19, 191, 76);\n  top: -1px;\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-success > .slider-move > .slider-move-mask > .slider-move-box .svg-close {\n  display: none;\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-success > .slider-move > .slider-move-mask > .slider-move-box .svg-right {\n  display: none;\n}\n.paraui-v4-drag-verify.paraui-v4-drag-verify-success > .slider-move > .slider-move-mask > .slider-move-box .svg-check {\n  display: inline-block;\n  color: rgb(255, 255, 255);\n}";
 styleInject(css_248z);
 
-var DragVerify = function DragVerify(props) {
-  var className = props.className,
-    style = props.style,
-    refresh = props.refresh,
-    getImgInfo = props.getImgInfo,
-    verify = props.verify,
-    width = props.width,
-    height = props.height;
-  var intl = useFormatMessage('DragVerify', localeJson);
-  var _useState = useState(),
-    _useState2 = _slicedToArray(_useState, 2),
-    refreshCom = _useState2[0],
-    setRefreshCom = _useState2[1];
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    loading = _useState4[0],
-    setLoading = _useState4[1];
-  var refDom = useRef(null);
-  var constData = useRef({
-    getImgInfo: getImgInfo,
-    verify: verify
+const DragVerify = props => {
+  const {
+    className,
+    style,
+    refresh,
+    getImgInfo,
+    verify,
+    width,
+    height
+  } = props;
+  const intl = useFormatMessage('DragVerify', localeJson);
+  const [refreshCom, setRefreshCom] = useState();
+  const [loading, setLoading] = useState(false);
+  const refDom = useRef(null);
+  const constData = useRef({
+    getImgInfo,
+    verify
   });
-  var prefixCls = "".concat($prefixCls, "-drag-verify");
+  const prefixCls = "".concat($prefixCls, "-drag-verify");
   constData.current.getImgInfo = getImgInfo;
   constData.current.verify = verify;
-  useEffect(function () {
+  useEffect(() => {
     reset();
     getImgInfoReq();
-    return function () {
+    return () => {
       clearTimeout(constData.current.timerError);
       clearTimeout(constData.current.timerSuccess);
     };
   }, [refresh, refreshCom]);
   /** 获取图片信息 */
-  var getImgInfoReq = function getImgInfoReq() {
-    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee() {
-      var result;
-      return regenerator.wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            constData.current.padding = true;
-            setLoading(true);
-            _context.next = 4;
-            return constData.current.getImgInfo();
-          case 4:
-            result = _context.sent;
-            constData.current.imgInfo = result;
-            initImg();
-          case 7:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee);
-    }));
-  };
+  const getImgInfoReq = () => __awaiter(void 0, void 0, void 0, function* () {
+    constData.current.padding = true;
+    setLoading(true);
+    const result = yield constData.current.getImgInfo();
+    constData.current.imgInfo = result;
+    initImg();
+  });
   /** 校验滑块 */
-  var sliderPosiCheck = function sliderPosiCheck(x, callback) {
-    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee2() {
-      var result;
-      return regenerator.wrap(function _callee2$(_context2) {
-        while (1) switch (_context2.prev = _context2.next) {
-          case 0:
-            _context2.next = 2;
-            return constData.current.verify(x, constData.current.verify);
-          case 2:
-            result = _context2.sent;
-            callback(result);
-          case 4:
-          case "end":
-            return _context2.stop();
-        }
-      }, _callee2);
-    }));
-  };
+  const sliderPosiCheck = (x, callback) => __awaiter(void 0, void 0, void 0, function* () {
+    const result = yield constData.current.verify(x, constData.current.verify);
+    callback(result);
+  });
   /** 初始化图片 */
-  var initImg = function initImg() {
+  const initImg = () => {
     var _a;
     if (!refDom.current) return;
     // 背景图
-    var imgBg = document.createElement('img');
+    const imgBg = document.createElement('img');
     imgBg.setAttribute('src', (_a = constData.current.imgInfo) === null || _a === void 0 ? void 0 : _a.sourceImage);
     imgBg.style.display = 'none';
     // 滑动的图片
-    var imgMove = document.createElement('img');
+    const imgMove = document.createElement('img');
     constData.current.imgMove = imgMove;
     imgMove.className = 'slider-img-move';
     imgMove.style.display = 'none';
-    var sliderImgEle = refDom.current.querySelector('.slider-img');
-    var refreshEle = refDom.current.querySelector('.refresh');
+    const sliderImgEle = refDom.current.querySelector('.slider-img');
+    const refreshEle = refDom.current.querySelector('.refresh');
     if (!sliderImgEle || !refreshEle) return;
     refreshEle.style.display = 'none';
     sliderImgEle.innerHTML = '';
     sliderImgEle.append(imgBg);
-    imgBg.onload = function () {
+    imgBg.onload = () => {
       var _a;
       imgBg.style.display = 'inline-block'; // 必须先显示图片,要不然ie10获取不到图片
       imgMove.setAttribute('src', (_a = constData.current.imgInfo) === null || _a === void 0 ? void 0 : _a.newImage);
-      var a = imgBg.width;
+      const a = imgBg.width;
       imgBg.className = 'slider-img-bg';
       imgBg.style.display = 'inline-block';
       if (!refDom.current) return;
-      var sliderImgEle = refDom.current.querySelector('.slider-img');
-      var sliderImgEleRect = sliderImgEle === null || sliderImgEle === void 0 ? void 0 : sliderImgEle.getBoundingClientRect();
-      var b = sliderImgEleRect.width;
+      const sliderImgEle = refDom.current.querySelector('.slider-img');
+      const sliderImgEleRect = sliderImgEle === null || sliderImgEle === void 0 ? void 0 : sliderImgEle.getBoundingClientRect();
+      const b = sliderImgEleRect.width;
       constData.current.imgScale = a / b;
       sliderImgEle === null || sliderImgEle === void 0 ? void 0 : sliderImgEle.append(imgMove);
-      imgMove.onload = function () {
+      imgMove.onload = () => {
         var _a;
         constData.current.padding = false;
         imgMove.style.display = 'inline-block'; // 必须先显示图片,要不然ie10获取不到图片
@@ -154,46 +118,46 @@ var DragVerify = function DragVerify(props) {
     registerEvents(imgBg, imgMove);
   };
   /** 注册事件 */
-  var registerEvents = function registerEvents(imgBg, imgMove) {
-    var sliderBox = refDom.current;
+  const registerEvents = (imgBg, imgMove) => {
+    const sliderBox = refDom.current;
     if (!sliderBox) return;
-    var moveDom = sliderBox.querySelector('.slider-move-box'); // 滑块
-    var moveProgress = sliderBox.querySelector('.slider-move-mask'); // 滑动距离元素
-    var moveSliderEle = sliderBox.querySelector('.slider-move'); // 进度条的宽
-    var sliderText = sliderBox.querySelector('.slider-move-text'); // 互动轨道显示的文字
-    var moveSliderRect = moveSliderEle.getBoundingClientRect();
-    var moveDomRect = moveDom.getBoundingClientRect();
-    var moveDomWidth = moveDomRect.width; // 移动箭头的框
-    var moveSliderWidth = moveSliderRect.width; // 进度条的宽
-    moveDom.onmousedown = function (e) {
+    const moveDom = sliderBox.querySelector('.slider-move-box'); // 滑块
+    const moveProgress = sliderBox.querySelector('.slider-move-mask'); // 滑动距离元素
+    const moveSliderEle = sliderBox.querySelector('.slider-move'); // 进度条的宽
+    const sliderText = sliderBox.querySelector('.slider-move-text'); // 互动轨道显示的文字
+    const moveSliderRect = moveSliderEle.getBoundingClientRect();
+    const moveDomRect = moveDom.getBoundingClientRect();
+    const moveDomWidth = moveDomRect.width; // 移动箭头的框
+    const moveSliderWidth = moveSliderRect.width; // 进度条的宽
+    moveDom.onmousedown = e => {
       if (constData.current.padding) return;
       sliderBox.classList.add("".concat(prefixCls, "-move"));
-      document.onmousemove = function (event) {
-        var moveW = event.pageX - e.pageX; // 鼠标移动的距离
+      document.onmousemove = event => {
+        let moveW = event.pageX - e.pageX; // 鼠标移动的距离
         if (moveW < 0) moveW = 0;
         if (moveW + moveDomWidth > imgBg.width) moveW = imgBg.width - moveDomWidth;
         moveDom.style.left = "".concat(moveW - 1, "px");
         // 加一防止滑块与进度条之间有间隙
         moveProgress.style.width = "".concat(moveW < 2 ? 2 : moveW, "px");
         // 进度条走过的比例
-        var ratio = moveW / (moveSliderWidth - moveDomWidth);
-        var imgMoveWidth = (imgBg.width - imgMove.width) * ratio;
+        const ratio = moveW / (moveSliderWidth - moveDomWidth);
+        const imgMoveWidth = (imgBg.width - imgMove.width) * ratio;
         imgMove.style.left = "".concat(imgMoveWidth, "px");
         sliderText.innerHTML = '';
       };
       // 鼠标抬起
-      document.onmouseup = function () {
+      document.onmouseup = () => {
         document.onmousemove = null;
         document.onmouseup = null;
         sliderBox.classList.remove("".concat(prefixCls, "-move"));
         constData.current.padding = true;
-        var X = parseFloat(imgMove.style.left);
-        var handX = X * constData.current.imgScale;
-        sliderPosiCheck(handX, function (result) {
+        const X = parseFloat(imgMove.style.left);
+        const handX = X * constData.current.imgScale;
+        sliderPosiCheck(handX, result => {
           if (!result) {
             // 错误
             sliderBox.classList.add("".concat(prefixCls, "-error"));
-            constData.current.timerError = setTimeout(function () {
+            constData.current.timerError = setTimeout(() => {
               constData.current.padding = false;
               reset();
               sliderText.innerHTML = intl({
@@ -213,14 +177,14 @@ var DragVerify = function DragVerify(props) {
     };
   };
   /** 复位 */
-  var reset = function reset() {
-    var sliderBox = refDom.current;
+  const reset = () => {
+    const sliderBox = refDom.current;
     if (!sliderBox) return;
     sliderBox.classList.remove("".concat(prefixCls, "-success"));
     sliderBox.classList.remove("".concat(prefixCls, "-error"));
-    var moveDom = sliderBox.querySelector('.slider-move-box'); // 滑块
-    var moveProgress = sliderBox.querySelector('.slider-move-mask'); // 滑动距离元素
-    var sliderText = sliderBox.querySelector('.slider-move-text'); // 互动轨道显示的文字
+    const moveDom = sliderBox.querySelector('.slider-move-box'); // 滑块
+    const moveProgress = sliderBox.querySelector('.slider-move-mask'); // 滑动距离元素
+    const sliderText = sliderBox.querySelector('.slider-move-text'); // 互动轨道显示的文字
     sliderText.innerHTML = intl({
       id: 'swipe'
     }); // 再试一次
@@ -229,25 +193,25 @@ var DragVerify = function DragVerify(props) {
     if (constData.current.imgMove) constData.current.imgMove.style.left = '0px';
   };
   /* 刷新 */
-  var clickRefresh = function clickRefresh() {
+  const clickRefresh = () => {
     setRefreshCom(Math.random());
   };
   /* 处理标签内容 */
-  var handStyle = function handStyle() {
-    var obj = {};
+  const handStyle = () => {
+    const obj = {};
     if (width) {
-      var widthHand = width;
+      let widthHand = width;
       if (typeof width === 'number') widthHand = "".concat(width, "px");
       obj.width = widthHand;
     }
     if (height) {
-      var heightHand = height;
+      let heightHand = height;
       if (typeof height === 'number') heightHand = "".concat(height, "px");
       obj.height = heightHand;
     }
     return obj;
   };
-  var makeCls = function makeCls() {
+  const makeCls = () => {
     return clsx(prefixCls, className);
   };
   return jsxs("div", Object.assign({

package/Drawer/index.js

@@ -1,26 +1,23 @@
-import { _ as _slicedToArray } from '../_verture/slicedToArray-a8206399.js';
 import { _ as __rest } from '../_verture/tslib.es6-55ed4bd2.js';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { useState, useRef, useEffect } from 'react';
 import clsx from 'clsx';
 import RcDrawer from 'rc-drawer';
 import { Button } from '../Button/index.js';
-import { u as useFormatMessage } from '../_verture/useFormatMessage-703f8b20.js';
-import { $ as $prefixCls } from '../_verture/constant-0d9802f7.js';
+import { u as useFormatMessage } from '../_verture/useFormatMessage-eb13cf56.js';
+import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
 import AutoTips from '../AutoTips/index.js';
 import { isIE } from '@paraview/lib';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
-import '../_verture/unsupportedIterableToArray-cb478f24.js';
-import '../_verture/typeof-adeedc13.js';
 import '@para-ui/icons/LoadingF';
 import '../Tooltip/index.js';
 import 'rc-tooltip';
 import 'rc-tooltip/lib/placements';
 import '@para-ui/icons/Forbid';
 import '@para-ui/icons/Down';
-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';
 import '@para-ui/core/GlobalContext';
 
@@ -35,8 +32,8 @@ var zh = {
 };
 
 var localeJson = {
-  zh: zh,
-  en: en
+  zh,
+  en
 };
 
 /**
@@ -44,8 +41,8 @@ var localeJson = {
  * @param el 当前元素
  * @param selector 查找元素class
  */
-var closest = function closest(el, selector) {
-  var matchesSelector = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector;
+const closest = (el, selector) => {
+  const matchesSelector = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector;
   while (el) {
     if (matchesSelector.call(el, selector)) {
       break;
@@ -59,53 +56,43 @@ var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/11/8 下
 styleInject(css_248z);
 
 //drawer 抽屉
-var Drawer = function Drawer(props) {
+const Drawer = props => {
   var _a;
-  var className = props.className,
-    resizable = props.resizable,
-    onClose = props.onClose,
-    _props$destroyOnClose = props.destroyOnClose,
-    destroyOnClose = _props$destroyOnClose === void 0 ? false : _props$destroyOnClose,
-    style = props.style,
-    title = props.title,
-    extra = props.extra,
-    _props$showExtra = props.showExtra,
-    showExtra = _props$showExtra === void 0 ? true : _props$showExtra,
-    footer = props.footer,
-    children = props.children,
-    _props$size = props.size,
-    size = _props$size === void 0 ? 'large' : _props$size,
-    onOk = props.onOk,
-    onCancel = props.onCancel,
-    afterVisibleChange = props.afterVisibleChange,
-    okButtonProps = props.okButtonProps,
-    cancelButtonProps = props.cancelButtonProps,
-    _props$push = props.push,
-    push = _props$push === void 0 ? {
-      distance: 100
-    } : _props$push,
+  const {
+      className,
+      resizable,
+      onClose,
+      destroyOnClose = false,
+      style,
+      title,
+      extra,
+      showExtra = true,
+      footer,
+      children,
+      size = 'large',
+      onOk,
+      onCancel,
+      afterVisibleChange,
+      okButtonProps,
+      cancelButtonProps,
+      push = {
+        distance: 100
+      }
+    } = props,
     restProps = __rest(props, ["className", "resizable", "onClose", "destroyOnClose", "style", "title", "extra", "showExtra", "footer", "children", "size", "onOk", "onCancel", "afterVisibleChange", "okButtonProps", "cancelButtonProps", "push"]);
-  var intl = useFormatMessage('Drawer', localeJson);
-  var _useState = useState(0),
-    _useState2 = _slicedToArray(_useState, 2),
-    setRefresh = _useState2[1];
-  var _useState3 = useState({}),
-    _useState4 = _slicedToArray(_useState3, 2),
-    offsetStyle = _useState4[0],
-    setOffsetStyle = _useState4[1];
-  var _useState5 = useState(false),
-    _useState6 = _slicedToArray(_useState5, 2),
-    isResizing = _useState6[0],
-    setIsResizing = _useState6[1];
-  var destroyCloseRef = useRef(false); //销毁标识
-  var timerRef = useRef();
-  var isHorizontal = ['left', 'right'].includes((_a = props.placement) !== null && _a !== void 0 ? _a : 'right');
-  var startRef = useRef(0);
-  var rootEleSize = useRef(0);
-  var initialContentEleSize = useRef();
-  var contentEleSize = useRef(0);
-  useEffect(function () {
-    return function () {
+  const intl = useFormatMessage('Drawer', localeJson);
+  const [, setRefresh] = useState(0);
+  const [offsetStyle, setOffsetStyle] = useState({});
+  const [isResizing, setIsResizing] = useState(false);
+  const destroyCloseRef = useRef(false); //销毁标识
+  const timerRef = useRef();
+  const isHorizontal = ['left', 'right'].includes((_a = props.placement) !== null && _a !== void 0 ? _a : 'right');
+  const startRef = useRef(0);
+  const rootEleSize = useRef(0);
+  const initialContentEleSize = useRef();
+  const contentEleSize = useRef(0);
+  useEffect(() => {
+    return () => {
       // 销毁时销毁timer
       if (!timerRef.current) return;
       clearTimeout(timerRef.current);
@@ -115,30 +102,30 @@ var Drawer = function Drawer(props) {
       initialContentEleSize.current = undefined;
     };
   }, []);
-  useEffect(function () {
+  useEffect(() => {
     setOffsetStyle(getOffsetStyle);
     if (!props.open) {
       initialContentEleSize.current = undefined;
     }
   }, [props.open, props.placement, props.width, props.height, size]);
   //设置drawer width、height
-  var getOffsetStyle = function getOffsetStyle() {
+  const getOffsetStyle = () => {
     if (!props.open) {
       return {};
     }
-    var sizeMap = {
+    const sizeMap = {
       large: '1000px',
       medium: '630px',
       small: '400px'
     };
-    var offsetStyle = {};
+    const offsetStyle = {};
     if (props.placement === 'left' || props.placement === 'right') {
-      var defaultWidth = sizeMap[size];
+      const defaultWidth = sizeMap[size];
       if (size !== 'auto') {
         offsetStyle.width = props.width === undefined ? defaultWidth : props.width;
       }
     } else {
-      var defaultHeight = size === 'large' ? 736 : 378;
+      const defaultHeight = size === 'large' ? 736 : 378;
       if (size !== 'auto') {
         offsetStyle.height = props.height === undefined ? defaultHeight : props.height;
       }
@@ -146,42 +133,42 @@ var Drawer = function Drawer(props) {
     return offsetStyle;
   };
   //关闭回调
-  var handleClose = function handleClose(e) {
+  const handleClose = e => {
     onClose === null || onClose === void 0 ? void 0 : onClose(e);
   };
   //确定回调
-  var handleOk = function handleOk() {
+  const handleOk = () => {
     onOk === null || onOk === void 0 ? void 0 : onOk();
   };
   //取消回调
-  var handleCancel = function handleCancel() {
+  const handleCancel = () => {
     onCancel === null || onCancel === void 0 ? void 0 : onCancel();
   };
-  var onHandlerMouseDown = function onHandlerMouseDown(e) {
+  const onHandlerMouseDown = e => {
     var _a, _b, _c;
     setIsResizing(true);
     startRef.current = isHorizontal ? e.clientX : e.clientY;
-    var rootEle = (_a = closest(e.target, ".".concat($prefixCls, "-drawer-open"))) !== null && _a !== void 0 ? _a : document.body;
-    var contentCls = ".".concat($prefixCls, "-drawer-content-wrapper");
-    var contentEle = (_b = closest(e.target, contentCls)) !== null && _b !== void 0 ? _b : rootEle.querySelector(contentCls);
+    const rootEle = (_a = closest(e.target, ".".concat($prefixCls, "-drawer-open"))) !== null && _a !== void 0 ? _a : document.body;
+    const contentCls = ".".concat($prefixCls, "-drawer-content-wrapper");
+    const contentEle = (_b = closest(e.target, contentCls)) !== null && _b !== void 0 ? _b : rootEle.querySelector(contentCls);
     rootEleSize.current = isHorizontal ? rootEle.offsetWidth : rootEle.offsetHeight;
     contentEleSize.current = isHorizontal ? contentEle.offsetWidth : contentEle.offsetHeight;
     initialContentEleSize.current = (_c = initialContentEleSize.current) !== null && _c !== void 0 ? _c : contentEleSize.current;
     document.addEventListener('mousemove', onHandlerMouseMove);
     document.addEventListener('mouseup', onHandlerMouseUp);
   };
-  var onHandlerMouseUp = function onHandlerMouseUp() {
+  const onHandlerMouseUp = () => {
     setIsResizing(false);
     document.removeEventListener('mousemove', onHandlerMouseMove);
     document.removeEventListener('mouseup', onHandlerMouseUp);
   };
-  var onHandlerMouseMove = function onHandlerMouseMove(e) {
+  const onHandlerMouseMove = e => {
     var _a;
-    var resizeMinimum = (_a = initialContentEleSize.current) !== null && _a !== void 0 ? _a : 400;
+    const resizeMinimum = (_a = initialContentEleSize.current) !== null && _a !== void 0 ? _a : 400;
     switch (props.placement) {
       case 'left':
         {
-          var newWidth = contentEleSize.current + (e.clientX - startRef.current);
+          const newWidth = contentEleSize.current + (e.clientX - startRef.current);
           if (newWidth + 100 >= rootEleSize.current || newWidth < resizeMinimum) return;
           setOffsetStyle({
             width: newWidth
@@ -190,16 +177,16 @@ var Drawer = function Drawer(props) {
         }
       case 'right':
         {
-          var _newWidth = contentEleSize.current - (e.clientX - startRef.current);
-          if (_newWidth + 100 >= rootEleSize.current || _newWidth < resizeMinimum) return;
+          const newWidth = contentEleSize.current - (e.clientX - startRef.current);
+          if (newWidth + 100 >= rootEleSize.current || newWidth < resizeMinimum) return;
           setOffsetStyle({
-            width: _newWidth
+            width: newWidth
           });
           break;
         }
       case 'top':
         {
-          var newHeight = contentEleSize.current + (e.clientY - startRef.current);
+          const newHeight = contentEleSize.current + (e.clientY - startRef.current);
           if (newHeight + 100 >= rootEleSize.current || newHeight < resizeMinimum) return;
           setOffsetStyle({
             height: newHeight
@@ -208,16 +195,16 @@ var Drawer = function Drawer(props) {
         }
       case 'bottom':
         {
-          var _newHeight = contentEleSize.current - (e.clientY - startRef.current);
-          if (_newHeight + 100 >= rootEleSize.current || _newHeight < resizeMinimum) return;
+          const newHeight = contentEleSize.current - (e.clientY - startRef.current);
+          if (newHeight + 100 >= rootEleSize.current || newHeight < resizeMinimum) return;
           setOffsetStyle({
-            height: _newHeight
+            height: newHeight
           });
           break;
         }
     }
   };
-  var handleTitle = function handleTitle(title) {
+  const handleTitle = title => {
     if (typeof title === 'string') {
       return jsx("div", Object.assign({
         className: 'drawer-header-title drawer-header-title-ellipsis'
@@ -234,7 +221,7 @@ var Drawer = function Drawer(props) {
     }));
   };
   //标题节点
-  var titleNode = jsxs("div", Object.assign({
+  const titleNode = jsxs("div", Object.assign({
     className: 'drawer-body-header'
   }, {
     children: [jsx(Fragment, {
@@ -266,7 +253,7 @@ var Drawer = function Drawer(props) {
     })]
   }));
   //渲染内容
-  var renderContent = function renderContent() {
+  const renderContent = () => {
     if (!title && !footer) return children;
     return jsxs("div", Object.assign({
       className: 'drawer-content-body'
@@ -286,22 +273,20 @@ var Drawer = function Drawer(props) {
     destroyCloseRef.current = false;
     return null;
   }
-  var maskMotion = {
+  const maskMotion = {
     motionName: "".concat($prefixCls, "-drawer-mask-motion"),
     motionAppear: true,
     motionEnter: true,
     motionLeave: true,
     motionDeadline: isIE() ? 0 : 100
   };
-  var panelMotion = function panelMotion(motionPlacement) {
-    return {
-      motionName: "".concat($prefixCls, "-drawer-panel-motion-").concat(motionPlacement),
-      motionAppear: true,
-      motionEnter: true,
-      motionLeave: true,
-      motionDeadline: isIE() ? 0 : 100
-    };
-  };
+  const panelMotion = motionPlacement => ({
+    motionName: "".concat($prefixCls, "-drawer-panel-motion-").concat(motionPlacement),
+    motionAppear: true,
+    motionEnter: true,
+    motionLeave: true,
+    motionDeadline: isIE() ? 0 : 100
+  });
   return jsxs(RcDrawer, Object.assign({}, restProps, offsetStyle, {
     style: style,
     maskMotion: maskMotion,
@@ -310,12 +295,12 @@ var Drawer = function Drawer(props) {
     prefixCls: "".concat($prefixCls, "-drawer"),
     rootClassName: clsx(className, isResizing && "".concat($prefixCls, "-drawer-resizing")),
     onClose: handleClose,
-    afterOpenChange: function afterOpenChange(open) {
+    afterOpenChange: open => {
       if (open) {
         destroyCloseRef.current = false;
       } else if (destroyOnClose) {
         destroyCloseRef.current = true;
-        timerRef.current = setTimeout(function () {
+        timerRef.current = setTimeout(() => {
           setRefresh(Math.random());
         }, 300);
       }