@996-design/996-components 1.0.0

package/lib/message/useMessage.js

@@ -0,0 +1,263 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useMessage;
+exports.useInternalMessage = useInternalMessage;
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var React = _interopRequireWildcard(require("react"));
+var _notification = require("@rc-component/notification");
+var _clsx3 = require("clsx");
+var _useMergeSemantic3 = require("../_util/hooks/useMergeSemantic");
+var _is = require("../_util/is");
+var _warning = require("../_util/warning");
+var _configProvider = require("../config-provider");
+var _context = require("../config-provider/context");
+var _useCSSVarCls = _interopRequireDefault(require("../config-provider/hooks/useCSSVarCls"));
+var _useStackConfig = _interopRequireDefault(require("../notification/hooks/useStackConfig"));
+var _util = require("../notification/util");
+var _PurePanel = require("./PurePanel");
+var _style = _interopRequireDefault(require("./style"));
+var _util2 = require("./util");
+var _excluded = ["content", "icon", "type", "key", "className", "style", "onClose", "classNames", "styles"];
+var DEFAULT_OFFSET = 8;
+var DEFAULT_DURATION = 3;
+var DEFAULT_STACK_CONFIG = false;
+var Wrapper = function Wrapper(_ref) {
+  var children = _ref.children,
+    prefixCls = _ref.prefixCls;
+  var rootCls = (0, _useCSSVarCls.default)(prefixCls);
+  var _useStyle = (0, _style.default)(prefixCls, rootCls),
+    _useStyle2 = (0, _slicedToArray2.default)(_useStyle, 2),
+    hashId = _useStyle2[0],
+    cssVarCls = _useStyle2[1];
+  return /*#__PURE__*/React.createElement(_notification.NotificationProvider, {
+    classNames: {
+      list: (0, _clsx3.clsx)(hashId, cssVarCls, rootCls)
+    }
+  }, children);
+};
+var renderNotifications = function renderNotifications(node, _ref2) {
+  var prefixCls = _ref2.prefixCls,
+    key = _ref2.key;
+  return /*#__PURE__*/React.createElement(Wrapper, {
+    prefixCls: prefixCls,
+    key: key
+  }, node);
+};
+var Holder = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var top = props.top,
+    staticPrefixCls = props.prefixCls,
+    staticGetContainer = props.getContainer,
+    maxCount = props.maxCount,
+    _props$duration = props.duration,
+    duration = _props$duration === void 0 ? DEFAULT_DURATION : _props$duration,
+    rtl = props.rtl,
+    classNames = props.classNames,
+    styles = props.styles,
+    transitionName = props.transitionName,
+    _props$pauseOnHover = props.pauseOnHover,
+    pauseOnHover = _props$pauseOnHover === void 0 ? true : _props$pauseOnHover,
+    stack = props.stack,
+    onAllRemoved = props.onAllRemoved;
+  var _useComponentConfig = (0, _context.useComponentConfig)('message'),
+    getPrefixCls = _useComponentConfig.getPrefixCls,
+    direction = _useComponentConfig.direction,
+    getPopupContainer = _useComponentConfig.getPopupContainer;
+  var _React$useContext = React.useContext(_configProvider.ConfigContext),
+    message = _React$useContext.message;
+  var prefixCls = staticPrefixCls || getPrefixCls('message');
+  // Use useMergeSemantic to merge classNames and styles
+  var _useMergeSemantic = (0, _useMergeSemantic3.useMergeSemantic)([message === null || message === void 0 ? void 0 : message.classNames, classNames], [message === null || message === void 0 ? void 0 : message.styles, styles], {
+      props: props
+    }),
+    _useMergeSemantic2 = (0, _slicedToArray2.default)(_useMergeSemantic, 2),
+    mergedClassNames = _useMergeSemantic2[0],
+    mergedStyles = _useMergeSemantic2[1];
+  // =============================== Style ===============================
+  var getStyle = function getStyle() {
+    return (0, _util.getPlacementOffsetStyle)(top !== null && top !== void 0 ? top : DEFAULT_OFFSET);
+  };
+  var getClassName = function getClassName() {
+    return (0, _clsx3.clsx)((0, _defineProperty2.default)({}, "".concat(prefixCls, "-rtl"), rtl !== null && rtl !== void 0 ? rtl : direction === 'rtl'));
+  };
+  // ============================== Motion ===============================
+  var getNotificationMotion = function getNotificationMotion() {
+    return (0, _util2.getMotion)(prefixCls, transitionName);
+  };
+  // =============================== Stack ===============================
+  var stackConfig = (0, _useStackConfig.default)(stack, DEFAULT_STACK_CONFIG);
+  // ============================== Origin ===============================
+  var _useRcNotification = (0, _notification.useNotification)({
+      prefixCls: prefixCls,
+      style: getStyle,
+      className: getClassName,
+      motion: getNotificationMotion,
+      // closable=false requires-no closeIcon
+      closable: false,
+      duration: duration,
+      getContainer: function getContainer() {
+        return (staticGetContainer === null || staticGetContainer === void 0 ? void 0 : staticGetContainer()) || (getPopupContainer === null || getPopupContainer === void 0 ? void 0 : getPopupContainer()) || document.body;
+      },
+      maxCount: maxCount,
+      onAllRemoved: onAllRemoved,
+      classNames: mergedClassNames,
+      styles: mergedStyles,
+      renderNotifications: renderNotifications,
+      pauseOnHover: pauseOnHover,
+      stack: stackConfig
+    }),
+    _useRcNotification2 = (0, _slicedToArray2.default)(_useRcNotification, 2),
+    api = _useRcNotification2[0],
+    holder = _useRcNotification2[1];
+  // ================================ Ref ================================
+  React.useImperativeHandle(ref, function () {
+    return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, api), {}, {
+      prefixCls: prefixCls,
+      message: message
+    });
+  });
+  return holder;
+});
+// ==============================================================================
+// ==                                   Hook                                   ==
+// ==============================================================================
+var keyIndex = 0;
+function useInternalMessage(messageConfig) {
+  var holderRef = React.useRef(null);
+  var warning = (0, _warning.devUseWarning)('Message');
+  // ================================ API ================================
+  var wrapAPI = React.useMemo(function () {
+    // Wrap with notification content
+    // >>> close
+    var close = function close(key) {
+      var _holderRef$current;
+      (_holderRef$current = holderRef.current) === null || _holderRef$current === void 0 || _holderRef$current.close(key);
+    };
+    // >>> Open
+    var open = function open(config) {
+      if (!holderRef.current) {
+        process.env.NODE_ENV !== "production" ? warning(false, 'usage', 'You are calling notice in render which will break in React 18 concurrent mode. Please trigger in effect instead.') : void 0;
+        var fakeResult = function fakeResult() {};
+        fakeResult.then = function () {};
+        return fakeResult;
+      }
+      var _holderRef$current2 = holderRef.current,
+        originOpen = _holderRef$current2.open,
+        prefixCls = _holderRef$current2.prefixCls,
+        message = _holderRef$current2.message;
+      var contextClassName = (message === null || message === void 0 ? void 0 : message.className) || {};
+      var contextStyle = (message === null || message === void 0 ? void 0 : message.style) || {};
+      var noticePrefixCls = "".concat(prefixCls, "-notice");
+      var content = config.content,
+        icon = config.icon,
+        type = config.type,
+        key = config.key,
+        className = config.className,
+        style = config.style,
+        _onClose = config.onClose,
+        _config$classNames = config.classNames,
+        configClassNames = _config$classNames === void 0 ? {} : _config$classNames,
+        _config$styles = config.styles,
+        styles = _config$styles === void 0 ? {} : _config$styles,
+        restConfig = (0, _objectWithoutProperties2.default)(config, _excluded);
+      var mergedKey = key;
+      if (!(0, _is.isNonNullable)(mergedKey)) {
+        keyIndex += 1;
+        mergedKey = "antd-message-".concat(keyIndex);
+      }
+      var contextConfig = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, messageConfig), config);
+      var semanticClassNames = (0, _useMergeSemantic3.resolveStyleOrClass)(configClassNames, {
+        props: contextConfig
+      });
+      var semanticStyles = (0, _useMergeSemantic3.resolveStyleOrClass)(styles, {
+        props: contextConfig
+      });
+      var iconNode = (0, _PurePanel.getMessageIcon)(type, icon);
+      var typeIconCls = type ? "".concat(noticePrefixCls, "-icon-").concat(type) : undefined;
+      return (0, _util2.wrapPromiseFn)(function (resolve) {
+        originOpen((0, _objectSpread2.default)((0, _objectSpread2.default)({}, restConfig), {}, {
+          key: mergedKey,
+          icon: iconNode,
+          title: content,
+          classNames: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, semanticClassNames), {}, {
+            wrapper: (0, _clsx3.clsx)(type && "".concat(prefixCls, "-").concat(type), semanticClassNames.wrapper),
+            icon: (0, _clsx3.clsx)(typeIconCls, semanticClassNames.icon)
+          }),
+          styles: semanticStyles,
+          placement: 'top',
+          className: (0, _clsx3.clsx)((0, _defineProperty2.default)({}, "".concat(noticePrefixCls, "-").concat(type), type), className, contextClassName),
+          style: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, contextStyle), style),
+          onClose: function onClose() {
+            _onClose === null || _onClose === void 0 || _onClose();
+            resolve();
+          }
+        }));
+        // Return close function
+        return function () {
+          close(mergedKey);
+        };
+      });
+    };
+    // >>> destroy
+    var destroy = function destroy(key) {
+      if (key !== undefined) {
+        close(key);
+      } else {
+        var _holderRef$current3;
+        (_holderRef$current3 = holderRef.current) === null || _holderRef$current3 === void 0 || _holderRef$current3.destroy();
+      }
+    };
+    var clone = {
+      open: open,
+      destroy: destroy
+    };
+    var keys = ['info', 'success', 'warning', 'error', 'loading'];
+    keys.forEach(function (type) {
+      var typeOpen = function typeOpen(jointContent, duration, onClose) {
+        var config;
+        if ((0, _is.isPlainObject)(jointContent) && 'content' in jointContent) {
+          config = jointContent;
+        } else {
+          config = {
+            content: jointContent
+          };
+        }
+        // Params
+        var mergedDuration;
+        var mergedOnClose;
+        if ((0, _is.isFunction)(duration)) {
+          mergedOnClose = duration;
+        } else {
+          mergedDuration = duration;
+          mergedOnClose = onClose;
+        }
+        var mergedConfig = (0, _objectSpread2.default)((0, _objectSpread2.default)({
+          onClose: mergedOnClose,
+          duration: mergedDuration
+        }, config), {}, {
+          type: type
+        });
+        return open(mergedConfig);
+      };
+      clone[type] = typeOpen;
+    });
+    return clone;
+  }, []);
+  // ============================== Return ===============================
+  return [wrapAPI, /*#__PURE__*/React.createElement(Holder, (0, _objectSpread2.default)((0, _objectSpread2.default)({
+    key: "message-holder"
+  }, messageConfig), {}, {
+    ref: holderRef
+  }))];
+}
+function useMessage(messageConfig) {
+  return useInternalMessage(messageConfig);
+}

