@kdcloudjs/kdesign 1.7.40 → 1.7.42

package/es/pagination/pagination.js

@@ -3,9 +3,6 @@ import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
 import _extends from "@babel/runtime-corejs3/helpers/extends";
 import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
-import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
-import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
-import _keysInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/keys";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
 import * as React from 'react';
 import classNames from 'classnames';
@@ -19,7 +16,7 @@ import { tuple } from '../_utils/type';
 export var PageTypes = tuple('basic', 'bill', 'simple', 'less', 'nicety');
 export var TotalTypes = tuple('page', 'row', 'all');
 var Pagination = function Pagination(props) {
-  var _context4;
+  var _context2;
   var _React$useContext = React.useContext(ConfigContext),
     getPrefixCls = _React$useContext.getPrefixCls,
     pkgPrefixCls = _React$useContext.prefixCls,
@@ -178,8 +175,11 @@ var Pagination = function Pagination(props) {
   };
   // 生成元素是连续数字的数组
   function genArray(start, end) {
-    var _context2, _context3;
-    return _sliceInstanceProperty(_context2 = _Array$from(_keysInstanceProperty(_context3 = Array(end + 1)).call(_context3))).call(_context2, start);
+    var result = [];
+    for (var i = start; i <= end; i++) {
+      result.push(i);
+    }
+    return result;
   }
   function dropdownVisibleChange(visible) {
     setIsOpen(visible);
@@ -278,7 +278,7 @@ var Pagination = function Pagination(props) {
   }, /*#__PURE__*/React.createElement("li", _extends({}, itemAttr('action-item', paginationLangMsg.prevPage)), /*#__PURE__*/React.createElement("button", {
     onClick: handlePrev,
     disabled: page === 1 || disabled
-  }, innerIcon.prev)), /*#__PURE__*/React.createElement("li", _extends({}, itemAttr('action-item', _concatInstanceProperty(_context4 = "".concat(page, "/")).call(_context4, totalPage))), /*#__PURE__*/React.createElement("span", {
+  }, innerIcon.prev)), /*#__PURE__*/React.createElement("li", _extends({}, itemAttr('action-item', _concatInstanceProperty(_context2 = "".concat(page, "/")).call(_context2, totalPage))), /*#__PURE__*/React.createElement("span", {
     className: "".concat(prefixCls, "-current")
   }, showJumper ? /*#__PURE__*/React.createElement("input", {
     type: "text",
@@ -295,30 +295,33 @@ var Pagination = function Pagination(props) {
     disabled: page === totalPage || disabled
   }, innerIcon.next))));
   var lessPages = genArray(1, totalPage);
-  var lessPagination = /*#__PURE__*/React.createElement("div", {
-    className: classNames(prefixCls, 'less', {
-      bordered: bordered,
-      disabled: disabled
-    }, className),
-    style: style
-  }, Total, /*#__PURE__*/React.createElement("ul", {
-    className: "".concat(prefixCls, "-pages")
-  }, /*#__PURE__*/React.createElement("li", _extends({}, itemAttr('pages-item', paginationLangMsg.prevPage)), /*#__PURE__*/React.createElement("button", {
-    onClick: handlePrev,
-    disabled: page === 1 || disabled
-  }, innerIcon.prev)), _mapInstanceProperty(lessPages).call(lessPages, function (item, index) {
-    return /*#__PURE__*/React.createElement("li", _extends({
-      key: index
-    }, itemAttr('pages-item', String(item), item === page)), /*#__PURE__*/React.createElement("button", {
-      onClick: function onClick() {
-        return changePage(item);
-      },
-      disabled: disabled
-    }, item));
-  }), /*#__PURE__*/React.createElement("li", _extends({}, itemAttr('pages-item', paginationLangMsg.nextPage)), /*#__PURE__*/React.createElement("button", {
-    onClick: handleNext,
-    disabled: page === totalPage || disabled
-  }, innerIcon.next))));
+  var lessPagination = null;
+  if (pageType === 'less') {
+    lessPagination = /*#__PURE__*/React.createElement("div", {
+      className: classNames(prefixCls, 'less', {
+        bordered: bordered,
+        disabled: disabled
+      }, className),
+      style: style
+    }, Total, /*#__PURE__*/React.createElement("ul", {
+      className: "".concat(prefixCls, "-pages")
+    }, /*#__PURE__*/React.createElement("li", _extends({}, itemAttr('pages-item', paginationLangMsg.prevPage)), /*#__PURE__*/React.createElement("button", {
+      onClick: handlePrev,
+      disabled: page === 1 || disabled
+    }, innerIcon.prev)), _mapInstanceProperty(lessPages).call(lessPages, function (item, index) {
+      return /*#__PURE__*/React.createElement("li", _extends({
+        key: index
+      }, itemAttr('pages-item', String(item), item === page)), /*#__PURE__*/React.createElement("button", {
+        onClick: function onClick() {
+          return changePage(item);
+        },
+        disabled: disabled
+      }, item));
+    }), /*#__PURE__*/React.createElement("li", _extends({}, itemAttr('pages-item', paginationLangMsg.nextPage)), /*#__PURE__*/React.createElement("button", {
+      onClick: handleNext,
+      disabled: page === totalPage || disabled
+    }, innerIcon.next))));
+  }
   var nicetyPages = lessPages;
   if (totalPage >= 8) {
     nicetyPages.length = 0;

package/es/search/search-panel.d.ts

@@ -17,7 +17,7 @@ interface ItypeProps {
     label?: string;
     code?: string | number;
 }
-interface resultProps {
+export interface resultProps {
     title?: string;
     typeName?: string;
     subTitle?: string;

package/es/select/index.d.ts

@@ -5,4 +5,5 @@ interface CompoundedComponent extends React.ForwardRefExoticComponent<ISelectPro
     Option: typeof Option;
 }
 declare const Select: CompoundedComponent;
+export * from './interface';
 export default Select;

package/es/select/index.js

@@ -2,4 +2,5 @@ import InternalSelect from './select';
 import Option from './option';
 var Select = InternalSelect;
 Select.Option = Option;
+export * from './interface';
 export default Select;

package/es/tree/tree.d.ts

@@ -25,7 +25,7 @@ export interface TreeProps {
     scrollToKey?: string;
     selectedKeys?: string[];
     notFoundContent?: ReactNode;
-    loadData?: () => void;
+    loadData?: <T>(data: T) => void;
     onCheck?: (checkedKeys: string[], { checked, node, event, halfCheckedKeys }: any) => void;
     onExpand?: (expandedKeys: string[], { expanded, node }: any) => void;
     onSelect?: (keys: string[], { checked, node, event }: any) => void;

package/es/tree/treeHooks.js

@@ -67,7 +67,7 @@ export var useExpand = function useExpand(flattenAllData, expandedKeysProps, def
   }
   var initialExpandedKeys = React.useMemo(function () {
     return getInitExpandedKeys(flattenAllData, expandedKeysProps, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent, expandScrollkeys, filterTreeNode, isSearching, keysData, isInit, searchStatus);
-  }, [flattenAllData, expandedKeysProps, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent, scrollKey, filterTreeNode, isSearching, keysData, isInit, searchStatus]);
+  }, [flattenAllData, expandedKeysProps, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent, scrollKey, filterTreeNode, isSearching, keysData, isInit, searchStatus, filterValue]);
   var _React$useState7 = React.useState(initialExpandedKeys),
     _React$useState8 = _slicedToArray(_React$useState7, 2),
     expandedKeys = _React$useState8[0],

package/lib/button/index.d.ts

@@ -3,5 +3,6 @@ import Dropdown from './group';
 declare const Button: import("react").ForwardRefExoticComponent<import("./button").IButtonProps & import("react").RefAttributes<unknown>> & {
     Dropdown: typeof Dropdown;
 };
-export { ButtonType, IButtonProps } from './button';
+export { ButtonType, IButtonProps, ButtonSize, ButtonShape, ButtonIconPlace, ButtonHTMLType } from './button';
+export { OverlayType, ButtonGroupType } from './group';
 export default Button;

package/lib/carousel/index.d.ts

@@ -1,7 +1,7 @@
-import Carousel, { CarouselProps } from './carousel';
+import Carousel, { CarouselProps, DotPositionType, EffectType } from './carousel';
 import { Slidebar } from './slidebar';
 import { SlideList } from './slideList';
 import { FadeList } from './fadeList';
 export * from './carousel';
-export { CarouselProps, Slidebar, FadeList, SlideList };
+export { CarouselProps, DotPositionType, EffectType, Slidebar, FadeList, SlideList };
 export default Carousel;

package/lib/city-picker/index.d.ts

@@ -1,3 +1,5 @@
 import CityPicker from './city-picker';
+import { City, BorderType, Size, Type, CityList, CityPickerProps, ICityPickerOptionProps } from './interface';
+export { City, BorderType, Size, Type, CityList, CityPickerProps, ICityPickerOptionProps };
 export * from './city-picker';
 export default CityPicker;

package/lib/collapse/index.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
-import { CollapseProps } from './collapse';
+import { CollapseProps, IconPositionType } from './collapse';
 import Panel from './panel';
 export { PanelProps } from './panel';
 interface CompoundedComponent extends React.ForwardRefExoticComponent<CollapseProps & React.RefAttributes<HTMLElement>> {
     Panel: typeof Panel;
 }
 declare const Collapse: CompoundedComponent;
-export { Panel };
+export { Panel, IconPositionType };
 export default Collapse;

package/lib/config-provider/compDefaultProps.d.ts

@@ -192,6 +192,7 @@ declare const compDefaultProps: {
         okButtonProps: {};
         showline: boolean;
         overroll: boolean;
+        resizable: boolean;
     };
     Menu: {
         mode: string;

package/lib/config-provider/compDefaultProps.js

@@ -207,7 +207,8 @@ var compDefaultProps = {
     cancelButtonProps: {},
     okButtonProps: {},
     showline: true,
-    overroll: false
+    overroll: false,
+    resizable: false
   },
   Menu: {
     mode: 'vertical',

package/lib/input/TextArea.js

@@ -82,6 +82,10 @@ var InternalTextarea = function InternalTextarea(props, ref) {
     _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
     showNumberMark = _useState6[0],
     setShowNumberMark = _useState6[1];
+  var _useState7 = (0, _react.useState)(false),
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    numberMarkError = _useState8[0],
+    setNumberMarkError = _useState8[1];
   var resizeTextarea = (0, _react.useCallback)(function () {
     if (!autoSize || !textareaRef.current) {
       return;
@@ -129,21 +133,25 @@ var InternalTextarea = function InternalTextarea(props, ref) {
     onChange && onChange(event);
   };
   var renderNumberMark = function renderNumberMark() {
-    var enteredLength = value ? value.length : 0;
-    if (enteredLength >= maxLength) {
-      enteredLength = maxLength;
-    }
-    if (count && showNumberMark && !disabled && maxLength !== '' && maxLength >= 0) {
-      var countClass = (0, _classnames.default)("".concat(textAreaPrefixCls, "-textarea-mark"), (0, _defineProperty2.default)({}, "".concat(textAreaPrefixCls, "-textarea-mark-inner"), countPosition === 'inner'));
+    if (count && (showNumberMark || numberMarkError) && !disabled && maxLength !== '' && maxLength >= 0) {
+      var _classNames;
+      var countClass = (0, _classnames.default)("".concat(textAreaPrefixCls, "-textarea-mark"), (_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(textAreaPrefixCls, "-textarea-mark-inner"), countPosition === 'inner'), (0, _defineProperty2.default)(_classNames, "".concat(textAreaPrefixCls, "-textarea-mark-error"), numberMarkError), _classNames));
       return /*#__PURE__*/_react.default.createElement("div", {
         className: countClass
-      }, enteredLength, "/", maxLength);
+      }, value ? value.length : 0, "/", maxLength);
     }
     return null;
   };
   (0, _react.useEffect)(function () {
     resizeTextarea();
   }, [value, resizeTextarea]);
+  (0, _react.useEffect)(function () {
+    if (value && maxLength && value.length > maxLength) {
+      setNumberMarkError(true);
+    } else {
+      setNumberMarkError(false);
+    }
+  }, [value]);
   (0, _react.useEffect)(function () {
     if (propsValue !== undefined) {
       setValue(propsValue);
@@ -185,7 +193,7 @@ var InternalTextarea = function InternalTextarea(props, ref) {
       ref: textareaRef,
       disabled: disabled,
       style: (0, _extends2.default)({}, textareaStyles, hadCount || !!allowClear ? otherStyles : style),
-      className: (0, _classnames.default)("".concat(prefixCls, "-textarea"), (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, (0, _concat.default)(_context = "".concat(prefixCls, "-size-")).call(_context, size), size), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-borderless"), borderType === 'none'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-underline"), borderType === 'underline'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-no-resize"), canResize !== true), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-allowClear-spacing"), !!allowClear), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-error"), status === 'error'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-disabled"), disabled), _classNames2), (0, _defineProperty2.default)({}, className, className && !allowClear && !hadCount)),
+      className: (0, _classnames.default)("".concat(prefixCls, "-textarea"), (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, (0, _concat.default)(_context = "".concat(prefixCls, "-size-")).call(_context, size), size), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-borderless"), borderType === 'none'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-underline"), borderType === 'underline'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-no-resize"), canResize !== true), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-allowClear-spacing"), !!allowClear), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-error"), status === 'error' || numberMarkError), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-disabled"), disabled), _classNames2), (0, _defineProperty2.default)({}, className, className && !allowClear && !hadCount)),
       onChange: handleChange,
       onFocus: !disabled ? handleFocus : undefined,
       onBlur: !disabled ? handleBlur : undefined,

