@rc-component/dialog 1.0.0 → 1.0.1

package/es/DialogWrap.js

@@ -1,5 +1,4 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import Portal from '@rc-component/portal';
 import * as React from 'react';
 import { RefContext } from "./context";
@@ -13,24 +12,20 @@ import Dialog from "./Dialog";
  * So here should add a child (div element) to custom container.
  * */
 
-var DialogWrap = function DialogWrap(props) {
-  var visible = props.visible,
-    getContainer = props.getContainer,
-    forceRender = props.forceRender,
-    _props$destroyOnClose = props.destroyOnClose,
-    destroyOnClose = _props$destroyOnClose === void 0 ? false : _props$destroyOnClose,
-    _afterClose = props.afterClose,
-    panelRef = props.panelRef;
-  var _React$useState = React.useState(visible),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    animatedVisible = _React$useState2[0],
-    setAnimatedVisible = _React$useState2[1];
-  var refContext = React.useMemo(function () {
-    return {
-      panel: panelRef
-    };
-  }, [panelRef]);
-  React.useEffect(function () {
+const DialogWrap = props => {
+  const {
+    visible,
+    getContainer,
+    forceRender,
+    destroyOnClose = false,
+    afterClose,
+    panelRef
+  } = props;
+  const [animatedVisible, setAnimatedVisible] = React.useState(visible);
+  const refContext = React.useMemo(() => ({
+    panel: panelRef
+  }), [panelRef]);
+  React.useEffect(() => {
     if (visible) {
       setAnimatedVisible(true);
     }
@@ -49,8 +44,8 @@ var DialogWrap = function DialogWrap(props) {
     autoLock: visible || animatedVisible
   }, /*#__PURE__*/React.createElement(Dialog, _extends({}, props, {
     destroyOnClose: destroyOnClose,
-    afterClose: function afterClose() {
-      _afterClose === null || _afterClose === void 0 || _afterClose();
+    afterClose: () => {
+      afterClose?.();
       setAnimatedVisible(false);
     }
   }))));

package/es/IDialogPropTypes.d.ts

@@ -1,4 +1,4 @@
-import type { GetContainer } from 'rc-util/lib/PortalWrapper';
+import type { GetContainer } from '@rc-component/util/lib/PortalWrapper';
 import type { CSSProperties, ReactNode, SyntheticEvent } from 'react';
 export type SemanticName = 'header' | 'body' | 'footer' | 'section' | 'title' | 'wrapper' | 'mask';
 export type ModalClassNames = Partial<Record<SemanticName, string>>;
@@ -7,6 +7,7 @@ export type IDialogPropTypes = {
     className?: string;
     keyboard?: boolean;
     style?: CSSProperties;
+    rootStyle?: CSSProperties;
     mask?: boolean;
     children?: React.ReactNode;
     afterClose?: () => any;

package/es/context.js

@@ -1,2 +1,2 @@
 import * as React from 'react';
-export var RefContext = /*#__PURE__*/React.createContext({});
+export const RefContext = /*#__PURE__*/React.createContext({});

package/es/util.js

@@ -1,18 +1,18 @@
 // =============================== Motion ===============================
 export function getMotionName(prefixCls, transitionName, animationName) {
-  var motionName = transitionName;
+  let motionName = transitionName;
   if (!motionName && animationName) {
-    motionName = "".concat(prefixCls, "-").concat(animationName);
+    motionName = `${prefixCls}-${animationName}`;
   }
   return motionName;
 }
 
 // =============================== Offset ===============================
 function getScroll(w, top) {
-  var ret = w["page".concat(top ? 'Y' : 'X', "Offset")];
-  var method = "scroll".concat(top ? 'Top' : 'Left');
+  let ret = w[`page${top ? 'Y' : 'X'}Offset`];
+  const method = `scroll${top ? 'Top' : 'Left'}`;
   if (typeof ret !== 'number') {
-    var d = w.document;
+    const d = w.document;
     ret = d.documentElement[method];
     if (typeof ret !== 'number') {
       ret = d.body[method];
@@ -21,13 +21,13 @@ function getScroll(w, top) {
   return ret;
 }
 export function offset(el) {
-  var rect = el.getBoundingClientRect();
-  var pos = {
+  const rect = el.getBoundingClientRect();
+  const pos = {
     left: rect.left,
     top: rect.top
   };
-  var doc = el.ownerDocument;
-  var w = doc.defaultView || doc.parentWindow;
+  const doc = el.ownerDocument;
+  const w = doc.defaultView || doc.parentWindow;
   pos.left += getScroll(w);
   pos.top += getScroll(w, true);
   return pos;

package/lib/Dialog/Content/MemoChildren.js

@@ -1,17 +1,14 @@
 "use strict";
 
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 var React = _interopRequireWildcard(require("react"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-var _default = exports.default = /*#__PURE__*/React.memo(function (_ref) {
-  var children = _ref.children;
-  return children;
-}, function (_, _ref2) {
-  var shouldUpdate = _ref2.shouldUpdate;
-  return !shouldUpdate;
-});
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var _default = exports.default = /*#__PURE__*/React.memo(({
+  children
+}) => children, (_, {
+  shouldUpdate
+}) => !shouldUpdate);

package/lib/Dialog/Content/Panel.js

@@ -1,87 +1,85 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof3 = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _classnames = _interopRequireDefault(require("classnames"));
-var _ref = require("rc-util/lib/ref");
+var _ref = require("@rc-component/util/lib/ref");
 var _react = _interopRequireWildcard(require("react"));
 var _context = require("../../context");
 var _MemoChildren = _interopRequireDefault(require("./MemoChildren"));
-var _pickAttrs = _interopRequireDefault(require("rc-util/lib/pickAttrs"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-var sentinelStyle = {
+var _pickAttrs = _interopRequireDefault(require("@rc-component/util/lib/pickAttrs"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const sentinelStyle = {
   width: 0,
   height: 0,
   overflow: 'hidden',
   outline: 'none'
 };
-var entityStyle = {
+const entityStyle = {
   outline: 'none'
 };
-var Panel = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var prefixCls = props.prefixCls,
-    className = props.className,
-    style = props.style,
-    title = props.title,
-    ariaId = props.ariaId,
-    footer = props.footer,
-    closable = props.closable,
-    closeIcon = props.closeIcon,
-    onClose = props.onClose,
-    children = props.children,
-    bodyStyle = props.bodyStyle,
-    bodyProps = props.bodyProps,
-    modalRender = props.modalRender,
-    onMouseDown = props.onMouseDown,
-    onMouseUp = props.onMouseUp,
-    holderRef = props.holderRef,
-    visible = props.visible,
-    forceRender = props.forceRender,
-    width = props.width,
-    height = props.height,
-    modalClassNames = props.classNames,
-    modalStyles = props.styles;
+const Panel = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const {
+    prefixCls,
+    className,
+    style,
+    title,
+    ariaId,
+    footer,
+    closable,
+    closeIcon,
+    onClose,
+    children,
+    bodyStyle,
+    bodyProps,
+    modalRender,
+    onMouseDown,
+    onMouseUp,
+    holderRef,
+    visible,
+    forceRender,
+    width,
+    height,
+    classNames: modalClassNames,
+    styles: modalStyles
+  } = props;
 
   // ================================= Refs =================================
-  var _React$useContext = _react.default.useContext(_context.RefContext),
-    panelRef = _React$useContext.panel;
-  var mergedRef = (0, _ref.useComposeRef)(holderRef, panelRef);
-  var sentinelStartRef = (0, _react.useRef)();
-  var sentinelEndRef = (0, _react.useRef)();
-  _react.default.useImperativeHandle(ref, function () {
-    return {
-      focus: function focus() {
-        var _sentinelStartRef$cur;
-        (_sentinelStartRef$cur = sentinelStartRef.current) === null || _sentinelStartRef$cur === void 0 || _sentinelStartRef$cur.focus({
+  const {
+    panel: panelRef
+  } = _react.default.useContext(_context.RefContext);
+  const mergedRef = (0, _ref.useComposeRef)(holderRef, panelRef);
+  const sentinelStartRef = (0, _react.useRef)();
+  const sentinelEndRef = (0, _react.useRef)();
+  _react.default.useImperativeHandle(ref, () => ({
+    focus: () => {
+      sentinelStartRef.current?.focus({
+        preventScroll: true
+      });
+    },
+    changeActive: next => {
+      const {
+        activeElement
+      } = document;
+      if (next && activeElement === sentinelEndRef.current) {
+        sentinelStartRef.current.focus({
+          preventScroll: true
+        });
+      } else if (!next && activeElement === sentinelStartRef.current) {
+        sentinelEndRef.current.focus({
           preventScroll: true
         });
-      },
-      changeActive: function changeActive(next) {
-        var _document = document,
-          activeElement = _document.activeElement;
-        if (next && activeElement === sentinelEndRef.current) {
-          sentinelStartRef.current.focus({
-            preventScroll: true
-          });
-        } else if (!next && activeElement === sentinelStartRef.current) {
-          sentinelEndRef.current.focus({
-            preventScroll: true
-          });
-        }
       }
-    };
-  });
+    }
+  }));
 
   // ================================ Style =================================
-  var contentStyle = {};
+  const contentStyle = {};
   if (width !== undefined) {
     contentStyle.width = width;
   }
@@ -89,47 +87,56 @@ var Panel = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     contentStyle.height = height;
   }
   // ================================ Render ================================
-  var footerNode = footer ? /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)("".concat(prefixCls, "-footer"), modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.footer),
-    style: (0, _objectSpread2.default)({}, modalStyles === null || modalStyles === void 0 ? void 0 : modalStyles.footer)
+  const footerNode = footer ? /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)(`${prefixCls}-footer`, modalClassNames?.footer),
+    style: {
+      ...modalStyles?.footer
+    }
   }, footer) : null;
-  var headerNode = title ? /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)("".concat(prefixCls, "-header"), modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.header),
-    style: (0, _objectSpread2.default)({}, modalStyles === null || modalStyles === void 0 ? void 0 : modalStyles.header)
+  const headerNode = title ? /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)(`${prefixCls}-header`, modalClassNames?.header),
+    style: {
+      ...modalStyles?.header
+    }
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)("".concat(prefixCls, "-title"), modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.title),
+    className: (0, _classnames.default)(`${prefixCls}-title`, modalClassNames?.title),
     id: ariaId,
-    style: (0, _objectSpread2.default)({}, modalStyles === null || modalStyles === void 0 ? void 0 : modalStyles.title)
+    style: {
+      ...modalStyles?.title
+    }
   }, title)) : null;
-  var closableObj = (0, _react.useMemo)(function () {
-    if ((0, _typeof2.default)(closable) === 'object' && closable !== null) {
+  const closableObj = (0, _react.useMemo)(() => {
+    if (typeof closable === 'object' && closable !== null) {
       return closable;
     }
     if (closable) {
       return {
-        closeIcon: closeIcon !== null && closeIcon !== void 0 ? closeIcon : /*#__PURE__*/_react.default.createElement("span", {
-          className: "".concat(prefixCls, "-close-x")
+        closeIcon: closeIcon ?? /*#__PURE__*/_react.default.createElement("span", {
+          className: `${prefixCls}-close-x`
         })
       };
     }
     return {};
   }, [closable, closeIcon, prefixCls]);
-  var ariaProps = (0, _pickAttrs.default)(closableObj, true);
-  var closeBtnIsDisabled = (0, _typeof2.default)(closable) === 'object' && closable.disabled;
-  var closerNode = closable ? /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
+  const ariaProps = (0, _pickAttrs.default)(closableObj, true);
+  const closeBtnIsDisabled = typeof closable === 'object' && closable.disabled;
+  const closerNode = closable ? /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
     type: "button",
     onClick: onClose,
     "aria-label": "Close"
   }, ariaProps, {
-    className: "".concat(prefixCls, "-close"),
+    className: `${prefixCls}-close`,
     disabled: closeBtnIsDisabled
   }), closableObj.closeIcon) : null;
-  var content = /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)("".concat(prefixCls, "-section"), modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.section),
-    style: modalStyles === null || modalStyles === void 0 ? void 0 : modalStyles.section
+  const content = /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)(`${prefixCls}-section`, modalClassNames?.section),
+    style: modalStyles?.section
   }, closerNode, headerNode, /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
-    className: (0, _classnames.default)("".concat(prefixCls, "-body"), modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.body),
-    style: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, bodyStyle), modalStyles === null || modalStyles === void 0 ? void 0 : modalStyles.body)
+    className: (0, _classnames.default)(`${prefixCls}-body`, modalClassNames?.body),
+    style: {
+      ...bodyStyle,
+      ...modalStyles?.body
+    }
   }, bodyProps), children), footerNode);
   return /*#__PURE__*/_react.default.createElement("div", {
     key: "dialog-element",
@@ -137,7 +144,10 @@ var Panel = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     "aria-labelledby": title ? ariaId : null,
     "aria-modal": "true",
     ref: mergedRef,
-    style: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, style), contentStyle),
+    style: {
+      ...style,
+      ...contentStyle
+    },
     className: (0, _classnames.default)(prefixCls, className),
     onMouseDown: onMouseDown,
     onMouseUp: onMouseUp

package/lib/Dialog/Content/index.js

@@ -1,48 +1,44 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var React = _react;
 var _classnames = _interopRequireDefault(require("classnames"));
 var _rcMotion = _interopRequireDefault(require("rc-motion"));
 var _util = require("../../util");
 var _Panel = _interopRequireDefault(require("./Panel"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-var Content = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var prefixCls = props.prefixCls,
-    title = props.title,
-    style = props.style,
-    className = props.className,
-    visible = props.visible,
-    forceRender = props.forceRender,
-    destroyOnClose = props.destroyOnClose,
-    motionName = props.motionName,
-    ariaId = props.ariaId,
-    onVisibleChanged = props.onVisibleChanged,
-    mousePosition = props.mousePosition;
-  var dialogRef = (0, _react.useRef)();
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const Content = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const {
+    prefixCls,
+    title,
+    style,
+    className,
+    visible,
+    forceRender,
+    destroyOnClose,
+    motionName,
+    ariaId,
+    onVisibleChanged,
+    mousePosition
+  } = props;
+  const dialogRef = (0, _react.useRef)();
 
   // ============================= Style ==============================
-  var _React$useState = React.useState(),
-    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-    transformOrigin = _React$useState2[0],
-    setTransformOrigin = _React$useState2[1];
-  var contentStyle = {};
+  const [transformOrigin, setTransformOrigin] = React.useState();
+  const contentStyle = {};
   if (transformOrigin) {
     contentStyle.transformOrigin = transformOrigin;
   }
   function onPrepare() {
-    var elementOffset = (0, _util.offset)(dialogRef.current);
-    setTransformOrigin(mousePosition && (mousePosition.x || mousePosition.y) ? "".concat(mousePosition.x - elementOffset.left, "px ").concat(mousePosition.y - elementOffset.top, "px") : '');
+    const elementOffset = (0, _util.offset)(dialogRef.current);
+    setTransformOrigin(mousePosition && (mousePosition.x || mousePosition.y) ? `${mousePosition.x - elementOffset.left}px ${mousePosition.y - elementOffset.top}px` : '');
   }
 
   // ============================= Render =============================
@@ -55,19 +51,22 @@ var Content = /*#__PURE__*/React.forwardRef(function (props, ref) {
     motionName: motionName,
     removeOnLeave: destroyOnClose,
     ref: dialogRef
-  }, function (_ref, motionRef) {
-    var motionClassName = _ref.className,
-      motionStyle = _ref.style;
-    return /*#__PURE__*/React.createElement(_Panel.default, (0, _extends2.default)({}, props, {
-      ref: ref,
-      title: title,
-      ariaId: ariaId,
-      prefixCls: prefixCls,
-      holderRef: motionRef,
-      style: (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, motionStyle), style), contentStyle),
-      className: (0, _classnames.default)(className, motionClassName)
-    }));
-  });
+  }, ({
+    className: motionClassName,
+    style: motionStyle
+  }, motionRef) => /*#__PURE__*/React.createElement(_Panel.default, (0, _extends2.default)({}, props, {
+    ref: ref,
+    title: title,
+    ariaId: ariaId,
+    prefixCls: prefixCls,
+    holderRef: motionRef,
+    style: {
+      ...motionStyle,
+      ...style,
+      ...contentStyle
+    },
+    className: (0, _classnames.default)(className, motionClassName)
+  })));
 });
 Content.displayName = 'Content';
 var _default = exports.default = Content;

