@kdcloudjs/kdesign 1.7.39 → 1.7.41

package/es/modal/modal.js

@@ -26,8 +26,30 @@ import { getLangMsg } from '../locale/locale';
 import { useHideDocumentScrollBar } from '../_utils/hooks';
 export var ConfirmModalTypes = ['confirm', 'normal'];
 export var ModalTypes = tuple('confirm', 'warning', 'error', 'normal');
+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;
+  var _classNames3, _classNames4, _context2, _context3, _context4, _context5, _context6, _context7, _context8, _context9, _context10, _context11, _context12;
   var _useContext = useContext(ConfigContext),
     getPrefixCls = _useContext.getPrefixCls,
     prefixCls = _useContext.prefixCls,
@@ -70,7 +92,9 @@ var InternalModal = function InternalModal(props, ref) {
     onDrag = modalProps.onDrag,
     onDragStop = modalProps.onDragStop,
     bounds = modalProps.bounds,
-    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 = modalProps.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 = useState(isForceController ? visible : true),
     _useState2 = _slicedToArray(_useState, 2),
@@ -78,6 +102,7 @@ var InternalModal = function InternalModal(props, ref) {
     setInnerVisible = _useState2[1]; // 需要根据visible来判断，不能一开始为true再去设置false
   var previousActiveElement = useRef(null);
   var innerRef = useRef(null);
+  var wrapperRef = useRef(null);
   var containerRef = ref || innerRef;
   var modalPrefixCls = getPrefixCls(prefixCls, 'modal', customPrefixcls);
   devWarning(ModalTypes.indexOf(type) === -1, 'modal', "cannot found modal type '".concat(type, "'"));
@@ -90,6 +115,16 @@ var InternalModal = function InternalModal(props, ref) {
     }
     modalContainer = document.body;
   }
+  var _useState3 = useState(modalContainer && !overroll ? {
+      x: -(width / 2),
+      y: -(height / 2)
+    } : {
+      x: 0,
+      y: 0
+    }),
+    _useState4 = _slicedToArray(_useState3, 2),
+    position = _useState4[0],
+    setPosition = _useState4[1];
   useHideDocumentScrollBar(isForceController ? !!visible : !!innerVisible, modalContainer === document.body, !!mask);
   var closeModal = useCallback(function () {
     setInnerVisible(false);
@@ -180,16 +215,168 @@ var InternalModal = function InternalModal(props, ref) {
       document.body.removeEventListener('keydown', escapeToCloseModal);
     };
   }, [keyboard, escapeToCloseModal, proxyCloseModal, onCancel]);
+  var isResizing = false;
+  var initPositionRef = useRef(initPosition);
+  var startResize = 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]);
+  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 = useCallback(function () {
     if (maskClosable) {
       proxyCloseModal(onCancel);
     }
   }, [proxyCloseModal, onCancel, maskClosable]);
