diff --git a/src/app/components/ResultSection.tsx b/src/app/components/ResultSection.tsx index 80fa12e..c918da0 100644 --- a/src/app/components/ResultSection.tsx +++ b/src/app/components/ResultSection.tsx @@ -1,6 +1,7 @@ import React, { FC, useState, useEffect, useCallback, useMemo } from "react"; import { Button, Input, message, Tooltip, Typography, Space, Flex, Tag } from "antd"; import { CheckCircleOutlined } from "@ant-design/icons"; +import { useTheme } from "next-themes"; import { useTranslations } from "next-intl"; import { CONSTANT_BUTTONS, NEGATIVE_TEXT, colorArray } from "@/app/data/constants"; import { copyToClipboard } from "@/app/utils/copyToClipboard"; @@ -26,6 +27,7 @@ const ResultSection: FC = ({ selectedTags = [], setSelectedT const [exactMatchTag, setExactMatchTag] = useState(null); const [inputText, setInputText] = useState(""); const [isComposing, setIsComposing] = useState(false); // 中、日、韩输入法状态 + const { theme } = useTheme(); const findTagData = useMemo(() => { const tagMap = new Map(tagsData.map((tag) => [normalizeString(tag.displayName || ""), tag])); @@ -56,6 +58,8 @@ const ResultSection: FC = ({ selectedTags = [], setSelectedT let newText = e.target.value; if (newText.endsWith(",") || newText.endsWith(",")) { newText = newText.slice(0, -1).replace(/,\s*$/g, "") + ", "; + setResultText(newText); + return; } setResultText(newText); @@ -129,6 +133,9 @@ const ResultSection: FC = ({ selectedTags = [], setSelectedT setExactMatchTag(null); return; } + if (exactMatchTag) { + setExactMatchTag(null); + } const getRecommendedTags = (searchField: keyof TagItem) => tagsData @@ -278,11 +285,7 @@ const ResultSection: FC = ({ selectedTags = [], setSelectedT onCompositionStart={() => setIsComposing(true)} onCompositionEnd={() => setIsComposing(false)} rows={10} - className="w-full mt-2 mb-5" - style={{ - backgroundColor: "#333", - color: "#d3d3d3", - }} + className={`w-full mt-2 mb-5 ${theme === "light" ? "bg-gray-50 text-gray-600" : "bg-gray-800 text-gray-300"}`} /> {exactMatchTag && (