package/lib/Dialog/Mask.js

@@ -1,38 +1,40 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var React = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _rcMotion = _interopRequireDefault(require("rc-motion"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-var Mask = function Mask(props) {
-  var prefixCls = props.prefixCls,
-    style = props.style,
-    visible = props.visible,
-    maskProps = props.maskProps,
-    motionName = props.motionName,
-    className = props.className;
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const Mask = props => {
+  const {
+    prefixCls,
+    style,
+    visible,
+    maskProps,
+    motionName,
+    className
+  } = props;
   return /*#__PURE__*/React.createElement(_rcMotion.default, {
     key: "mask",
     visible: visible,
     motionName: motionName,
-    leavedClassName: "".concat(prefixCls, "-mask-hidden")
-  }, function (_ref, ref) {
-    var motionClassName = _ref.className,
-      motionStyle = _ref.style;
-    return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
-      ref: ref,
-      style: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, motionStyle), style),
-      className: (0, _classnames.default)("".concat(prefixCls, "-mask"), motionClassName, className)
-    }, maskProps));
-  });
+    leavedClassName: `${prefixCls}-mask-hidden`
+  }, ({
+    className: motionClassName,
+    style: motionStyle
+  }, ref) => /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
+    ref: ref,
+    style: {
+      ...motionStyle,
+      ...style
+    },
+    className: (0, _classnames.default)(`${prefixCls}-mask`, motionClassName, className)
+  }, maskProps)));
 };
 var _default = exports.default = Mask;