修复 Agent 对话框覆盖地图区域的问题

src/components/chat/GlobalChatbox.tsx

@@ -3,11 +3,10 @@
 import React, {
   useCallback,
   useEffect,
-  useLayoutEffect,
   useRef,
   useState,
 } from "react";
-import { Box, Drawer, alpha, useMediaQuery, useTheme } from "@mui/material";
+import { Box, Drawer, alpha, useTheme } from "@mui/material";
 
 import type { AgentModel } from "@/lib/chatStream";
 import { AgentComposer } from "./AgentComposer";
@@ -33,7 +32,6 @@ export const GlobalChatbox: React.FC<Props> = ({ open, onClose }) => {
   const bottomRef = useRef<HTMLDivElement>(null);
   const inputRef = useRef<HTMLInputElement | null>(null);
   const theme = useTheme();
-  const isDesktop = useMediaQuery(theme.breakpoints.up("sm"));
 
   const {
     speechState,
@@ -165,32 +163,6 @@ export const GlobalChatbox: React.FC<Props> = ({ open, onClose }) => {
     };
   }, [isResizing]);
 
-  useLayoutEffect(() => {
-    const body = document.body;
-    const html = document.documentElement;
-    const previousBodyPaddingRight = body.style.paddingRight;
-    const previousBodyTransition = body.style.transition;
-    const previousBodyBoxSizing = body.style.boxSizing;
-    const previousHtmlBoxSizing = html.style.boxSizing;
-    const reservedWidth = open && isDesktop ? `${width}px` : "0px";
-
-    body.style.boxSizing = "border-box";
-    html.style.boxSizing = "border-box";
-    body.style.paddingRight = reservedWidth;
-    body.style.transition = isResizing
-      ? previousBodyTransition
-      : [previousBodyTransition, "padding-right 240ms cubic-bezier(0.2, 0.8, 0.2, 1)"]
-          .filter(Boolean)
-          .join(", ");
-
-    return () => {
-      body.style.paddingRight = previousBodyPaddingRight;
-      body.style.transition = previousBodyTransition;
-      body.style.boxSizing = previousBodyBoxSizing;
-      html.style.boxSizing = previousHtmlBoxSizing;
-    };
-  }, [isDesktop, isResizing, open, width]);
-
   return (
     <Drawer
       anchor="right"
@@ -200,7 +172,10 @@ export const GlobalChatbox: React.FC<Props> = ({ open, onClose }) => {
       hideBackdrop
       disableScrollLock
       disableEnforceFocus
-      sx={{ zIndex: (muiTheme) => muiTheme.zIndex.modal + 100 }}
+      sx={{
+        zIndex: (muiTheme) => muiTheme.zIndex.modal + 100,
+        pointerEvents: "none",
+      }}
       PaperProps={{
         sx: {
           width: { xs: "100%", sm: width },
@@ -208,6 +183,7 @@ export const GlobalChatbox: React.FC<Props> = ({ open, onClose }) => {
           boxShadow: "none",
           overflow: open ? "visible" : "hidden",
           zIndex: (muiTheme) => muiTheme.zIndex.modal + 100,
+          pointerEvents: "auto",
           transition: isResizing ? "none" : undefined,
         },
       }}