package/lib/message/util.d.ts

@@ -0,0 +1,4 @@
+import type { CSSMotionProps } from '@rc-component/motion';
+export declare function getMotion(prefixCls: string, transitionName?: string): CSSMotionProps;
+/** Wrap message open with promise like function */
+export declare function wrapPromiseFn(openFn: (resolve: VoidFunction) => VoidFunction): any;

package/lib/message/util.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getMotion = getMotion;
+exports.wrapPromiseFn = wrapPromiseFn;
+function getMotion(prefixCls, transitionName) {
+  return {
+    motionName: transitionName !== null && transitionName !== void 0 ? transitionName : "".concat(prefixCls, "-fade")
+  };
+}
+/** Wrap message open with promise like function */
+function wrapPromiseFn(openFn) {
+  var closeFn;
+  var closePromise = new Promise(function (resolve) {
+    closeFn = openFn(function () {
+      resolve(true);
+    });
+  });
+  var result = function result() {
+    var _closeFn;
+    (_closeFn = closeFn) === null || _closeFn === void 0 || _closeFn();
+  };
+  result.then = function (filled, rejected) {
+    return closePromise.then(filled, rejected);
+  };
+  result.promise = closePromise;
+  return result;
+}

package/lib/message.d.ts

@@ -0,0 +1,2 @@
+export * from './message/index';
+export { default } from './message/index';

