From 6aff196c901e0e8f6910b39194107135d0a8b309 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E7=88=B1=E5=90=83=E7=99=BD=E8=90=9D?=
 =?UTF-8?q?=E5=8D=9C?= <smith3816@gmail.com>
Date: Wed, 22 Nov 2023 18:02:32 +0800
Subject: [PATCH] fix: Static method provides wrong zIndex context (#46012)

* fix: static confirm should has correct zIndex

* test: update test case

* chore: reorder

* fix: bump logic
---
 components/_util/__tests__/useZIndex.test.tsx |  6 +-
 components/_util/hooks/useZIndex.tsx          |  6 ++
 components/modal/ConfirmDialog.tsx            |  6 +-
 .../__snapshots__/demo-extend.test.ts.snap    | 69 +++++++++++++------
 .../__snapshots__/demo.test.tsx.snap          | 69 +++++++++++++------
 components/modal/demo/nested.tsx              | 11 ++-
 scripts/post-script.ts                        |  1 +
 7 files changed, 122 insertions(+), 46 deletions(-)

diff --git a/components/_util/__tests__/useZIndex.test.tsx b/components/_util/__tests__/useZIndex.test.tsx
index a5531cadeeb0..be5da90d1305 100644
--- a/components/_util/__tests__/useZIndex.test.tsx
+++ b/components/_util/__tests__/useZIndex.test.tsx
@@ -349,7 +349,7 @@ describe('Test useZIndex hooks', () => {
 
     const instance = Modal.confirm({
       title: 'bamboo',
-      content: 'little',
+      content: <Select open />,
     });
 
     await waitFakeTimer();
@@ -358,6 +358,10 @@ describe('Test useZIndex hooks', () => {
       zIndex: '2000',
     });
 
+    expect(document.querySelector('.ant-select-dropdown')).toHaveStyle({
+      zIndex: '2050',
+    });
+
     instance.destroy();
 
     await waitFakeTimer();
diff --git a/components/_util/hooks/useZIndex.tsx b/components/_util/hooks/useZIndex.tsx
index ad35fd7657b3..786c3fd7405e 100644
--- a/components/_util/hooks/useZIndex.tsx
+++ b/components/_util/hooks/useZIndex.tsx
@@ -44,7 +44,13 @@ export function useZIndex(
   const [, token] = useToken();
   const parentZIndex = React.useContext(zIndexContext);
   const isContainer = isContainerType(componentType);
+
+  if (customZIndex !== undefined) {
+    return [customZIndex, customZIndex];
+  }
+
   let zIndex = parentZIndex ?? 0;
+
   if (isContainer) {
     zIndex +=
       // Use preset token zIndex by default but not stack when has parent container
diff --git a/components/modal/ConfirmDialog.tsx b/components/modal/ConfirmDialog.tsx
index 7e4c71996483..15c7b07009d7 100644
--- a/components/modal/ConfirmDialog.tsx
+++ b/components/modal/ConfirmDialog.tsx
@@ -17,7 +17,7 @@ import OkBtn from './components/ConfirmOkBtn';
 import type { ModalContextProps } from './context';
 import { ModalContextProvider } from './context';
 import type { ModalFuncProps, ModalLocale } from './interface';
-import Dialog from './Modal';
+import Modal from './Modal';
 import ConfirmCmp from './style/confirmCmp';
 
 export interface ConfirmDialogProps extends ModalFuncProps {
@@ -233,7 +233,7 @@ const ConfirmDialog: React.FC<ConfirmDialogProps> = (props) => {
 
   // ========================= Render =========================
   return (
-    <Dialog
+    <Modal
       prefixCls={prefixCls}
       className={classString}
       wrapClassName={classNames(
@@ -269,7 +269,7 @@ const ConfirmDialog: React.FC<ConfirmDialogProps> = (props) => {
       focusTriggerAfterClose={focusTriggerAfterClose}
     >
       <ConfirmContent {...props} confirmPrefixCls={confirmPrefixCls} />
-    </Dialog>
+    </Modal>
   );
 };
 
diff --git a/components/modal/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/modal/__tests__/__snapshots__/demo-extend.test.ts.snap
index f45cbb2bb105..9bef2aa2885d 100644
--- a/components/modal/__tests__/__snapshots__/demo-extend.test.ts.snap
+++ b/components/modal/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -670,31 +670,60 @@ exports[`renders components/modal/demo/modal-render.tsx extend context correctly
 exports[`renders components/modal/demo/modal-render.tsx extend context correctly 2`] = `[]`;
 
 exports[`renders components/modal/demo/nested.tsx extend context correctly 1`] = `
-<button
-  aria-checked="false"
-  class="ant-switch"
-  role="switch"
-  style="position: relative; z-index: 0;"
-  type="button"
+<div
+  class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
 >
   <div
-    class="ant-switch-handle"
-  />
-  <span
-    class="ant-switch-inner"
+    class="ant-space-item"
   >
-    <span
-      class="ant-switch-inner-checked"
+    <button
+      aria-checked="false"
+      class="ant-switch"
+      role="switch"
+      style="position: relative; z-index: 0;"
+      type="button"
     >
-      Open
-    </span>
-    <span
-      class="ant-switch-inner-unchecked"
+      <div
+        class="ant-switch-handle"
+      />
+      <span
+        class="ant-switch-inner"
+      >
+        <span
+          class="ant-switch-inner-checked"
+        >
+          Open
+        </span>
+        <span
+          class="ant-switch-inner-unchecked"
+        >
+          Close
+        </span>
+      </span>
+    </button>
+  </div>
+  <div
+    class="ant-space-item"
+  >
+    <button
+      class="ant-btn ant-btn-default"
+      type="button"
     >
-      Close
-    </span>
-  </span>
-</button>
+      <span>
+        Static
+      </span>
+    </button>
+  </div>
+  <div
+    class="ant-space-item"
+  />
+  <div
+    class="ant-space-item"
+  />
+  <div
+    class="ant-space-item"
+  />
+</div>
 `;
 
 exports[`renders components/modal/demo/nested.tsx extend context correctly 2`] = `[]`;
diff --git a/components/modal/__tests__/__snapshots__/demo.test.tsx.snap b/components/modal/__tests__/__snapshots__/demo.test.tsx.snap
index 21e8d6d06209..77b26e875e48 100644
--- a/components/modal/__tests__/__snapshots__/demo.test.tsx.snap
+++ b/components/modal/__tests__/__snapshots__/demo.test.tsx.snap
@@ -640,31 +640,60 @@ exports[`renders components/modal/demo/modal-render.tsx correctly 1`] = `
 `;
 
 exports[`renders components/modal/demo/nested.tsx correctly 1`] = `
-<button
-  aria-checked="false"
-  class="ant-switch"
-  role="switch"
-  style="position:relative;z-index:0"
-  type="button"
+<div
+  class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
 >
   <div
-    class="ant-switch-handle"
-  />
-  <span
-    class="ant-switch-inner"
+    class="ant-space-item"
   >
-    <span
-      class="ant-switch-inner-checked"
+    <button
+      aria-checked="false"
+      class="ant-switch"
+      role="switch"
+      style="position:relative;z-index:0"
+      type="button"
     >
-      Open
-    </span>
-    <span
-      class="ant-switch-inner-unchecked"
+      <div
+        class="ant-switch-handle"
+      />
+      <span
+        class="ant-switch-inner"
+      >
+        <span
+          class="ant-switch-inner-checked"
+        >
+          Open
+        </span>
+        <span
+          class="ant-switch-inner-unchecked"
+        >
+          Close
+        </span>
+      </span>
+    </button>
+  </div>
+  <div
+    class="ant-space-item"
+  >
+    <button
+      class="ant-btn ant-btn-default"
+      type="button"
     >
-      Close
-    </span>
-  </span>
-</button>
+      <span>
+        Static
+      </span>
+    </button>
+  </div>
+  <div
+    class="ant-space-item"
+  />
+  <div
+    class="ant-space-item"
+  />
+  <div
+    class="ant-space-item"
+  />
+</div>
 `;
 
 exports[`renders components/modal/demo/position.tsx correctly 1`] = `
diff --git a/components/modal/demo/nested.tsx b/components/modal/demo/nested.tsx
index 45095455deef..fcb946546c31 100644
--- a/components/modal/demo/nested.tsx
+++ b/components/modal/demo/nested.tsx
@@ -18,14 +18,21 @@ const Demo: React.FC = () => {
 
   const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
 
+  const onShowStatic = () => {
+    Modal.confirm({
+      content: <Select open value="1" options={options} />,
+    });
+  };
+
   return (
-    <>
+    <Space>
       <Switch
         style={{ position: 'relative', zIndex: isModalOpen ? 4000 : 0 }}
         checkedChildren="Open"
         unCheckedChildren="Close"
         onChange={(open) => setIsModalOpen(open)}
       />
+      <Button onClick={onShowStatic}>Static</Button>
       <Modal
         title="Basic Modal"
         open={isModalOpen}
@@ -123,7 +130,7 @@ const Demo: React.FC = () => {
 
       {messageHolder}
       {notificationHolder}
-    </>
+    </Space>
   );
 };
 
diff --git a/scripts/post-script.ts b/scripts/post-script.ts
index 501b97aa8ccb..d58f608ab0d4 100644
--- a/scripts/post-script.ts
+++ b/scripts/post-script.ts
@@ -50,6 +50,7 @@ const DEPRECIATED_VERSION = {
   '5.10.0': ['https://github.com/ant-design/ant-design/issues/45289'],
   '5.11.0': ['https://github.com/ant-design/ant-design/issues/45742'],
   '5.11.1': ['https://github.com/ant-design/ant-design/issues/45883'],
+  '5.11.2': ['https://github.com/ant-design/ant-design/issues/46005'],
 } as const;
 
 function matchDeprecated(v: string) {