feat: Add mask prop for Modal method, close #14177 (#14197)

components/modal/Modal.tsx

@@ -79,6 +79,7 @@ export interface ModalFuncProps {
   icon?: React.ReactNode;
   /* Deperated */
   iconType?: string;
+  mask?: boolean;
   maskClosable?: boolean;
   zIndex?: number;
   okCancel?: boolean;

components/modal/__tests__/confirm.test.js

@@ -168,4 +168,9 @@ describe('Modal.confirm triggers callbacks correctly', () => {
     expect($$('.custom-modal-confirm')).toHaveLength(1);
     expect($$('.custom-modal-confirm-body-wrapper')).toHaveLength(1);
   });
+
+  it('should be Modal.confirm without mask', () => {
+    open({ mask: false });
+    expect($$('.ant-modal-mask')).toHaveLength(0);
+  });
 });

components/modal/confirm.tsx

@@ -43,6 +43,7 @@ const ConfirmDialog = (props: ConfirmDialogProps) => {
   const okCancel = 'okCancel' in props ? props.okCancel! : true;
   const width = props.width || 416;
   const style = props.style || {};
+  const mask = props.mask === undefined ? true : props.mask;
   // 默认为 false，保持旧版默认行为
   const maskClosable = props.maskClosable === undefined ? false : props.maskClosable;
   const runtimeLocale = getConfirmLocale();
@@ -80,6 +81,7 @@ const ConfirmDialog = (props: ConfirmDialogProps) => {
       transitionName="zoom"
       footer=""
       maskTransitionName="fade"
+      mask={mask}
       maskClosable={maskClosable}
       maskStyle={maskStyle}
       style={style}

components/modal/index.en-US.md

@@ -71,6 +71,7 @@ The properties of the object are follows:
 | icon | custom icon (`Added in 3.12.0`) | string\|ReactNode | `<Icon type="question-circle">` |
 | iconType | Icon `type` of the Icon component (deperated after `3.12.0`) | string | `question-circle` |
 | keyboard | Whether support press esc to close | Boolean | true |
+| mask | Whether show mask or not. | Boolean | true |
 | maskClosable | Whether to close the modal dialog when the mask (area outside the modal) is clicked | Boolean | `false` |
 | okText | Text of the OK button | string | `OK` |
 | okType | Button `type` of the OK button | string | `primary` |

components/modal/index.zh-CN.md

@@ -69,6 +69,7 @@ title: Modal
 | content | 内容 | string\|ReactNode | 无 |
 | icon | 自定义图标（3.12.0 新增） | string\|ReactNode | `<Icon type="question-circle">` |
 | iconType | 图标类型（3.12.0 后废弃，请使用 `icon`） | string | `question-circle` |
+| mask | 是否展示遮罩 | Boolean | true |
 | maskClosable | 点击蒙层是否允许关闭 | Boolean | `false` |
 | okText | 确认按钮文字 | string | 确定 |
 | okType | 确认按钮类型 | string | primary |