ConfirmDialog.js 8.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
  1. "use strict";
  2. "use client";
  3. var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
  4. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
  5. Object.defineProperty(exports, "__esModule", {
  6. value: true
  7. });
  8. exports.ConfirmContent = ConfirmContent;
  9. exports.default = void 0;
  10. var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
  11. var React = _interopRequireWildcard(require("react"));
  12. var _CheckCircleFilled = _interopRequireDefault(require("@ant-design/icons/CheckCircleFilled"));
  13. var _CloseCircleFilled = _interopRequireDefault(require("@ant-design/icons/CloseCircleFilled"));
  14. var _ExclamationCircleFilled = _interopRequireDefault(require("@ant-design/icons/ExclamationCircleFilled"));
  15. var _InfoCircleFilled = _interopRequireDefault(require("@ant-design/icons/InfoCircleFilled"));
  16. var _classnames = _interopRequireDefault(require("classnames"));
  17. var _useZIndex = require("../_util/hooks/useZIndex");
  18. var _motion = require("../_util/motion");
  19. var _warning = require("../_util/warning");
  20. var _configProvider = _interopRequireDefault(require("../config-provider"));
  21. var _locale = require("../locale");
  22. var _useToken = _interopRequireDefault(require("../theme/useToken"));
  23. var _ConfirmCancelBtn = _interopRequireDefault(require("./components/ConfirmCancelBtn"));
  24. var _ConfirmOkBtn = _interopRequireDefault(require("./components/ConfirmOkBtn"));
  25. var _context = require("./context");
  26. var _Modal = _interopRequireDefault(require("./Modal"));
  27. var _confirm = _interopRequireDefault(require("./style/confirm"));
  28. var __rest = void 0 && (void 0).__rest || function (s, e) {
  29. var t = {};
  30. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  31. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  32. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  33. }
  34. return t;
  35. };
  36. function ConfirmContent(props) {
  37. const {
  38. prefixCls,
  39. icon,
  40. okText,
  41. cancelText,
  42. confirmPrefixCls,
  43. type,
  44. okCancel,
  45. footer,
  46. // Legacy for static function usage
  47. locale: staticLocale
  48. } = props,
  49. resetProps = __rest(props, ["prefixCls", "icon", "okText", "cancelText", "confirmPrefixCls", "type", "okCancel", "footer", "locale"]);
  50. if (process.env.NODE_ENV !== 'production') {
  51. const warning = (0, _warning.devUseWarning)('Modal');
  52. 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 \`${icon}\` at https://ant.design/components/icon`) : void 0;
  53. }
  54. // Icon
  55. let mergedIcon = icon;
  56. // 支持传入{ icon: null }来隐藏`Modal.confirm`默认的Icon
  57. if (!icon && icon !== null) {
  58. switch (type) {
  59. case 'info':
  60. mergedIcon = /*#__PURE__*/React.createElement(_InfoCircleFilled.default, null);
  61. break;
  62. case 'success':
  63. mergedIcon = /*#__PURE__*/React.createElement(_CheckCircleFilled.default, null);
  64. break;
  65. case 'error':
  66. mergedIcon = /*#__PURE__*/React.createElement(_CloseCircleFilled.default, null);
  67. break;
  68. default:
  69. mergedIcon = /*#__PURE__*/React.createElement(_ExclamationCircleFilled.default, null);
  70. }
  71. }
  72. // 默认为 true,保持向下兼容
  73. const mergedOkCancel = okCancel !== null && okCancel !== void 0 ? okCancel : type === 'confirm';
  74. const autoFocusButton = props.autoFocusButton === null ? false : props.autoFocusButton || 'ok';
  75. const [locale] = (0, _locale.useLocale)('Modal');
  76. const mergedLocale = staticLocale || locale;
  77. // ================== Locale Text ==================
  78. const okTextLocale = okText || (mergedOkCancel ? mergedLocale === null || mergedLocale === void 0 ? void 0 : mergedLocale.okText : mergedLocale === null || mergedLocale === void 0 ? void 0 : mergedLocale.justOkText);
  79. const cancelTextLocale = cancelText || (mergedLocale === null || mergedLocale === void 0 ? void 0 : mergedLocale.cancelText);
  80. // ================= Context Value =================
  81. const btnCtxValue = Object.assign({
  82. autoFocusButton,
  83. cancelTextLocale,
  84. okTextLocale,
  85. mergedOkCancel
  86. }, resetProps);
  87. const btnCtxValueMemo = React.useMemo(() => btnCtxValue, (0, _toConsumableArray2.default)(Object.values(btnCtxValue)));
  88. // ====================== Footer Origin Node ======================
  89. const footerOriginNode = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_ConfirmCancelBtn.default, null), /*#__PURE__*/React.createElement(_ConfirmOkBtn.default, null));
  90. const hasTitle = props.title !== undefined && props.title !== null;
  91. const bodyCls = `${confirmPrefixCls}-body`;
  92. return /*#__PURE__*/React.createElement("div", {
  93. className: `${confirmPrefixCls}-body-wrapper`
  94. }, /*#__PURE__*/React.createElement("div", {
  95. className: (0, _classnames.default)(bodyCls, {
  96. [`${bodyCls}-has-title`]: hasTitle
  97. })
  98. }, mergedIcon, /*#__PURE__*/React.createElement("div", {
  99. className: `${confirmPrefixCls}-paragraph`
  100. }, hasTitle && /*#__PURE__*/React.createElement("span", {
  101. className: `${confirmPrefixCls}-title`
  102. }, props.title), /*#__PURE__*/React.createElement("div", {
  103. className: `${confirmPrefixCls}-content`
  104. }, props.content))), footer === undefined || typeof footer === 'function' ? (/*#__PURE__*/React.createElement(_context.ModalContextProvider, {
  105. value: btnCtxValueMemo
  106. }, /*#__PURE__*/React.createElement("div", {
  107. className: `${confirmPrefixCls}-btns`
  108. }, typeof footer === 'function' ? footer(footerOriginNode, {
  109. OkBtn: _ConfirmOkBtn.default,
  110. CancelBtn: _ConfirmCancelBtn.default
  111. }) : footerOriginNode))) : footer, /*#__PURE__*/React.createElement(_confirm.default, {
  112. prefixCls: prefixCls
  113. }));
  114. }
  115. const ConfirmDialog = props => {
  116. const {
  117. close,
  118. zIndex,
  119. maskStyle,
  120. direction,
  121. prefixCls,
  122. wrapClassName,
  123. rootPrefixCls,
  124. bodyStyle,
  125. closable = false,
  126. onConfirm,
  127. styles
  128. } = props;
  129. if (process.env.NODE_ENV !== 'production') {
  130. const warning = (0, _warning.devUseWarning)('Modal');
  131. [['visible', 'open'], ['bodyStyle', 'styles.body'], ['maskStyle', 'styles.mask']].forEach(([deprecatedName, newName]) => {
  132. warning.deprecated(!(deprecatedName in props), deprecatedName, newName);
  133. });
  134. }
  135. const confirmPrefixCls = `${prefixCls}-confirm`;
  136. const width = props.width || 416;
  137. const style = props.style || {};
  138. const mask = props.mask === undefined ? true : props.mask;
  139. // 默认为 false,保持旧版默认行为
  140. const maskClosable = props.maskClosable === undefined ? false : props.maskClosable;
  141. const classString = (0, _classnames.default)(confirmPrefixCls, `${confirmPrefixCls}-${props.type}`, {
  142. [`${confirmPrefixCls}-rtl`]: direction === 'rtl'
  143. }, props.className);
  144. // ========================= zIndex =========================
  145. const [, token] = (0, _useToken.default)();
  146. const mergedZIndex = React.useMemo(() => {
  147. if (zIndex !== undefined) {
  148. return zIndex;
  149. }
  150. // Static always use max zIndex
  151. return token.zIndexPopupBase + _useZIndex.CONTAINER_MAX_OFFSET;
  152. }, [zIndex, token]);
  153. // ========================= Render =========================
  154. return /*#__PURE__*/React.createElement(_Modal.default, Object.assign({}, props, {
  155. className: classString,
  156. wrapClassName: (0, _classnames.default)({
  157. [`${confirmPrefixCls}-centered`]: !!props.centered
  158. }, wrapClassName),
  159. onCancel: () => {
  160. close === null || close === void 0 ? void 0 : close({
  161. triggerCancel: true
  162. });
  163. onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm(false);
  164. },
  165. title: "",
  166. footer: null,
  167. transitionName: (0, _motion.getTransitionName)(rootPrefixCls || '', 'zoom', props.transitionName),
  168. maskTransitionName: (0, _motion.getTransitionName)(rootPrefixCls || '', 'fade', props.maskTransitionName),
  169. mask: mask,
  170. maskClosable: maskClosable,
  171. style: style,
  172. styles: Object.assign({
  173. body: bodyStyle,
  174. mask: maskStyle
  175. }, styles),
  176. width: width,
  177. zIndex: mergedZIndex,
  178. closable: closable
  179. }), /*#__PURE__*/React.createElement(ConfirmContent, Object.assign({}, props, {
  180. confirmPrefixCls: confirmPrefixCls
  181. })));
  182. };
  183. const ConfirmDialogWrapper = props => {
  184. const {
  185. rootPrefixCls,
  186. iconPrefixCls,
  187. direction,
  188. theme
  189. } = props;
  190. return /*#__PURE__*/React.createElement(_configProvider.default, {
  191. prefixCls: rootPrefixCls,
  192. iconPrefixCls: iconPrefixCls,
  193. direction: direction,
  194. theme: theme
  195. }, /*#__PURE__*/React.createElement(ConfirmDialog, Object.assign({}, props)));
  196. };
  197. if (process.env.NODE_ENV !== 'production') {
  198. ConfirmDialog.displayName = 'ConfirmDialog';
  199. ConfirmDialogWrapper.displayName = 'ConfirmDialogWrapper';
  200. }
  201. var _default = exports.default = ConfirmDialogWrapper;