添加 Markdown 拓展支持

This commit is contained in:
2026-03-30 17:03:59 +08:00
parent a101e79750
commit 6559d0c062
4 changed files with 1809 additions and 314 deletions
+1778 -311
View File
File diff suppressed because it is too large Load Diff
+2
View File
@@ -49,7 +49,9 @@
"react-dom": "^19.1.0", "react-dom": "^19.1.0",
"react-draggable": "^4.5.0", "react-draggable": "^4.5.0",
"react-icons": "^5.5.0", "react-icons": "^5.5.0",
"react-markdown": "^10.1.0",
"react-window": "^1.8.10", "react-window": "^1.8.10",
"remark-gfm": "^4.0.1",
"tailwindcss": "^4.1.13", "tailwindcss": "^4.1.13",
"zustand": "^5.0.11" "zustand": "^5.0.11"
}, },
+2 -3
View File
@@ -2,6 +2,7 @@
import React, { useMemo, useRef, useState, useEffect, useCallback } from "react"; import React, { useMemo, useRef, useState, useEffect, useCallback } from "react";
import ReactMarkdown from "react-markdown"; import ReactMarkdown from "react-markdown";
import remarkGfm from "remark-gfm";
import { motion, AnimatePresence } from "framer-motion"; import { motion, AnimatePresence } from "framer-motion";
import markdownStyles from "./GlobalChatboxMarkdown.module.css"; import markdownStyles from "./GlobalChatboxMarkdown.module.css";
@@ -21,7 +22,6 @@ import {
Typography, Typography,
useTheme, useTheme,
alpha, alpha,
Tooltip,
} from "@mui/material"; } from "@mui/material";
import type { Theme } from "@mui/material/styles"; import type { Theme } from "@mui/material/styles";
@@ -30,7 +30,6 @@ import CloseRounded from "@mui/icons-material/CloseRounded";
import SendRounded from "@mui/icons-material/SendRounded"; import SendRounded from "@mui/icons-material/SendRounded";
import StopRounded from "@mui/icons-material/StopRounded"; import StopRounded from "@mui/icons-material/StopRounded";
import AutoAwesome from "@mui/icons-material/AutoAwesome"; // Sparkle icon for AI import AutoAwesome from "@mui/icons-material/AutoAwesome"; // Sparkle icon for AI
import PersonRounded from "@mui/icons-material/PersonRounded";
import ErrorOutlineRounded from "@mui/icons-material/ErrorOutlineRounded"; import ErrorOutlineRounded from "@mui/icons-material/ErrorOutlineRounded";
import AddCommentRounded from "@mui/icons-material/AddCommentRounded"; import AddCommentRounded from "@mui/icons-material/AddCommentRounded";
@@ -276,7 +275,7 @@ const ChatMessageItem = React.memo(
}} }}
> >
<div className={markdownStyles.markdown}> <div className={markdownStyles.markdown}>
<ReactMarkdown>{answerContent || "..."}</ReactMarkdown> <ReactMarkdown remarkPlugins={[remarkGfm]}>{answerContent || "..."}</ReactMarkdown>
</div> </div>
</Paper> </Paper>
</motion.div> </motion.div>
@@ -80,6 +80,33 @@
line-height: 1.65; line-height: 1.65;
} }
.markdown table {
width: 100%;
border-collapse: collapse;
margin: 1rem 0;
font-size: 0.88em;
border: 1px solid var(--chat-md-inline-code-border);
overflow: hidden;
border-radius: 8px;
}
.markdown th,
.markdown td {
padding: 0.6rem 0.8rem;
border: 1px solid var(--chat-md-inline-code-border);
text-align: left;
}
.markdown th {
background-color: var(--chat-md-inline-code-bg);
font-weight: 700;
color: var(--chat-md-heading);
}
.markdown tr:nth-child(even) {
background-color: rgba(0, 0, 0, 0.02);
}
.markdown blockquote { .markdown blockquote {
margin: 0.8rem 0; margin: 0.8rem 0;
padding: 0.45rem 0.75rem; padding: 0.45rem 0.75rem;