package/lib/input/style/index.css

@@ -215,6 +215,9 @@ textarea {
   bottom: 5px;
   right: 8px;
 }
+.kd-input-textarea-mark-error {
+  color: var(--kd-c-input-color-error, var(--kd-g-color-error, #fb2323));
+}
 .kd-input-no-resize {
   resize: none;
 }

package/lib/input/style/index.less

@@ -43,12 +43,16 @@ textarea {
       font-size: @input-small-font-size-inner;
       line-height: 18px;
       background-color: #fff;
-    }
 
-    &-mark-inner {
-      top: auto;
-      bottom: 5px;
-      right: 8px;
+      &-inner {
+        top: auto;
+        bottom: 5px;
+        right: 8px;
+      }
+
+      &-error {
+        color: @input-error-color;
+      }
     }
   }
 

package/lib/modal/modal.d.ts

@@ -44,6 +44,10 @@ export interface IModalProps {
     showline?: boolean;
     bounds?: DraggableBounds | string | false;
     overroll?: boolean;
+    resizable?: boolean;
+    onResizeStart?: (event: MouseEvent) => void;
+    onResize?: (event: MouseEvent) => void;
+    onResizeStop?: (event: MouseEvent) => void;
     onDragStart?: DraggableEventHandler;
     onDrag?: DraggableEventHandler;
     onDragStop?: DraggableEventHandler;

package/lib/modal/modal.js

@@ -40,8 +40,30 @@ var ConfirmModalTypes = ['confirm', 'normal'];
 exports.ConfirmModalTypes = ConfirmModalTypes;
 var ModalTypes = (0, _type.tuple)('confirm', 'warning', 'error', 'normal');
 exports.ModalTypes = ModalTypes;
+var DragDirection;
+(function (DragDirection) {
+  DragDirection["N"] = "n";
+  DragDirection["E"] = "e";
+  DragDirection["S"] = "s";
+  DragDirection["W"] = "w";
+  DragDirection["NE"] = "ne";
+  DragDirection["NW"] = "nw";
+  DragDirection["SE"] = "se";
+  DragDirection["SW"] = "sw";
+})(DragDirection || (DragDirection = {}));
+var initPosition = {
+  initialX: 0,
+  initialY: 0,
+  initialWidth: 0,
+  initialHeight: 0,
+  top: 0,
+  left: 0,
+  x: 0,
+  y: 0,
+  type: null
+};
 var InternalModal = function InternalModal(props, ref) {
-  var _classNames3, _classNames4, _context2, _context3, _context4;
+  var _classNames3, _classNames4, _context2, _context3, _context4, _context5, _context6, _context7, _context8, _context9, _context10, _context11, _context12;
   var _useContext = (0, _react.useContext)(_ConfigContext.default),
     getPrefixCls = _useContext.getPrefixCls,
     prefixCls = _useContext.prefixCls,
@@ -85,7 +107,8 @@ var InternalModal = function InternalModal(props, ref) {
     onDragStop = modalProps.onDragStop,
     bounds = modalProps.bounds,
     overroll = modalProps.overroll,
-    others = __rest(modalProps, ["body", "bodyClassName", "bodyStyle", "cancelButtonProps", "cancelText", "className", "closable", "closeIcon", "destroyOnClose", "draggable", "focusTriggerAfterClose", "footer", "footerClassName", "footerStyle", "footerBtnOrder", "getContainer", "height", "keyboard", "mask", "maskClosable", "maskStyle", "maskClassName", "okButtonProps", "okText", "onCancel", "onOk", "prefixCls", "title", "titleIcon", "type", "visible", "width", "showline", "onDragStart", "onDrag", "onDragStop", "bounds", "overroll"]);
+    resizable = modalProps.resizable,
+    others = __rest(modalProps, ["body", "bodyClassName", "bodyStyle", "cancelButtonProps", "cancelText", "className", "closable", "closeIcon", "destroyOnClose", "draggable", "focusTriggerAfterClose", "footer", "footerClassName", "footerStyle", "footerBtnOrder", "getContainer", "height", "keyboard", "mask", "maskClosable", "maskStyle", "maskClassName", "okButtonProps", "okText", "onCancel", "onOk", "prefixCls", "title", "titleIcon", "type", "visible", "width", "showline", "onDragStart", "onDrag", "onDragStop", "bounds", "overroll", "resizable"]);
   var isForceController = visible !== undefined;
   var _useState = (0, _react.useState)(isForceController ? visible : true),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -106,6 +129,16 @@ var InternalModal = function InternalModal(props, ref) {
     }
     modalContainer = document.body;
   }
+  var _useState3 = (0, _react.useState)(modalContainer && !overroll ? {
+      x: -(width / 2),
+      y: -(height / 2)
+    } : {
+      x: 0,
+      y: 0
+    }),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    position = _useState4[0],
+    setPosition = _useState4[1];
   (0, _hooks.useHideDocumentScrollBar)(isForceController ? !!visible : !!innerVisible, modalContainer === document.body, !!mask);
   var closeModal = (0, _react.useCallback)(function () {
     setInnerVisible(false);
@@ -196,6 +229,153 @@ var InternalModal = function InternalModal(props, ref) {
       document.body.removeEventListener('keydown', escapeToCloseModal);
     };
   }, [keyboard, escapeToCloseModal, proxyCloseModal, onCancel]);
+  var isResizing = false;
+  var initPositionRef = (0, _react.useRef)(initPosition);
+  var startResize = (0, _react.useCallback)(function (event) {
+    var targetElement = event.target;
+    if (!targetElement.classList.contains("".concat(modalPrefixCls, "-resise-handle")) || !containerRef.current) {
+      return;
+    }
+    var _containerRef$current = containerRef.current.getBoundingClientRect(),
+      initialWidth = _containerRef$current.width,
+      initialHeight = _containerRef$current.height,
+      top = _containerRef$current.top,
+      left = _containerRef$current.left;
+    initPositionRef.current = {
+      initialX: event.clientX,
+      initialY: event.clientY,
+      initialWidth: initialWidth,
+      initialHeight: initialHeight,
+      top: top,
+      left: left,
+      x: position.x,
+      y: position.y,
+      type: targetElement.dataset.type
+    };
+    event.preventDefault();
+    isResizing = true;
+    if (overroll && wrapperRef.current) {
+      wrapperRef.current.classList.add("".concat(modalPrefixCls, "-wrapper-resizable"));
+      setPosition({
+        x: left,
+        y: top
+      });
+      initPositionRef.current.x = left;
+      initPositionRef.current.y = top;
+    }
+    document.addEventListener('mousemove', resize);
+    document.addEventListener('mouseup', stopResize);
+  }, [position]);
+  (0, _react.useEffect)(function () {
+    if (containerRef.current && visible) {
+      containerRef.current.addEventListener('mousedown', startResize);
+    }
+    return function () {
+      if (containerRef.current) {
+        containerRef.current.removeEventListener('mousedown', startResize);
+      }
+    };
+  }, [containerRef, startResize, visible]);
+  var resize = function resize(event) {
+    if (!containerRef.current) return;
+    if (!isResizing || !containerRef.current) return;
+    var _initPositionRef$curr = initPositionRef.current,
+      initialX = _initPositionRef$curr.initialX,
+      initialY = _initPositionRef$curr.initialY,
+      initialHeight = _initPositionRef$curr.initialHeight,
+      initialWidth = _initPositionRef$curr.initialWidth,
+      y = _initPositionRef$curr.y,
+      x = _initPositionRef$curr.x,
+      type = _initPositionRef$curr.type;
+    var curNHeight = initialY - event.clientY;
+    var curSHeight = -curNHeight;
+    var curEWidth = event.clientX - initialX;
+    var curWWidth = -curEWidth;
+    switch (type) {
+      case DragDirection.N:
+        {
+          containerRef.current.style.height = "".concat(curNHeight + initialHeight, "px");
+          setPosition(function (pre) {
+            return {
+              y: y - curNHeight,
+              x: pre.x
+            };
+          });
+          break;
+        }
+      case DragDirection.E:
+        {
+          containerRef.current.style.width = "".concat(curEWidth + initialWidth, "px");
+          break;
+        }
+      case DragDirection.S:
+        {
+          containerRef.current.style.height = "".concat(curSHeight + initialHeight, "px");
+          break;
+        }
+      case DragDirection.W:
+        {
+          containerRef.current.style.width = "".concat(curWWidth + initialWidth, "px");
+          setPosition(function (pre) {
+            return {
+              y: pre.y,
+              x: x - curWWidth
+            };
+          });
+          break;
+        }
+      case DragDirection.NE:
+        {
+          containerRef.current.style.height = "".concat(curNHeight + initialHeight, "px");
+          containerRef.current.style.width = "".concat(curEWidth + initialWidth, "px");
+          setPosition(function (pre) {
+            return {
+              y: y - curNHeight,
+              x: pre.x
+            };
+          });
+          break;
+        }
+      case DragDirection.NW:
+        {
+          containerRef.current.style.height = "".concat(curNHeight + initialHeight, "px");
+          containerRef.current.style.width = "".concat(curWWidth + initialWidth, "px");
+          setPosition({
+            y: y - curNHeight,
+            x: x - curWWidth
+          });
+          break;
+        }
+      case DragDirection.SE:
+        {
+          containerRef.current.style.height = "".concat(curSHeight + initialHeight, "px");
+          containerRef.current.style.width = "".concat(curEWidth + initialWidth, "px");
+          break;
+        }
+      case DragDirection.SW:
+        {
+          containerRef.current.style.width = "".concat(curWWidth + initialWidth, "px");
+          containerRef.current.style.height = "".concat(curSHeight + initialHeight, "px");
+          setPosition(function (pre) {
+            return {
+              y: pre.y,
+              x: x - curWWidth
+            };
+          });
+          break;
+        }
+      default:
+        {
+          break;
+        }
+    }
+  };
+  var stopResize = function stopResize() {
+    isResizing = false;
+    initPositionRef.current = initPosition;
+    document.removeEventListener('mousemove', resize);
+    document.removeEventListener('mouseup', stopResize);
+  };
   var handleMaskClick = (0, _react.useCallback)(function () {
     if (maskClosable) {
       proxyCloseModal(onCancel);
@@ -218,7 +398,31 @@ var InternalModal = function InternalModal(props, ref) {
     ref: containerRef,
     tabIndex: -1,
     onKeyDown: enterToCloseModal
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, resizable && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+    "data-type": "n",
+    className: (0, _concat.default)(_context2 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context2, modalPrefixCls, "-resise-n")
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    "data-type": "e",
+    className: (0, _concat.default)(_context3 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context3, modalPrefixCls, "-resise-e")
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    "data-type": "s",
+    className: (0, _concat.default)(_context4 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context4, modalPrefixCls, "-resise-s")
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    "data-type": "w",
+    className: (0, _concat.default)(_context5 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context5, modalPrefixCls, "-resise-w")
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    "data-type": "ne",
+    className: (0, _concat.default)(_context6 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context6, modalPrefixCls, "-resise-ne")
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    "data-type": "se",
+    className: (0, _concat.default)(_context7 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context7, modalPrefixCls, "-resise-se")
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    "data-type": "sw",
+    className: (0, _concat.default)(_context8 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context8, modalPrefixCls, "-resise-sw")
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    "data-type": "nw",
+    className: (0, _concat.default)(_context9 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context9, modalPrefixCls, "-resise-nw")
+  })), /*#__PURE__*/_react.default.createElement("div", {
     className: headerClass
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "".concat(modalPrefixCls, "-title-container")
@@ -237,7 +441,7 @@ var InternalModal = function InternalModal(props, ref) {
     className: (0, _classnames.default)("".concat(modalPrefixCls, "-body"), bodyClassName),
     style: bodyStyle
   }, body), footer !== null && /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)("".concat(modalPrefixCls, "-footer"), (0, _concat.default)(_context2 = "".concat(modalPrefixCls, "-")).call(_context2, type, "-footer"), footerClassName),
+    className: (0, _classnames.default)("".concat(modalPrefixCls, "-footer"), (0, _concat.default)(_context10 = "".concat(modalPrefixCls, "-")).call(_context10, type, "-footer"), footerClassName),
     style: (0, _extends2.default)({
       flexDirection: !footer && (!footerBtnOrder || footerBtnOrder === 'normal') ? 'row' : 'row-reverse'
     }, footerStyle || {})
@@ -247,12 +451,12 @@ var InternalModal = function InternalModal(props, ref) {
   var handleDragStart = function handleDragStart(e, data) {
     onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(e, data);
   };
-  var defaultPosition = modalContainer ? {
-    x: -(width / 2),
-    y: -(height / 2)
-  } : {
-    x: 0,
-    y: 0
+  var handleDrag = function handleDrag(e, ui) {
+    setPosition({
+      x: ui.x,
+      y: ui.y
+    });
+    onDrag === null || onDrag === void 0 ? void 0 : onDrag(e, ui);
   };
   var comp = /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
     className: modalClasses
@@ -264,30 +468,27 @@ var InternalModal = function InternalModal(props, ref) {
     tabIndex: -1,
     className: (0, _classnames.default)((0, _defineProperty2.default)({}, "".concat(modalPrefixCls, "-wrapper"), modalContainer && ((isForceController ? visible : innerVisible) || !destroyOnClose))),
     ref: wrapperRef,
-    onClick: handleWrapperClick
+    onMouseDown: handleWrapperClick
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "".concat(modalPrefixCls, "-dialog")
   }, /*#__PURE__*/_react.default.createElement(_reactDraggable.default, {
-    defaultPosition: {
-      x: 0,
-      y: 0
-    },
+    position: position,
     handle: ".".concat(headerClass),
     disabled: !draggable,
     onStart: handleDragStart,
-    onDrag: onDrag,
+    onDrag: handleDrag,
     onStop: onDragStop,
     bounds: bounds,
-    cancel: (0, _concat.default)(_context3 = ".".concat(modalPrefixCls, "-title-container, .")).call(_context3, modalPrefixCls, "-close-icon")
+    cancel: (0, _concat.default)(_context11 = ".".concat(modalPrefixCls, "-title-container, .")).call(_context11, modalPrefixCls, "-close-icon")
   }, container))) : /*#__PURE__*/_react.default.createElement(_reactDraggable.default, {
-    defaultPosition: defaultPosition,
     handle: ".".concat(headerClass),
     disabled: !draggable,
+    position: position,
     onStart: handleDragStart,
-    onDrag: onDrag,
+    onDrag: handleDrag,
     onStop: onDragStop,
     bounds: bounds,
-    cancel: (0, _concat.default)(_context4 = ".".concat(modalPrefixCls, "-title-container, .")).call(_context4, modalPrefixCls, "-close-icon")
+    cancel: (0, _concat.default)(_context12 = ".".concat(modalPrefixCls, "-title-container, .")).call(_context12, modalPrefixCls, "-close-icon")
   }, container));
   var renderComp = ((isForceController ? visible : innerVisible) || !destroyOnClose) && comp;
   if (modalContainer && renderComp) return /*#__PURE__*/_reactDom.default.createPortal(renderComp, modalContainer);