package/lib/message.js

@@ -0,0 +1 @@
+module.exports = require('./message/index.js');

package/lib/modal/ConfirmDialog.d.ts

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import type { ThemeConfig } from '../config-provider';
+import type { ModalFuncProps, ModalLocale } from './interface';
+export interface ConfirmDialogProps extends ModalFuncProps {
+    prefixCls: string;
+    afterClose?: () => void;
+    close?: (...args: any[]) => void;
+    /**
+     * `close` prop support `...args` that pass to the developer
+     * that we can not break this.
+     * Provider `onClose` for internal usage
+     */
+    onConfirm?: (confirmed: boolean) => void;
+    autoFocusButton?: null | 'ok' | 'cancel';
+    rootPrefixCls?: string;
+    iconPrefixCls?: string;
+    /**
+     * Only passed by static method
+     */
+    theme?: ThemeConfig;
+    /** @private Internal Usage. Do not override this */
+    locale?: ModalLocale;
+    /**
+     * Do not throw if is await mode
+     */
+    isSilent?: () => boolean;
+}
+export declare const ConfirmContent: React.FC<ConfirmDialogProps & {
+    confirmPrefixCls: string;
+    contentClassName?: string;
+    contentStyle?: React.CSSProperties;
+}>;
+declare const ConfirmDialogWrapper: React.FC<ConfirmDialogProps>;
+export default ConfirmDialogWrapper;