+  var handleWrapperClick = function handleWrapperClick(e) {
+    if (wrapperRef.current === e.target) {
+      handleMaskClick();
+    }
+  };
   var isHidden = !destroyOnClose && !(isForceController ? visible : innerVisible);
   var modalClasses = classNames(modalPrefixCls, className, (_classNames3 = {}, _defineProperty(_classNames3, "".concat(modalPrefixCls, "-container"), true), _defineProperty(_classNames3, "".concat(modalPrefixCls, "-container-hidden"), isHidden), _defineProperty(_classNames3, "".concat(modalPrefixCls, "-container-show"), !isHidden), _classNames3));
   var headerClass = "".concat(modalPrefixCls, "-header");
   var container = /*#__PURE__*/React.createElement("div", {
-    className: classNames((_classNames4 = {}, _defineProperty(_classNames4, "".concat(modalPrefixCls, "-container-box"), true), _defineProperty(_classNames4, "".concat(modalPrefixCls, "-has-container-box"), modalContainer), _defineProperty(_classNames4, "".concat(modalPrefixCls, "-showline"), showline), _classNames4)),
+    className: classNames((_classNames4 = {}, _defineProperty(_classNames4, "".concat(modalPrefixCls, "-container-box"), true), _defineProperty(_classNames4, "".concat(modalPrefixCls, "-has-container-box"), modalContainer && !overroll), _defineProperty(_classNames4, "".concat(modalPrefixCls, "-showline"), showline), _classNames4)),
     style: {
       width: width,
       height: height
@@ -197,7 +384,31 @@ var InternalModal = function InternalModal(props, ref) {
     ref: containerRef,
     tabIndex: -1,
     onKeyDown: enterToCloseModal
-  }, /*#__PURE__*/React.createElement("div", {
+  }, resizable && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    "data-type": "n",
+    className: _concatInstanceProperty(_context2 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context2, modalPrefixCls, "-resise-n")
+  }), /*#__PURE__*/React.createElement("div", {
+    "data-type": "e",
+    className: _concatInstanceProperty(_context3 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context3, modalPrefixCls, "-resise-e")
+  }), /*#__PURE__*/React.createElement("div", {
+    "data-type": "s",
+    className: _concatInstanceProperty(_context4 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context4, modalPrefixCls, "-resise-s")
+  }), /*#__PURE__*/React.createElement("div", {
+    "data-type": "w",
+    className: _concatInstanceProperty(_context5 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context5, modalPrefixCls, "-resise-w")
+  }), /*#__PURE__*/React.createElement("div", {
+    "data-type": "ne",
+    className: _concatInstanceProperty(_context6 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context6, modalPrefixCls, "-resise-ne")
+  }), /*#__PURE__*/React.createElement("div", {
+    "data-type": "se",
+    className: _concatInstanceProperty(_context7 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context7, modalPrefixCls, "-resise-se")
+  }), /*#__PURE__*/React.createElement("div", {
+    "data-type": "sw",
+    className: _concatInstanceProperty(_context8 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context8, modalPrefixCls, "-resise-sw")
+  }), /*#__PURE__*/React.createElement("div", {
+    "data-type": "nw",
+    className: _concatInstanceProperty(_context9 = "".concat(modalPrefixCls, "-resise-handle ")).call(_context9, modalPrefixCls, "-resise-nw")
+  })), /*#__PURE__*/React.createElement("div", {
     className: headerClass
   }, /*#__PURE__*/React.createElement("div", {
     className: "".concat(modalPrefixCls, "-title-container")
@@ -216,7 +427,7 @@ var InternalModal = function InternalModal(props, ref) {
     className: classNames("".concat(modalPrefixCls, "-body"), bodyClassName),
     style: bodyStyle
   }, body), footer !== null && /*#__PURE__*/React.createElement("div", {
-    className: classNames("".concat(modalPrefixCls, "-footer"), _concatInstanceProperty(_context2 = "".concat(modalPrefixCls, "-")).call(_context2, type, "-footer"), footerClassName),
+    className: classNames("".concat(modalPrefixCls, "-footer"), _concatInstanceProperty(_context10 = "".concat(modalPrefixCls, "-")).call(_context10, type, "-footer"), footerClassName),
     style: _extends({
       flexDirection: !footer && (!footerBtnOrder || footerBtnOrder === 'normal') ? 'row' : 'row-reverse'
     }, footerStyle || {})
@@ -226,12 +437,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.createElement("div", _extends({
     className: modalClasses
@@ -239,15 +450,31 @@ var InternalModal = function InternalModal(props, ref) {
     onClick: handleMaskClick,
     className: classNames(maskClassName, _defineProperty({}, "".concat(modalPrefixCls, "-mask"), true)),
     style: maskStyle
-  }), /*#__PURE__*/React.createElement(Draggable, {
-    defaultPosition: defaultPosition,
+  }), overroll ? /*#__PURE__*/React.createElement("div", {
+    tabIndex: -1,
+    className: classNames(_defineProperty({}, "".concat(modalPrefixCls, "-wrapper"), modalContainer && ((isForceController ? visible : innerVisible) || !destroyOnClose))),
+    ref: wrapperRef,
+    onMouseDown: handleWrapperClick
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(modalPrefixCls, "-dialog")
+  }, /*#__PURE__*/React.createElement(Draggable, {
+    position: position,
+    handle: ".".concat(headerClass),
+    disabled: !draggable,
+    onStart: handleDragStart,
+    onDrag: handleDrag,
+    onStop: onDragStop,
+    bounds: bounds,
+    cancel: _concatInstanceProperty(_context11 = ".".concat(modalPrefixCls, "-title-container, .")).call(_context11, modalPrefixCls, "-close-icon")
+  }, container))) : /*#__PURE__*/React.createElement(Draggable, {
     handle: ".".concat(headerClass),
     disabled: !draggable,
+    position: position,
     onStart: handleDragStart,
-    onDrag: onDrag,
+    onDrag: handleDrag,
     onStop: onDragStop,
     bounds: bounds,
-    cancel: _concatInstanceProperty(_context3 = ".".concat(modalPrefixCls, "-title-container, .")).call(_context3, modalPrefixCls, "-close-icon")
+    cancel: _concatInstanceProperty(_context12 = ".".concat(modalPrefixCls, "-title-container, .")).call(_context12, modalPrefixCls, "-close-icon")
   }, container));
   var renderComp = ((isForceController ? visible : innerVisible) || !destroyOnClose) && comp;
   if (modalContainer && renderComp) return /*#__PURE__*/ReactDOM.createPortal(renderComp, modalContainer);

package/es/modal/style/index.css

@@ -249,9 +249,95 @@
   -ms-flex-negative: 0;
       flex-shrink: 0;
 }
+.kd-modal-container-box .kd-modal-resise-handle {
+  position: absolute;
+}
+.kd-modal-container-box .kd-modal-resise-n {
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 6px;
+  cursor: ns-resize;
+}
+.kd-modal-container-box .kd-modal-resise-e {
+  top: 0;
+  right: 0;
+  height: 100%;
+  width: 6px;
+  cursor: ew-resize;
+}
+.kd-modal-container-box .kd-modal-resise-s {
+  bottom: 0;
+  left: 0;
+  height: 6px;
+  width: 100%;
+  cursor: ns-resize;
+}
+.kd-modal-container-box .kd-modal-resise-w {
+  left: 0;
+  top: 0;
+  height: 100%;
+  width: 6px;
+  cursor: ew-resize;
+}
+.kd-modal-container-box .kd-modal-resise-ne {
+  top: 0;
+  right: 0;
+  width: 6px;
+  height: 6px;
+  cursor: nesw-resize;
+}
+.kd-modal-container-box .kd-modal-resise-se {
+  bottom: 0;
+  right: 0;
+  width: 6px;
+  height: 6px;
+  cursor: nwse-resize;
+}
+.kd-modal-container-box .kd-modal-resise-sw {
+  bottom: 0;
+  left: 0;
+  width: 6px;
+  height: 6px;
+  cursor: nesw-resize;
+}
+.kd-modal-container-box .kd-modal-resise-nw {
+  top: 0;
+  left: 0;
+  width: 6px;
+  height: 6px;
+  cursor: nwse-resize;
+}
 .kd-modal-margin-btn {
   margin-right: var(--kd-c-modal-footer-button-spacing, 12px);
 }
+.kd-modal-wrapper {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  overflow: auto;
+  text-align: center;
+}
+.kd-modal-wrapper::before {
+  display: inline-block;
+  width: 0;
+  height: 100%;
+  vertical-align: middle;
+  content: '';
+}
+.kd-modal-wrapper-resizable {
+  text-align: unset;
+}
+.kd-modal-wrapper-resizable::before {
+  height: 0;
+}
+.kd-modal-dialog {
+  display: inline-block;
+  vertical-align: middle;
+  max-width: calc(100vw);
+}
 .kd-modal-showline .kd-modal-header {
   border-bottom: var(--kd-c-modal-sizing-border, 1px) solid var(--kd-c-modal-color-border, var(--kd-g-color-border-strong-2, #d9d9d9));
 }

package/es/modal/style/index.less

@@ -29,15 +29,13 @@
     }
 
     &-hidden {
-      display: none
+      display: none;
     }
   }
   &-mask {
     .overlay(@modal-mask-color-background, 0);
   }
-  // &-mask + &-container-box {
 
-  // }
   &-has-container-box {
     position: fixed;
     left: 50%;
@@ -116,16 +114,104 @@
       color: @modal-footer-font-color;
       flex-shrink: 0;
     }
-    // each(@modal-footer-type-set, {
-    //   .@{modal-prefix-cls}-@{key}-footer {
-    //     justify-content: @value;
-    //   }
-    // });
+
+    .@{modal-prefix-cls}-resise {
+      &-handle {
+        position: absolute;
+      }
+
+      &-n {
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 6px;
+        cursor: ns-resize;
+      }
+      &-e {
+        top: 0;
+        right: 0;
+        height: 100%;
+        width: 6px;
+        cursor: ew-resize;
+      }
+      &-s {
+        bottom: 0;
+        left: 0;
+        height: 6px;
+        width: 100%;
+        cursor: ns-resize;
+      }
+      &-w {
+        left: 0;
+        top: 0;
+        height: 100%;
+        width: 6px;
+        cursor: ew-resize;
+      }
+      &-ne {
+        top: 0;
+        right: 0;
+        width: 6px;
+        height: 6px;
+        cursor: nesw-resize;
+      }
+      &-se {
+        bottom: 0;
+        right: 0;
+        width: 6px;
+        height: 6px;
+        cursor: nwse-resize;
+      }
+      &-sw {
+        bottom: 0;
+        left: 0;
+        width: 6px;
+        height: 6px;
+        cursor: nesw-resize;
+      }
+      &-nw {
+        top: 0;
+        left: 0;
+        width: 6px;
+        height: 6px;
+        cursor: nwse-resize;
+      }
+    }
   }
 
   &-margin-btn {
     margin-right: @modal-footer-button-spacing;
   }
+
+  &-wrapper {
+    position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    overflow: auto;
+    text-align: center;
+
+    &::before {
+      display: inline-block;
+      width: 0;
+      height: 100%;
+      vertical-align: middle;
+      content: '';
+    }
+
+    &-resizable {
+      text-align: unset;
+      &::before {
+        height: 0;
+      }
+    }
+  }
+  &-dialog {
+    display: inline-block;
+    vertical-align: middle;
+    max-width: calc(100vw);
+  }
 }
 
 .@{modal-prefix-cls}-showline {
@@ -135,4 +221,4 @@
   .@{modal-prefix-cls}-footer {
     border-top: @modal-border-width solid @modal-border-color;
   }
-}
+}

package/es/notification-base/notice.js

@@ -25,6 +25,7 @@ var Notice = function Notice(props) {
     key = noticeProps.key;
   var noticePrefixCls = getPrefixCls(prefixCls, suffixCls, customPrefixcls);
   var timer = null;
+  var isTransition = false;
   var noticeRef = useRef();
   var noticeClasses = classNames(noticePrefixCls, className, (_classNames = {}, _defineProperty(_classNames, _concatInstanceProperty(_context = "".concat(noticePrefixCls, "-")).call(_context, type), type), _defineProperty(_classNames, "".concat(noticePrefixCls, "-closable"), closable), _classNames));
   var animationEvent = function animationEvent() {
@@ -33,7 +34,10 @@ var Notice = function Notice(props) {
     (_b = noticeRef.current) === null || _b === void 0 ? void 0 : _b.classList.add("".concat(noticePrefixCls, "-leave-after"));
   };
   var transitionEvent = function transitionEvent() {
-    onClose && onClose(key);
+    if (!isTransition) {
+      onClose && onClose(key);
+    }
+    isTransition = true;
   };
   var clearEventListener = function clearEventListener() {
     var _a, _b;
@@ -42,6 +46,7 @@ var Notice = function Notice(props) {
   };
   var handleClose = function handleClose() {
     var _a, _b, _c;
+    isTransition = false;
     (_a = noticeRef.current) === null || _a === void 0 ? void 0 : _a.classList.add("".concat(noticePrefixCls, "-leave"));
     (_b = noticeRef.current) === null || _b === void 0 ? void 0 : _b.addEventListener('animationend', animationEvent);
     (_c = noticeRef.current) === null || _c === void 0 ? void 0 : _c.addEventListener('transitionend', transitionEvent);

package/es/qr-code/index.d.ts

@@ -0,0 +1,3 @@
+import QRCode from './qr-code';
+export * from './qr-code';
+export default QRCode;

package/es/qr-code/index.js

@@ -0,0 +1,3 @@
+import QRCode from './qr-code';
+export * from './qr-code';
+export default QRCode;

package/es/qr-code/qr-code.d.ts

@@ -0,0 +1,42 @@
+import React, { CSSProperties, FunctionComponentElement } from 'react';
+export declare type QRPropsCanvas = QRProps & React.CanvasHTMLAttributes<HTMLCanvasElement>;
+export declare type QRPropsSvg = QRProps & React.SVGAttributes<SVGSVGElement>;
+export declare const QRCodeTypes: ["canvas", "svg"];
+export declare type QRCodeType = typeof QRCodeTypes[number];
+export declare const QRCodeStatus: ["active", "expired", "loading"];
+export declare type QRCodeStatus = typeof QRCodeStatus[number];
+export declare const QRCodeErrorLevels: ["L", "M", "Q", "H"];
+export declare type QRCodeErrorLevel = typeof QRCodeErrorLevels[number];
+interface ImageSettings {
+    src: string;
+    height: number;
+    width: number;
+    excavate: boolean;
+    x?: number;
+    y?: number;
+}
+export interface QRProps {
+    value: string;
+    type?: QRCodeType;
+    size?: number;
+    style?: CSSProperties;
+    color?: string;
+    bgColor?: string;
+    bordered?: boolean;
+    imageSettings?: ImageSettings;
+}
+export interface QRCodeProps extends QRProps {
+    className?: string;
+    prefixCls?: string;
+    icon?: string;
+    iconSize?: number;
+    status?: QRCodeStatus;
+    errorLevel?: QRCodeErrorLevel;
+    children?: React.ReactNode;
+    onRefresh?: () => void;
+}
+declare const QRCode: {
+    (props: QRCodeProps): FunctionComponentElement<QRCodeProps>;
+    displayName: string;
+};
+export default QRCode;