From fdbd6ed70db58c6626054a2cbb6a44883e872d23 Mon Sep 17 00:00:00 2001
From: bot-frontend <bot-frontend@gendsgn.local>
Date: Sat, 30 May 2026 16:37:03 +0000
Subject: [PATCH] =?UTF-8?q?fix(tradein):=20MapPicker=20=D1=87=D0=B5=D1=80?=
 =?UTF-8?q?=D0=B5=D0=B7=20portal=20=D0=B2=20document.body=20=E2=80=94=20z-?=
 =?UTF-8?q?index=20=D0=BA=D0=BE=D0=BD=D1=84=D0=BB=D0=B8=D0=BA=D1=82=20?=
 =?UTF-8?q?=D1=81=20SourcesProgress=20(#771)=20(#782)=20Co-authored-by:=20?=
 =?UTF-8?q?bot-frontend=20<bot-frontend@gendsgn.local>=20Co-committed-by:?=
 =?UTF-8?q?=20bot-frontend=20<bot-frontend@gendsgn.local>?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../frontend/src/components/trade-in/MapPicker.tsx  | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/tradein-mvp/frontend/src/components/trade-in/MapPicker.tsx b/tradein-mvp/frontend/src/components/trade-in/MapPicker.tsx
index 2836dac8..316f9461 100644
--- a/tradein-mvp/frontend/src/components/trade-in/MapPicker.tsx
+++ b/tradein-mvp/frontend/src/components/trade-in/MapPicker.tsx
@@ -3,6 +3,7 @@
 /* Выбор адреса на карте ЕКБ (Leaflet + OSM). Клик по дому → reverse-геокодинг. */
 /* eslint-disable @typescript-eslint/no-explicit-any -- интероп с CDN-библиотекой Leaflet */
 import { useEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
 
 import { API_BASE_URL } from "@/lib/api";
 
@@ -98,6 +99,11 @@ export function MapPicker({ onPick, onClose }: Props) {
   // тонкий hint «Точка дома по Яндексу», чтобы user понимал почему marker
   // переехал на пару метров от его клика.
   const [snapped, setSnapped] = useState(false);
+  // Portal-mount guard (SSR-safe): document доступен только после монтирования.
+  // Рендерим оверлей в document.body, чтобы position:fixed/z-index:1000 не были
+  // заперты в stacking-context формы (#771: полоски SourcesProgress наезжали).
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => setMounted(true), []);
 
   useEffect(() => {
     let map: any = null;
@@ -212,7 +218,9 @@ export function MapPicker({ onPick, onClose }: Props) {
     }
   };
 
-  return (
+  if (!mounted) return null;
+
+  return createPortal(
     <div
       onClick={onClose}
       style={{
@@ -316,6 +324,7 @@ export function MapPicker({ onPick, onClose }: Props) {
           </button>
         </div>
       </div>
-    </div>
+    </div>,
+    document.body,
   );
 }