package/lib/modal/ConfirmDialog.js

@@ -0,0 +1,245 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ConfirmContent = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var React = _interopRequireWildcard(require("react"));
+var _CheckCircleFilled = _interopRequireDefault(require("@996-design/996-icons/CheckCircleFilled"));
+var _CloseCircleFilled = _interopRequireDefault(require("@996-design/996-icons/CloseCircleFilled"));
+var _ExclamationCircleFilled = _interopRequireDefault(require("@996-design/996-icons/ExclamationCircleFilled"));
+var _InfoCircleFilled = _interopRequireDefault(require("@996-design/996-icons/InfoCircleFilled"));
+var _util = require("@rc-component/util");
+var _clsx4 = require("clsx");
+var _fallbackProp = _interopRequireDefault(require("../_util/fallbackProp"));
+var _hooks = require("../_util/hooks");
+var _is = require("../_util/is");
+var _motion = require("../_util/motion");
+var _warning = require("../_util/warning");
+var _configProvider = _interopRequireDefault(require("../config-provider"));
+var _context = require("../config-provider/context");
+var _locale = require("../locale");
+var _useToken3 = _interopRequireDefault(require("../theme/useToken"));
+var _ConfirmCancelBtn = _interopRequireDefault(require("./components/ConfirmCancelBtn"));
+var _ConfirmOkBtn = _interopRequireDefault(require("./components/ConfirmOkBtn"));
+var _context2 = require("./context");
+var _Modal = _interopRequireDefault(require("./Modal"));
+var _confirm = _interopRequireDefault(require("./style/confirm"));
+var _excluded = ["prefixCls", "icon", "okText", "cancelText", "confirmPrefixCls", "type", "okCancel", "footer", "locale", "autoFocusButton", "focusable", "contentClassName", "contentStyle"];
+var CONFIRM_OMIT_SEMANTIC_NAMES = ['body'];
+var ConfirmContent = exports.ConfirmContent = function ConfirmContent(props) {
+  var prefixCls = props.prefixCls,
+    icon = props.icon,
+    okText = props.okText,
+    cancelText = props.cancelText,
+    confirmPrefixCls = props.confirmPrefixCls,
+    type = props.type,
+    okCancel = props.okCancel,
+    footer = props.footer,
+    staticLocale = props.locale,
+    autoFocusButton = props.autoFocusButton,
+    focusable = props.focusable,
+    contentClassName = props.contentClassName,
+    contentStyle = props.contentStyle,
+    restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
+  var _useComponentConfig = (0, _context.useComponentConfig)('modal'),
+    infoIcon = _useComponentConfig.infoIcon,
+    successIcon = _useComponentConfig.successIcon,
+    errorIcon = _useComponentConfig.errorIcon,
+    warningIcon = _useComponentConfig.warningIcon;
+  if (process.env.NODE_ENV !== 'production') {
+    var warning = (0, _warning.devUseWarning)('Modal');
+    process.env.NODE_ENV !== "production" ? warning(!(typeof icon === 'string' && icon.length > 2), 'breaking', "`icon` is using ReactNode instead of string naming in v4. Please check `".concat(icon, "` at https://ant.design/components/icon")) : void 0;
+  }
+  // Icon
+  var mergedIcon = icon;
+  // 支持传入 { icon: null } 或 { icon: false } 来隐藏`Modal.confirm`默认的Icon
+  if (icon === undefined) {
+    switch (type) {
+      case 'info':
+        mergedIcon = (0, _fallbackProp.default)(infoIcon, /*#__PURE__*/React.createElement(_InfoCircleFilled.default, null));
+        break;
+      case 'success':
+        mergedIcon = (0, _fallbackProp.default)(successIcon, /*#__PURE__*/React.createElement(_CheckCircleFilled.default, null));
+        break;
+      case 'error':
+        mergedIcon = (0, _fallbackProp.default)(errorIcon, /*#__PURE__*/React.createElement(_CloseCircleFilled.default, null));
+        break;
+      default:
+        mergedIcon = (0, _fallbackProp.default)(warningIcon, /*#__PURE__*/React.createElement(_ExclamationCircleFilled.default, null));
+    }
+  }
+  // 默认为 true，保持向下兼容
+  var mergedOkCancel = okCancel !== null && okCancel !== void 0 ? okCancel : type === 'confirm';
+  var mergedAutoFocusButton = React.useMemo(function () {
+    var base = (focusable === null || focusable === void 0 ? void 0 : focusable.autoFocusButton) || autoFocusButton;
+    return base || base === null ? base : 'ok';
+  }, [autoFocusButton, focusable === null || focusable === void 0 ? void 0 : focusable.autoFocusButton]);
+  var _useLocale = (0, _locale.useLocale)('Modal'),
+    _useLocale2 = (0, _slicedToArray2.default)(_useLocale, 1),
+    locale = _useLocale2[0];
+  var mergedLocale = staticLocale || locale;
+  // ================== Locale Text ==================
+  var okTextLocale = okText || (mergedOkCancel ? mergedLocale === null || mergedLocale === void 0 ? void 0 : mergedLocale.okText : mergedLocale === null || mergedLocale === void 0 ? void 0 : mergedLocale.justOkText);
+  var cancelTextLocale = cancelText || (mergedLocale === null || mergedLocale === void 0 ? void 0 : mergedLocale.cancelText);
+  // ================= Context Value =================
+  var closable = restProps.closable;
+  var _ref = (0, _is.isPlainObject)(closable) ? closable : {},
+    onClose = _ref.onClose;
+  var memoizedValue = React.useMemo(function () {
+    return (0, _objectSpread2.default)({
+      autoFocusButton: mergedAutoFocusButton,
+      cancelTextLocale: cancelTextLocale,
+      okTextLocale: okTextLocale,
+      mergedOkCancel: mergedOkCancel,
+      onClose: onClose
+    }, restProps);
+  }, [mergedAutoFocusButton, cancelTextLocale, okTextLocale, mergedOkCancel, onClose, restProps]);
+  // ====================== Footer Origin Node ======================
+  var footerOriginNode = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_ConfirmCancelBtn.default, null), /*#__PURE__*/React.createElement(_ConfirmOkBtn.default, null));
+  var hasTitle = (0, _is.isReactRenderable)(props.title);
+  var hasIcon = (0, _is.isReactRenderable)(mergedIcon);
+  var bodyCls = "".concat(confirmPrefixCls, "-body");
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(confirmPrefixCls, "-body-wrapper")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: (0, _clsx4.clsx)(bodyCls, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(bodyCls, "-has-title"), hasTitle), "".concat(bodyCls, "-no-icon"), !hasIcon))
+  }, mergedIcon, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(confirmPrefixCls, "-paragraph")
+  }, hasTitle && /*#__PURE__*/React.createElement("span", {
+    className: "".concat(confirmPrefixCls, "-title")
+  }, props.title), /*#__PURE__*/React.createElement("div", {
+    className: (0, _clsx4.clsx)("".concat(confirmPrefixCls, "-content"), contentClassName),
+    style: contentStyle
+  }, props.content))), footer === undefined || (0, _is.isFunction)(footer) ? (/*#__PURE__*/React.createElement(_context2.ModalContextProvider, {
+    value: memoizedValue
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(confirmPrefixCls, "-btns")
+  }, (0, _is.isFunction)(footer) ? footer(footerOriginNode, {
+    OkBtn: _ConfirmOkBtn.default,
+    CancelBtn: _ConfirmCancelBtn.default
+  }) : footerOriginNode))) : footer, /*#__PURE__*/React.createElement(_confirm.default, {
+    prefixCls: prefixCls
+  }));
+};
+var ConfirmDialog = function ConfirmDialog(props) {
+  var close = props.close,
+    zIndex = props.zIndex,
+    maskStyle = props.maskStyle,
+    direction = props.direction,
+    prefixCls = props.prefixCls,
+    wrapClassName = props.wrapClassName,
+    rootPrefixCls = props.rootPrefixCls,
+    bodyStyle = props.bodyStyle,
+    _props$closable = props.closable,
+    closable = _props$closable === void 0 ? false : _props$closable,
+    onConfirm = props.onConfirm,
+    styles = props.styles,
+    title = props.title,
+    mask = props.mask,
+    maskClosable = props.maskClosable,
+    okButtonProps = props.okButtonProps,
+    cancelButtonProps = props.cancelButtonProps;
+  var _useComponentConfig2 = (0, _context.useComponentConfig)('modal'),
+    contextCancelButtonProps = _useComponentConfig2.cancelButtonProps,
+    contextOkButtonProps = _useComponentConfig2.okButtonProps;
+  if (process.env.NODE_ENV !== 'production') {
+    var warning = (0, _warning.devUseWarning)('Modal');
+    [['bodyStyle', 'styles.body'], ['maskStyle', 'styles.mask']].forEach(function (_ref2) {
+      var _ref3 = (0, _slicedToArray2.default)(_ref2, 2),
+        deprecatedName = _ref3[0],
+        newName = _ref3[1];
+      warning.deprecated(!(deprecatedName in props), deprecatedName, newName);
+    });
+  }
+  var confirmPrefixCls = "".concat(prefixCls, "-confirm");
+  var width = props.width || 416;
+  var style = props.style || {};
+  var semanticStyles = (0, _is.isFunction)(styles) ? function (info) {
+    return (0, _objectSpread2.default)({
+      body: bodyStyle,
+      mask: maskStyle
+    }, styles(info));
+  } : (0, _objectSpread2.default)({
+    body: bodyStyle,
+    mask: maskStyle
+  }, styles);
+  var modalProps = (0, _util.omit)(props, ['bodyStyle', 'maskStyle']);
+  var classString = (0, _clsx4.clsx)(confirmPrefixCls, "".concat(confirmPrefixCls, "-").concat(props.type), (0, _defineProperty2.default)({}, "".concat(confirmPrefixCls, "-rtl"), direction === 'rtl'), props.className);
+  // ========================== Mask ==========================
+  // 默认为 false，保持旧版默认行为
+  var mergedMask = React.useMemo(function () {
+    var _nextMaskConfig$closa;
+    var nextMaskConfig = (0, _hooks.normalizeMaskConfig)(mask, maskClosable);
+    (_nextMaskConfig$closa = nextMaskConfig.closable) !== null && _nextMaskConfig$closa !== void 0 ? _nextMaskConfig$closa : nextMaskConfig.closable = false;
+    return nextMaskConfig;
+  }, [mask, maskClosable]);
+  // ========================= zIndex =========================
+  var _useToken = (0, _useToken3.default)(),
+    _useToken2 = (0, _slicedToArray2.default)(_useToken, 2),
+    token = _useToken2[1];
+  var mergedZIndex = React.useMemo(function () {
+    if (zIndex !== undefined) {
+      return zIndex;
+    }
+    // Static always use max zIndex
+    return token.zIndexPopupBase + _hooks.CONTAINER_MAX_OFFSET;
+  }, [zIndex, token]);
+  // ========================= Render =========================
+  return /*#__PURE__*/React.createElement(_Modal.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, modalProps), {}, {
+    className: classString,
+    wrapClassName: (0, _clsx4.clsx)((0, _defineProperty2.default)({}, "".concat(confirmPrefixCls, "-centered"), !!props.centered), wrapClassName),
+    onCancel: function onCancel() {
+      close === null || close === void 0 || close({
+        triggerCancel: true
+      });
+      onConfirm === null || onConfirm === void 0 || onConfirm(false);
+    },
+    title: title,
+    footer: null,
+    transitionName: (0, _motion.getTransitionName)(rootPrefixCls || '', 'zoom', props.transitionName),
+    maskTransitionName: (0, _motion.getTransitionName)(rootPrefixCls || '', 'fade', props.maskTransitionName),
+    mask: mergedMask,
+    style: style,
+    styles: semanticStyles,
+    width: width,
+    zIndex: mergedZIndex,
+    closable: closable,
+    _semanticOmit: CONFIRM_OMIT_SEMANTIC_NAMES,
+    _renderSemanticContent: function _renderSemanticContent(_ref4) {
+      var mergedClassNames = _ref4.classNames,
+        mergedStyles = _ref4.styles;
+      return /*#__PURE__*/React.createElement(ConfirmContent, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
+        confirmPrefixCls: confirmPrefixCls,
+        okButtonProps: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, contextOkButtonProps), okButtonProps),
+        cancelButtonProps: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, contextCancelButtonProps), cancelButtonProps),
+        contentClassName: mergedClassNames.body,
+        contentStyle: mergedStyles.body
+      }));
+    }
+  }));
+};
+var ConfirmDialogWrapper = function ConfirmDialogWrapper(props) {
+  var rootPrefixCls = props.rootPrefixCls,
+    iconPrefixCls = props.iconPrefixCls,
+    direction = props.direction,
+    theme = props.theme;
+  return /*#__PURE__*/React.createElement(_configProvider.default, {
+    prefixCls: rootPrefixCls,
+    iconPrefixCls: iconPrefixCls,
+    direction: direction,
+    theme: theme
+  }, /*#__PURE__*/React.createElement(ConfirmDialog, (0, _objectSpread2.default)({}, props)));
+};
+if (process.env.NODE_ENV !== 'production') {
+  ConfirmDialog.displayName = 'ConfirmDialog';
+  ConfirmDialogWrapper.displayName = 'ConfirmDialogWrapper';
+}
+var _default = exports.default = ConfirmDialogWrapper;

package/lib/modal/Modal.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import type { ModalProps } from './interface';
+declare const Modal: React.FC<ModalProps>;
+export default Modal;