gitea-admin/clash-verge-rev
1
0
Fork 0
mirror of https://github.com/clash-verge-rev/clash-verge-rev.git synced 2026-10-30 10:42:09 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: added clear btn in filter component (#6229) (#6295)

Browse Source 
Co-authored-by: Slinetrac <realakayuki@gmail.com>
This commit is contained in:
JingxinXu
2026-02-11 06:40:47 +00:00
committed by GitHub
co-authored by Slinetrac
parent a019b26ceb
commit bba71aaa4c
17 changed files with 52 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/base/base-search-box.tsx
+36 -25
View File
@@ -1,4 +1,5 @@
import { Box, SvgIcon, TextField, styled } from "@mui/material";
import { ClearRounded } from "@mui/icons-material";
import { Box, SvgIcon, TextField, styled, IconButton } from "@mui/material";
import Tooltip from "@mui/material/Tooltip";
import {
ChangeEvent,
@@ -168,6 +169,11 @@ export const BaseSearchBox = ({
});
};
const handleClearInput = () => {
setText("");
emitSearch({ text: "", matchCase, matchWholeWord, useRegularExpression });
};
const handleToggleMatchCase = () => {
const next = !matchCase;
setMatchCase(next);
@@ -200,35 +206,40 @@ export const BaseSearchBox = ({
sx: { pr: 1 },
endAdornment: (
<Box display="flex">
<Tooltip title={t("shared.placeholders.matchCase")}>
<div>
<SvgIcon
component={matchCaseIcon}
{!!text && (
<Tooltip title={t("shared.placeholders.resetInput")}>
<IconButton
size="small"
{...iconStyle}
aria-label={matchCase ? "active" : "inactive"}
onClick={handleToggleMatchCase}
/>
</div>
onClick={handleClearInput}
>
<ClearRounded fontSize="inherit" />
</IconButton>
</Tooltip>
)}
<Tooltip title={t("shared.placeholders.matchCase")}>
<SvgIcon
component={matchCaseIcon}
{...iconStyle}
aria-label={matchCase ? "active" : "inactive"}
onClick={handleToggleMatchCase}
/>
</Tooltip>
<Tooltip title={t("shared.placeholders.matchWholeWord")}>
<div>
<SvgIcon
component={matchWholeWordIcon}
{...iconStyle}
aria-label={matchWholeWord ? "active" : "inactive"}
onClick={handleToggleMatchWholeWord}
/>
</div>
<SvgIcon
component={matchWholeWordIcon}
{...iconStyle}
aria-label={matchWholeWord ? "active" : "inactive"}
onClick={handleToggleMatchWholeWord}
/>
</Tooltip>
<Tooltip title={t("shared.placeholders.useRegex")}>
<div>
<SvgIcon
component={UseRegularExpressionIcon}
aria-label={useRegularExpression ? "active" : "inactive"}
{...iconStyle}
onClick={handleToggleUseRegularExpression}
/>
</div>
<SvgIcon
component={UseRegularExpressionIcon}
aria-label={useRegularExpression ? "active" : "inactive"}
{...iconStyle}
onClick={handleToggleUseRegularExpression}
/>
</Tooltip>
</Box>
),