antd3-esm 1.0.1

package/dist/antd/es/drawer.js

@@ -0,0 +1,1115 @@
+import { n, c as classNames, s as withConfigConsumer, h as createReactContext } from '../../config-provider.js';
+import * as React from 'react';
+import { g as getScrollBarSize, P as Portal } from '../../PortalWrapper.js';
+import { p as polyfill, K as KeyCode } from '../../menu.js';
+import { o as omit, t as tuple } from '../../input.js';
+import { I as Icon } from '../../icon.js';
+import 'react-dom';
+
+var css = "/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */\n/* stylelint-disable no-duplicate-selectors */\n/* stylelint-disable */\n/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */\n.ant-drawer {\n  position: fixed;\n  z-index: 1000;\n  width: 0%;\n  height: 100%;\n  transition: transform 0.3s cubic-bezier(0.7, 0.3, 0.1, 1), height 0s ease 0.3s, width 0s ease 0.3s;\n}\n.ant-drawer > * {\n  transition: transform 0.3s cubic-bezier(0.7, 0.3, 0.1, 1), box-shadow 0.3s cubic-bezier(0.7, 0.3, 0.1, 1);\n}\n.ant-drawer-content-wrapper {\n  position: absolute;\n}\n.ant-drawer .ant-drawer-content {\n  width: 100%;\n  height: 100%;\n}\n.ant-drawer-left,\n.ant-drawer-right {\n  top: 0;\n  width: 0%;\n  height: 100%;\n}\n.ant-drawer-left .ant-drawer-content-wrapper,\n.ant-drawer-right .ant-drawer-content-wrapper {\n  height: 100%;\n}\n.ant-drawer-left.ant-drawer-open,\n.ant-drawer-right.ant-drawer-open {\n  width: 100%;\n  transition: transform 0.3s cubic-bezier(0.7, 0.3, 0.1, 1);\n}\n.ant-drawer-left.ant-drawer-open.no-mask,\n.ant-drawer-right.ant-drawer-open.no-mask {\n  width: 0%;\n}\n.ant-drawer-left.ant-drawer-open .ant-drawer-content-wrapper {\n  box-shadow: 2px 0 8px rgba(0, 0, 0, 0.15);\n}\n.ant-drawer-right {\n  right: 0;\n}\n.ant-drawer-right .ant-drawer-content-wrapper {\n  right: 0;\n}\n.ant-drawer-right.ant-drawer-open .ant-drawer-content-wrapper {\n  box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);\n}\n.ant-drawer-right.ant-drawer-open.no-mask {\n  right: 1px;\n  transform: translateX(1px);\n}\n.ant-drawer-top,\n.ant-drawer-bottom {\n  left: 0;\n  width: 100%;\n  height: 0%;\n}\n.ant-drawer-top .ant-drawer-content-wrapper,\n.ant-drawer-bottom .ant-drawer-content-wrapper {\n  width: 100%;\n}\n.ant-drawer-top.ant-drawer-open,\n.ant-drawer-bottom.ant-drawer-open {\n  height: 100%;\n  transition: transform 0.3s cubic-bezier(0.7, 0.3, 0.1, 1);\n}\n.ant-drawer-top.ant-drawer-open.no-mask,\n.ant-drawer-bottom.ant-drawer-open.no-mask {\n  height: 0%;\n}\n.ant-drawer-top {\n  top: 0;\n}\n.ant-drawer-top.ant-drawer-open .ant-drawer-content-wrapper {\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n}\n.ant-drawer-bottom {\n  bottom: 0;\n}\n.ant-drawer-bottom .ant-drawer-content-wrapper {\n  bottom: 0;\n}\n.ant-drawer-bottom.ant-drawer-open .ant-drawer-content-wrapper {\n  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.15);\n}\n.ant-drawer-bottom.ant-drawer-open.no-mask {\n  bottom: 1px;\n  transform: translateY(1px);\n}\n.ant-drawer.ant-drawer-open .ant-drawer-mask {\n  height: 100%;\n  opacity: 1;\n  transition: none;\n  animation: antdDrawerFadeIn 0.3s cubic-bezier(0.7, 0.3, 0.1, 1);\n}\n.ant-drawer-title {\n  margin: 0;\n  color: rgba(0, 0, 0, 0.85);\n  font-weight: 500;\n  font-size: 16px;\n  line-height: 22px;\n}\n.ant-drawer-content {\n  position: relative;\n  z-index: 1;\n  overflow: auto;\n  background-color: #fff;\n  background-clip: padding-box;\n  border: 0;\n}\n.ant-drawer-close {\n  position: absolute;\n  top: 0;\n  right: 0;\n  z-index: 10;\n  display: block;\n  width: 56px;\n  height: 56px;\n  padding: 0;\n  color: rgba(0, 0, 0, 0.45);\n  font-weight: 700;\n  font-size: 16px;\n  font-style: normal;\n  line-height: 56px;\n  text-align: center;\n  text-transform: none;\n  text-decoration: none;\n  background: transparent;\n  border: 0;\n  outline: 0;\n  cursor: pointer;\n  transition: color 0.3s;\n  text-rendering: auto;\n}\n.ant-drawer-close:focus,\n.ant-drawer-close:hover {\n  color: rgba(0, 0, 0, 0.75);\n  text-decoration: none;\n}\n.ant-drawer-header {\n  position: relative;\n  padding: 16px 24px;\n  color: rgba(0, 0, 0, 0.65);\n  background: #fff;\n  border-bottom: 1px solid #e8e8e8;\n  border-radius: 4px 4px 0 0;\n}\n.ant-drawer-header-no-title {\n  color: rgba(0, 0, 0, 0.65);\n  background: #fff;\n}\n.ant-drawer-body {\n  padding: 24px;\n  font-size: 14px;\n  line-height: 1.5;\n  word-wrap: break-word;\n}\n.ant-drawer-wrapper-body {\n  height: 100%;\n  overflow: auto;\n}\n.ant-drawer-mask {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 0;\n  background-color: rgba(0, 0, 0, 0.45);\n  opacity: 0;\n  filter: alpha(opacity=45);\n  transition: opacity 0.3s linear, height 0s ease 0.3s;\n}\n.ant-drawer-open-content {\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n}\n@keyframes antdDrawerFadeIn {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n/*# sourceMappingURL=index.css.map */";
+n(css,{"prepend":true});
+
+function dataToArray(vars) {
+  if (Array.isArray(vars)) {
+    return vars;
+  }
+
+  return [vars];
+}
+var transitionEndObject = {
+  transition: 'transitionend',
+  WebkitTransition: 'webkitTransitionEnd',
+  MozTransition: 'transitionend',
+  OTransition: 'oTransitionEnd otransitionend'
+};
+var transitionStr = Object.keys(transitionEndObject).filter(function (key) {
+  if (typeof document === 'undefined') {
+    return false;
+  }
+
+  var html = document.getElementsByTagName('html')[0];
+  return key in (html ? html.style : {});
+})[0];
+var transitionEnd = transitionEndObject[transitionStr];
+function addEventListener(target, eventType, callback, options) {
+  if (target.addEventListener) {
+    target.addEventListener(eventType, callback, options);
+  } else if (target.attachEvent) {
+    // tslint:disable-line
+    target.attachEvent("on".concat(eventType), callback); // tslint:disable-line
+  }
+}
+function removeEventListener(target, eventType, callback, options) {
+  if (target.removeEventListener) {
+    target.removeEventListener(eventType, callback, options);
+  } else if (target.attachEvent) {
+    // tslint:disable-line
+    target.detachEvent("on".concat(eventType), callback); // tslint:disable-line
+  }
+}
+function transformArguments(arg, cb) {
+  var result = typeof arg === 'function' ? arg(cb) : arg;
+
+  if (Array.isArray(result)) {
+    if (result.length === 2) {
+      return result;
+    }
+
+    return [result[0], result[1]];
+  }
+
+  return [result];
+}
+var isNumeric = function isNumeric(value) {
+  return !isNaN(parseFloat(value)) && isFinite(value);
+};
+var windowIsUndefined = !(typeof window !== 'undefined' && window.document && window.document.createElement);
+var getTouchParentScroll = function getTouchParentScroll(root, currentTarget, differX, differY) {
+  if (!currentTarget || currentTarget === document || currentTarget instanceof Document) {
+    return false;
+  } // root 为 drawer-content 设定了 overflow, 判断为 root 的 parent 时结束滚动；
+
+
+  if (currentTarget === root.parentNode) {
+    return true;
+  }
+
+  var isY = Math.max(Math.abs(differX), Math.abs(differY)) === Math.abs(differY);
+  var isX = Math.max(Math.abs(differX), Math.abs(differY)) === Math.abs(differX);
+  var scrollY = currentTarget.scrollHeight - currentTarget.clientHeight;
+  var scrollX = currentTarget.scrollWidth - currentTarget.clientWidth;
+  var style = document.defaultView.getComputedStyle(currentTarget);
+  var overflowY = style.overflowY === 'auto' || style.overflowY === 'scroll';
+  var overflowX = style.overflowX === 'auto' || style.overflowX === 'scroll';
+  var y = scrollY && overflowY;
+  var x = scrollX && overflowX;
+
+  if (isY && (!y || y && (currentTarget.scrollTop >= scrollY && differY < 0 || currentTarget.scrollTop <= 0 && differY > 0)) || isX && (!x || x && (currentTarget.scrollLeft >= scrollX && scrollX < 0 || currentTarget.scrollLeft <= 0 && scrollX > 0))) {
+    return getTouchParentScroll(root, currentTarget.parentNode, differX, differY);
+  }
+
+  return false;
+};
+
+function _typeof$2(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$2 = function _typeof(obj) { return typeof obj; }; } else { _typeof$2 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$2(obj); }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _objectWithoutProperties$1(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$1(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose$1(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function _classCallCheck$2(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties$2(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass$2(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$2(Constructor.prototype, protoProps); if (staticProps) _defineProperties$2(Constructor, staticProps); return Constructor; }
+
+function _possibleConstructorReturn$2(self, call) { if (call && (_typeof$2(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$2(self); }
+
+function _getPrototypeOf$2(o) { _getPrototypeOf$2 = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf$2(o); }
+
+function _assertThisInitialized$2(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _inherits$2(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf$2(subClass, superClass); }
+
+function _setPrototypeOf$2(o, p) { _setPrototypeOf$2 = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf$2(o, p); }
+var currentDrawer = {};
+
+var DrawerChild =
+/*#__PURE__*/
+function (_React$Component) {
+  _inherits$2(DrawerChild, _React$Component);
+
+  function DrawerChild(props) {
+    var _this;
+
+    _classCallCheck$2(this, DrawerChild);
+
+    _this = _possibleConstructorReturn$2(this, _getPrototypeOf$2(DrawerChild).call(this, props));
+
+    _this.domFocus = function () {
+      if (_this.dom) {
+        _this.dom.focus();
+      }
+    };
+
+    _this.removeStartHandler = function (e) {
+      if (e.touches.length > 1) {
+        return;
+      }
+
+      _this.startPos = {
+        x: e.touches[0].clientX,
+        y: e.touches[0].clientY
+      };
+    };
+
+    _this.removeMoveHandler = function (e) {
+      if (e.changedTouches.length > 1) {
+        return;
+      }
+
+      var currentTarget = e.currentTarget;
+      var differX = e.changedTouches[0].clientX - _this.startPos.x;
+      var differY = e.changedTouches[0].clientY - _this.startPos.y;
+
+      if (currentTarget === _this.maskDom || currentTarget === _this.handlerDom || currentTarget === _this.contentDom && getTouchParentScroll(currentTarget, e.target, differX, differY)) {
+        e.preventDefault();
+      }
+    };
+
+    _this.transitionEnd = function (e) {
+      var dom = e.target;
+      removeEventListener(dom, transitionEnd, _this.transitionEnd);
+      dom.style.transition = '';
+    };
+
+    _this.onKeyDown = function (e) {
+      if (e.keyCode === KeyCode.ESC) {
+        var onClose = _this.props.onClose;
+        e.stopPropagation();
+
+        if (onClose) {
+          onClose(e);
+        }
+      }
+    };
+
+    _this.onWrapperTransitionEnd = function (e) {
+      var _this$props = _this.props,
+          open = _this$props.open,
+          afterVisibleChange = _this$props.afterVisibleChange;
+
+      if (e.target === _this.contentWrapper && e.propertyName.match(/transform$/)) {
+        _this.dom.style.transition = '';
+
+        if (!open && _this.getCurrentDrawerSome()) {
+          document.body.style.overflowX = '';
+
+          if (_this.maskDom) {
+            _this.maskDom.style.left = '';
+            _this.maskDom.style.width = '';
+          }
+        }
+
+        if (afterVisibleChange) {
+          afterVisibleChange(!!open);
+        }
+      }
+    };
+
+    _this.openLevelTransition = function () {
+      var _this$props2 = _this.props,
+          open = _this$props2.open,
+          width = _this$props2.width,
+          height = _this$props2.height;
+
+      var _this$getHorizontalBo = _this.getHorizontalBoolAndPlacementName(),
+          isHorizontal = _this$getHorizontalBo.isHorizontal,
+          placementName = _this$getHorizontalBo.placementName;
+
+      var contentValue = _this.contentDom ? _this.contentDom.getBoundingClientRect()[isHorizontal ? 'width' : 'height'] : 0;
+      var value = (isHorizontal ? width : height) || contentValue;
+
+      _this.setLevelAndScrolling(open, placementName, value);
+    };
+
+    _this.setLevelTransform = function (open, placementName, value, right) {
+      var _this$props3 = _this.props,
+          placement = _this$props3.placement,
+          levelMove = _this$props3.levelMove,
+          duration = _this$props3.duration,
+          ease = _this$props3.ease,
+          showMask = _this$props3.showMask; // router 切换时可能会导至页面失去滚动条，所以需要时时获取。
+
+      _this.levelDom.forEach(function (dom) {
+        dom.style.transition = "transform ".concat(duration, " ").concat(ease);
+        addEventListener(dom, transitionEnd, _this.transitionEnd);
+        var levelValue = open ? value : 0;
+
+        if (levelMove) {
+          var $levelMove = transformArguments(levelMove, {
+            target: dom,
+            open: open
+          });
+          levelValue = open ? $levelMove[0] : $levelMove[1] || 0;
+        }
+
+        var $value = typeof levelValue === 'number' ? "".concat(levelValue, "px") : levelValue;
+        var placementPos = placement === 'left' || placement === 'top' ? $value : "-".concat($value);
+        placementPos = showMask && placement === 'right' && right ? "calc(".concat(placementPos, " + ").concat(right, "px)") : placementPos;
+        dom.style.transform = levelValue ? "".concat(placementName, "(").concat(placementPos, ")") : '';
+      });
+    };
+
+    _this.setLevelAndScrolling = function (open, placementName, value) {
+      var onChange = _this.props.onChange;
+
+      if (!windowIsUndefined) {
+        var right = document.body.scrollHeight > (window.innerHeight || document.documentElement.clientHeight) && window.innerWidth > document.body.offsetWidth ? getScrollBarSize(true) : 0;
+
+        _this.setLevelTransform(open, placementName, value, right);
+
+        _this.toggleScrollingToDrawerAndBody(right);
+      }
+
+      if (onChange) {
+        onChange(open);
+      }
+    };
+
+    _this.toggleScrollingToDrawerAndBody = function (right) {
+      var _this$props4 = _this.props,
+          getOpenCount = _this$props4.getOpenCount,
+          getContainer = _this$props4.getContainer,
+          showMask = _this$props4.showMask,
+          open = _this$props4.open;
+      var container = getContainer && getContainer();
+      var openCount = getOpenCount && getOpenCount(); // 处理 body 滚动
+
+      if (container && container.parentNode === document.body && showMask) {
+        var eventArray = ['touchstart'];
+        var domArray = [document.body, _this.maskDom, _this.handlerDom, _this.contentDom];
+
+        if (open && document.body.style.overflow !== 'hidden') {
+          if (right) {
+            _this.addScrollingEffect(right);
+          }
+
+          if (openCount === 1) {
+            document.body.style.overflow = 'hidden';
+          }
+
+          document.body.style.touchAction = 'none'; // 手机禁滚
+
+          domArray.forEach(function (item, i) {
+            if (!item) {
+              return;
+            }
+
+            addEventListener(item, eventArray[i] || 'touchmove', i ? _this.removeMoveHandler : _this.removeStartHandler, _this.passive);
+          });
+        } else if (_this.getCurrentDrawerSome()) {
+          // 没有弹框的状态下清除 overflow;
+          if (!openCount) {
+            document.body.style.overflow = '';
+          }
+
+          document.body.style.touchAction = '';
+
+          if (right) {
+            _this.remScrollingEffect(right);
+          } // 恢复事件
+
+
+          domArray.forEach(function (item, i) {
+            if (!item) {
+              return;
+            }
+
+            removeEventListener(item, eventArray[i] || 'touchmove', i ? _this.removeMoveHandler : _this.removeStartHandler, _this.passive);
+          });
+        }
+      }
+    };
+
+    _this.addScrollingEffect = function (right) {
+      var _this$props5 = _this.props,
+          placement = _this$props5.placement,
+          duration = _this$props5.duration,
+          ease = _this$props5.ease,
+          getOpenCount = _this$props5.getOpenCount,
+          switchScrollingEffect = _this$props5.switchScrollingEffect;
+      var openCount = getOpenCount && getOpenCount();
+
+      if (openCount === 1) {
+        switchScrollingEffect();
+      }
+
+      var widthTransition = "width ".concat(duration, " ").concat(ease);
+      var transformTransition = "transform ".concat(duration, " ").concat(ease);
+      _this.dom.style.transition = 'none';
+
+      switch (placement) {
+        case 'right':
+          _this.dom.style.transform = "translateX(-".concat(right, "px)");
+          break;
+
+        case 'top':
+        case 'bottom':
+          _this.dom.style.width = "calc(100% - ".concat(right, "px)");
+          _this.dom.style.transform = 'translateZ(0)';
+          break;
+      }
+
+      clearTimeout(_this.timeout);
+      _this.timeout = setTimeout(function () {
+        if (_this.dom) {
+          _this.dom.style.transition = "".concat(transformTransition, ",").concat(widthTransition);
+          _this.dom.style.width = '';
+          _this.dom.style.transform = '';
+        }
+      });
+    };
+
+    _this.remScrollingEffect = function (right) {
+      var _this$props6 = _this.props,
+          placement = _this$props6.placement,
+          duration = _this$props6.duration,
+          ease = _this$props6.ease,
+          getOpenCount = _this$props6.getOpenCount,
+          switchScrollingEffect = _this$props6.switchScrollingEffect;
+      var openCount = getOpenCount && getOpenCount();
+
+      if (!openCount) {
+        switchScrollingEffect(true);
+      }
+
+      if (transitionStr) {
+        document.body.style.overflowX = 'hidden';
+      }
+
+      _this.dom.style.transition = 'none';
+      var heightTransition;
+      var widthTransition = "width ".concat(duration, " ").concat(ease);
+      var transformTransition = "transform ".concat(duration, " ").concat(ease);
+
+      switch (placement) {
+        case 'left':
+          {
+            _this.dom.style.width = '100%';
+            widthTransition = "width 0s ".concat(ease, " ").concat(duration);
+            break;
+          }
+
+        case 'right':
+          {
+            _this.dom.style.transform = "translateX(".concat(right, "px)");
+            _this.dom.style.width = '100%';
+            widthTransition = "width 0s ".concat(ease, " ").concat(duration);
+
+            if (_this.maskDom) {
+              _this.maskDom.style.left = "-".concat(right, "px");
+              _this.maskDom.style.width = "calc(100% + ".concat(right, "px)");
+            }
+
+            break;
+          }
+
+        case 'top':
+        case 'bottom':
+          {
+            _this.dom.style.width = "calc(100% + ".concat(right, "px)");
+            _this.dom.style.height = '100%';
+            _this.dom.style.transform = 'translateZ(0)';
+            heightTransition = "height 0s ".concat(ease, " ").concat(duration);
+            break;
+          }
+      }
+
+      clearTimeout(_this.timeout);
+      _this.timeout = setTimeout(function () {
+        if (_this.dom) {
+          _this.dom.style.transition = "".concat(transformTransition, ",").concat(heightTransition ? "".concat(heightTransition, ",") : '').concat(widthTransition);
+          _this.dom.style.transform = '';
+          _this.dom.style.width = '';
+          _this.dom.style.height = '';
+        }
+      });
+    };
+
+    _this.getCurrentDrawerSome = function () {
+      return !Object.keys(currentDrawer).some(function (key) {
+        return currentDrawer[key];
+      });
+    };
+
+    _this.getLevelDom = function (_ref) {
+      var level = _ref.level,
+          getContainer = _ref.getContainer;
+
+      if (windowIsUndefined) {
+        return;
+      }
+
+      var container = getContainer && getContainer();
+      var parent = container ? container.parentNode : null;
+      _this.levelDom = [];
+
+      if (level === 'all') {
+        var children = parent ? Array.prototype.slice.call(parent.children) : [];
+        children.forEach(function (child) {
+          if (child.nodeName !== 'SCRIPT' && child.nodeName !== 'STYLE' && child.nodeName !== 'LINK' && child !== container) {
+            _this.levelDom.push(child);
+          }
+        });
+      } else if (level) {
+        dataToArray(level).forEach(function (key) {
+          document.querySelectorAll(key).forEach(function (item) {
+            _this.levelDom.push(item);
+          });
+        });
+      }
+    };
+
+    _this.getHorizontalBoolAndPlacementName = function () {
+      var placement = _this.props.placement;
+      var isHorizontal = placement === 'left' || placement === 'right';
+      var placementName = "translate".concat(isHorizontal ? 'X' : 'Y');
+      return {
+        isHorizontal: isHorizontal,
+        placementName: placementName
+      };
+    };
+
+    _this.state = {
+      _self: _assertThisInitialized$2(_this)
+    };
+    return _this;
+  }
+
+  _createClass$2(DrawerChild, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var _this2 = this;
+
+      if (!windowIsUndefined) {
+        var passiveSupported = false;
+
+        try {
+          window.addEventListener('test', null, Object.defineProperty({}, 'passive', {
+            get: function get() {
+              passiveSupported = true;
+              return null;
+            }
+          }));
+        } catch (err) {}
+
+        this.passive = passiveSupported ? {
+          passive: false
+        } : false;
+      }
+
+      var open = this.props.open;
+      this.drawerId = "drawer_id_".concat(Number((Date.now() + Math.random()).toString().replace('.', Math.round(Math.random() * 9).toString())).toString(16));
+      this.getLevelDom(this.props);
+
+      if (open) {
+        currentDrawer[this.drawerId] = open; // 默认打开状态时推出 level;
+
+        this.openLevelTransition();
+        this.forceUpdate(function () {
+          _this2.domFocus();
+        });
+      }
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      var open = this.props.open;
+
+      if (open !== prevProps.open) {
+        if (open) {
+          this.domFocus();
+        }
+
+        currentDrawer[this.drawerId] = !!open;
+        this.openLevelTransition();
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      var _this$props7 = this.props,
+          getOpenCount = _this$props7.getOpenCount,
+          open = _this$props7.open,
+          switchScrollingEffect = _this$props7.switchScrollingEffect;
+      var openCount = typeof getOpenCount === 'function' && getOpenCount();
+      delete currentDrawer[this.drawerId];
+
+      if (open) {
+        this.setLevelTransform(false);
+        document.body.style.touchAction = '';
+      }
+
+      if (!openCount) {
+        document.body.style.overflow = '';
+        switchScrollingEffect(true);
+      }
+    } // tslint:disable-next-line:member-ordering
+
+  }, {
+    key: "render",
+    value: function render() {
+      var _classnames,
+          _this3 = this;
+
+      var _this$props8 = this.props,
+          className = _this$props8.className,
+          children = _this$props8.children,
+          style = _this$props8.style,
+          width = _this$props8.width,
+          height = _this$props8.height,
+          $open = _this$props8.open,
+          prefixCls = _this$props8.prefixCls,
+          placement = _this$props8.placement,
+          handler = _this$props8.handler,
+          showMask = _this$props8.showMask,
+          maskClosable = _this$props8.maskClosable,
+          maskStyle = _this$props8.maskStyle,
+          onClose = _this$props8.onClose,
+          onHandleClick = _this$props8.onHandleClick,
+          keyboard = _this$props8.keyboard,
+          props = _objectWithoutProperties$1(_this$props8, ["className", "children", "style", "width", "height", "defaultOpen", "open", "prefixCls", "placement", "level", "levelMove", "ease", "duration", "getContainer", "handler", "onChange", "afterVisibleChange", "showMask", "maskClosable", "maskStyle", "onClose", "onHandleClick", "keyboard", "getOpenCount", "switchScrollingEffect"]); // 首次渲染都将是关闭状态。
+
+
+      var open = this.dom ? $open : false;
+      var wrapperClassName = classNames(prefixCls, (_classnames = {}, _defineProperty(_classnames, "".concat(prefixCls, "-").concat(placement), true), _defineProperty(_classnames, "".concat(prefixCls, "-open"), open), _defineProperty(_classnames, className || '', !!className), _defineProperty(_classnames, 'no-mask', !showMask), _classnames));
+
+      var _this$getHorizontalBo2 = this.getHorizontalBoolAndPlacementName(),
+          placementName = _this$getHorizontalBo2.placementName; // 百分比与像素动画不同步，第一次打用后全用像素动画。
+      // const defaultValue = !this.contentDom || !level ? '100%' : `${value}px`;
+
+
+      var placementPos = placement === 'left' || placement === 'top' ? '-100%' : '100%';
+      var transform = open ? '' : "".concat(placementName, "(").concat(placementPos, ")");
+      var handlerChildren = handler && React.cloneElement(handler, {
+        onClick: function onClick(e) {
+          if (handler.props.onClick) {
+            handler.props.onClick();
+          }
+
+          if (onHandleClick) {
+            onHandleClick(e);
+          }
+        },
+        ref: function ref(c) {
+          _this3.handlerDom = c;
+        }
+      });
+      return React.createElement("div", Object.assign({}, props, {
+        tabIndex: -1,
+        className: wrapperClassName,
+        style: style,
+        ref: function ref(c) {
+          _this3.dom = c;
+        },
+        onKeyDown: open && keyboard ? this.onKeyDown : undefined,
+        onTransitionEnd: this.onWrapperTransitionEnd
+      }), showMask && React.createElement("div", {
+        className: "".concat(prefixCls, "-mask"),
+        onClick: maskClosable ? onClose : undefined,
+        style: maskStyle,
+        ref: function ref(c) {
+          _this3.maskDom = c;
+        }
+      }), React.createElement("div", {
+        className: "".concat(prefixCls, "-content-wrapper"),
+        style: {
+          transform: transform,
+          msTransform: transform,
+          width: isNumeric(width) ? "".concat(width, "px") : width,
+          height: isNumeric(height) ? "".concat(height, "px") : height
+        },
+        ref: function ref(c) {
+          _this3.contentWrapper = c;
+        }
+      }, React.createElement("div", {
+        className: "".concat(prefixCls, "-content"),
+        ref: function ref(c) {
+          _this3.contentDom = c;
+        },
+        onTouchStart: open && showMask ? this.removeStartHandler : undefined,
+        onTouchMove: open && showMask ? this.removeMoveHandler : undefined
+      }, children), handlerChildren));
+    }
+  }], [{
+    key: "getDerivedStateFromProps",
+    value: function getDerivedStateFromProps(props, _ref2) {
+      var prevProps = _ref2.prevProps,
+          _self = _ref2._self;
+      var nextState = {
+        prevProps: props
+      };
+
+      if (prevProps !== undefined) {
+        var placement = props.placement,
+            level = props.level;
+
+        if (placement !== prevProps.placement) {
+          // test 的 bug, 有动画过场，删除 dom
+          _self.contentDom = null;
+        }
+
+        if (level !== prevProps.level) {
+          _self.getLevelDom(props);
+        }
+      }
+
+      return nextState;
+    }
+  }]);
+
+  return DrawerChild;
+}(React.Component);
+
+DrawerChild.defaultProps = {
+  switchScrollingEffect: function switchScrollingEffect() {}
+};
+var Child = polyfill(DrawerChild);
+
+function _typeof$1(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$1 = function _typeof(obj) { return typeof obj; }; } else { _typeof$1 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$1(obj); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties$1(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass$1(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$1(Constructor.prototype, protoProps); if (staticProps) _defineProperties$1(Constructor, staticProps); return Constructor; }
+
+function _possibleConstructorReturn$1(self, call) { if (call && (_typeof$1(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$1(self); }
+
+function _assertThisInitialized$1(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _getPrototypeOf$1(o) { _getPrototypeOf$1 = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf$1(o); }
+
+function _inherits$1(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf$1(subClass, superClass); }
+
+function _setPrototypeOf$1(o, p) { _setPrototypeOf$1 = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf$1(o, p); }
+
+var DrawerWrapper =
+/*#__PURE__*/
+function (_React$Component) {
+  _inherits$1(DrawerWrapper, _React$Component);
+
+  function DrawerWrapper(props) {
+    var _this;
+
+    _classCallCheck$1(this, DrawerWrapper);
+
+    _this = _possibleConstructorReturn$1(this, _getPrototypeOf$1(DrawerWrapper).call(this, props));
+
+    _this.onHandleClick = function (e) {
+      var _this$props = _this.props,
+          onHandleClick = _this$props.onHandleClick,
+          $open = _this$props.open;
+
+      if (onHandleClick) {
+        onHandleClick(e);
+      }
+
+      if (typeof $open === 'undefined') {
+        var _open = _this.state.open;
+
+        _this.setState({
+          open: !_open
+        });
+      }
+    };
+
+    _this.onClose = function (e) {
+      var _this$props2 = _this.props,
+          onClose = _this$props2.onClose,
+          open = _this$props2.open;
+
+      if (onClose) {
+        onClose(e);
+      }
+
+      if (typeof open === 'undefined') {
+        _this.setState({
+          open: false
+        });
+      }
+    };
+
+    var open = typeof props.open !== 'undefined' ? props.open : !!props.defaultOpen;
+    _this.state = {
+      open: open
+    };
+
+    if ('onMaskClick' in props) {
+      console.warn('`onMaskClick` are removed, please use `onClose` instead.');
+    }
+
+    return _this;
+  }
+
+  _createClass$1(DrawerWrapper, [{
+    key: "render",
+    // tslint:disable-next-line:member-ordering
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props3 = this.props,
+          getContainer = _this$props3.getContainer,
+          wrapperClassName = _this$props3.wrapperClassName,
+          forceRender = _this$props3.forceRender,
+          handler = _this$props3.handler,
+          props = _objectWithoutProperties(_this$props3, ["defaultOpen", "getContainer", "wrapperClassName", "forceRender", "handler"]);
+
+      var open = this.state.open; // 渲染在当前 dom 里；
+
+      if (!getContainer) {
+        return React.createElement("div", {
+          className: wrapperClassName,
+          ref: function ref(c) {
+            _this2.dom = c;
+          }
+        }, React.createElement(Child, Object.assign({}, props, {
+          open: open,
+          handler: handler,
+          getContainer: function getContainer() {
+            return _this2.dom;
+          },
+          onClose: this.onClose,
+          onHandleClick: this.onHandleClick
+        })));
+      } // 如果有 handler 为内置强制渲染；
+
+
+      var $forceRender = !!handler || forceRender;
+      return React.createElement(Portal, {
+        visible: open,
+        forceRender: $forceRender,
+        getContainer: getContainer,
+        wrapperClassName: wrapperClassName
+      }, function (_ref) {
+        var visible = _ref.visible,
+            afterClose = _ref.afterClose,
+            rest = _objectWithoutProperties(_ref, ["visible", "afterClose"]);
+
+        return (// react 15，componentWillUnmount 时 Portal 返回 afterClose, visible.
+          React.createElement(Child, Object.assign({}, props, rest, {
+            open: visible !== undefined ? visible : open,
+            afterVisibleChange: afterClose !== undefined ? afterClose : props.afterVisibleChange,
+            handler: handler,
+            onClose: _this2.onClose,
+            onHandleClick: _this2.onHandleClick
+          }))
+        );
+      });
+    }
+  }], [{
+    key: "getDerivedStateFromProps",
+    value: function getDerivedStateFromProps(props, _ref2) {
+      var prevProps = _ref2.prevProps;
+      var newState = {
+        prevProps: props
+      };
+
+      if (typeof prevProps !== 'undefined' && props.open !== prevProps.open) {
+        newState.open = props.open;
+      }
+
+      return newState;
+    }
+  }]);
+
+  return DrawerWrapper;
+}(React.Component);
+
+DrawerWrapper.defaultProps = {
+  prefixCls: 'drawer',
+  placement: 'left',
+  getContainer: 'body',
+  defaultOpen: false,
+  level: 'all',
+  duration: '.3s',
+  ease: 'cubic-bezier(0.78, 0.14, 0.15, 0.86)',
+  onChange: function onChange() {},
+  afterVisibleChange: function afterVisibleChange() {},
+  handler: React.createElement("div", {
+    className: "drawer-handle"
+  }, React.createElement("i", {
+    className: "drawer-handle-icon"
+  })),
+  showMask: true,
+  maskClosable: true,
+  maskStyle: {},
+  wrapperClassName: '',
+  className: '',
+  keyboard: true,
+  forceRender: false
+};
+var Drawer$1 = polyfill(DrawerWrapper);
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+var __rest = undefined && undefined.__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;
+};
+var DrawerContext = createReactContext(null);
+tuple('top', 'right', 'bottom', 'left');
+
+var Drawer = /*#__PURE__*/function (_React$Component) {
+  _inherits(Drawer, _React$Component);
+
+  var _super = _createSuper(Drawer);
+
+  function Drawer() {
+    var _this;
+
+    _classCallCheck(this, Drawer);
+
+    _this = _super.apply(this, arguments);
+    _this.state = {
+      push: false
+    };
+
+    _this.push = function () {
+      _this.setState({
+        push: true
+      });
+    };
+
+    _this.pull = function () {
+      _this.setState({
+        push: false
+      });
+    };
+
+    _this.onDestroyTransitionEnd = function () {
+      var isDestroyOnClose = _this.getDestroyOnClose();
+
+      if (!isDestroyOnClose) {
+        return;
+      }
+
+      if (!_this.props.visible) {
+        _this.destroyClose = true;
+
+        _this.forceUpdate();
+      }
+    };
+
+    _this.getDestroyOnClose = function () {
+      return _this.props.destroyOnClose && !_this.props.visible;
+    }; // get drawer push width or height
+
+
+    _this.getPushTransform = function (placement) {
+      if (placement === 'left' || placement === 'right') {
+        return "translateX(".concat(placement === 'left' ? 180 : -180, "px)");
+      }
+
+      if (placement === 'top' || placement === 'bottom') {
+        return "translateY(".concat(placement === 'top' ? 180 : -180, "px)");
+      }
+    };
+
+    _this.getRcDrawerStyle = function () {
+      var _this$props = _this.props,
+          zIndex = _this$props.zIndex,
+          placement = _this$props.placement,
+          style = _this$props.style;
+      var push = _this.state.push;
+      return _extends({
+        zIndex: zIndex,
+        transform: push ? _this.getPushTransform(placement) : undefined
+      }, style);
+    }; // render drawer body dom
+
+
+    _this.renderBody = function () {
+      var _this$props2 = _this.props,
+          bodyStyle = _this$props2.bodyStyle,
+          drawerStyle = _this$props2.drawerStyle,
+          prefixCls = _this$props2.prefixCls,
+          visible = _this$props2.visible;
+
+      if (_this.destroyClose && !visible) {
+        return null;
+      }
+
+      _this.destroyClose = false;
+      var containerStyle = {};
+
+      var isDestroyOnClose = _this.getDestroyOnClose();
+
+      if (isDestroyOnClose) {
+        // Increase the opacity transition, delete children after closing.
+        containerStyle.opacity = 0;
+        containerStyle.transition = 'opacity .3s';
+      }
+
+      return /*#__PURE__*/React.createElement("div", {
+        className: "".concat(prefixCls, "-wrapper-body"),
+        style: _extends(_extends({}, containerStyle), drawerStyle),
+        onTransitionEnd: _this.onDestroyTransitionEnd
+      }, _this.renderHeader(), /*#__PURE__*/React.createElement("div", {
+        className: "".concat(prefixCls, "-body"),
+        style: bodyStyle
+      }, _this.props.children));
+    }; // render Provider for Multi-level drawer
+
+
+    _this.renderProvider = function (value) {
+      var _a = _this.props,
+          prefixCls = _a.prefixCls,
+          placement = _a.placement,
+          className = _a.className,
+          wrapClassName = _a.wrapClassName,
+          width = _a.width,
+          height = _a.height,
+          mask = _a.mask,
+          rest = __rest(_a, ["prefixCls", "placement", "className", "wrapClassName", "width", "height", "mask"]);
+      var haveMask = mask ? '' : 'no-mask';
+      _this.parentDrawer = value;
+      var offsetStyle = {};
+
+      if (placement === 'left' || placement === 'right') {
+        offsetStyle.width = width;
+      } else {
+        offsetStyle.height = height;
+      }
+
+      return /*#__PURE__*/React.createElement(DrawerContext.Provider, {
+        value: _assertThisInitialized(_this)
+      }, /*#__PURE__*/React.createElement(Drawer$1, _extends({
+        handler: false
+      }, omit(rest, ['zIndex', 'style', 'closable', 'destroyOnClose', 'drawerStyle', 'headerStyle', 'bodyStyle', 'title', 'push', 'visible', 'getPopupContainer', 'rootPrefixCls', 'getPrefixCls', 'renderEmpty', 'csp', 'pageHeader', 'autoInsertSpaceInButton']), offsetStyle, {
+        prefixCls: prefixCls,
+        open: _this.props.visible,
+        showMask: mask,
+        placement: placement,
+        style: _this.getRcDrawerStyle(),
+        className: classNames(wrapClassName, className, haveMask)
+      }), _this.renderBody()));
+    };
+
+    return _this;
+  }
+
+  _createClass(Drawer, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      // fix: delete drawer in child and re-render, no push started.
+      // <Drawer>{show && <Drawer />}</Drawer>
+      var visible = this.props.visible;
+
+      if (visible && this.parentDrawer) {
+        this.parentDrawer.push();
+      }
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(preProps) {
+      var visible = this.props.visible;
+
+      if (preProps.visible !== visible && this.parentDrawer) {
+        if (visible) {
+          this.parentDrawer.push();
+        } else {
+          this.parentDrawer.pull();
+        }
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      // unmount drawer in child, clear push.
+      if (this.parentDrawer) {
+        this.parentDrawer.pull();
+        this.parentDrawer = null;
+      }
+    }
+  }, {
+    key: "renderHeader",
+    value: function renderHeader() {
+      var _this$props3 = this.props,
+          title = _this$props3.title,
+          prefixCls = _this$props3.prefixCls,
+          closable = _this$props3.closable,
+          headerStyle = _this$props3.headerStyle;
+
+      if (!title && !closable) {
+        return null;
+      }
+
+      var headerClassName = title ? "".concat(prefixCls, "-header") : "".concat(prefixCls, "-header-no-title");
+      return /*#__PURE__*/React.createElement("div", {
+        className: headerClassName,
+        style: headerStyle
+      }, title && /*#__PURE__*/React.createElement("div", {
+        className: "".concat(prefixCls, "-title")
+      }, title), closable && this.renderCloseIcon());
+    }
+  }, {
+    key: "renderCloseIcon",
+    value: function renderCloseIcon() {
+      var _this$props4 = this.props,
+          closable = _this$props4.closable,
+          prefixCls = _this$props4.prefixCls,
+          onClose = _this$props4.onClose;
+      return closable &&
+      /*#__PURE__*/
+      // eslint-disable-next-line react/button-has-type
+      React.createElement("button", {
+        onClick: onClose,
+        "aria-label": "Close",
+        className: "".concat(prefixCls, "-close")
+      }, /*#__PURE__*/React.createElement(Icon, {
+        type: "close"
+      }));
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      return /*#__PURE__*/React.createElement(DrawerContext.Consumer, null, this.renderProvider);
+    }
+  }]);
+
+  return Drawer;
+}(React.Component);
+
+Drawer.defaultProps = {
+  width: 256,
+  height: 256,
+  closable: true,
+  placement: 'right',
+  maskClosable: true,
+  mask: true,
+  level: null,
+  keyboard: true
+};
+var index = withConfigConsumer({
+  prefixCls: 'drawer'
+})(Drawer);
+
+export { index as default };