mirror of
https://github.com/clash-verge-rev/clash-verge-rev
synced 2025-05-05 01:53:43 +08:00
34 lines
801 B
TypeScript
34 lines
801 B
TypeScript
import { useTranslation } from "react-i18next";
|
|
import { Button, ButtonGroup } from "@mui/material";
|
|
|
|
type ThemeValue = CmdType.VergeConfig["theme_mode"];
|
|
|
|
interface Props {
|
|
value?: ThemeValue;
|
|
onChange?: (value: ThemeValue) => void;
|
|
}
|
|
|
|
const ThemeModeSwitch = (props: Props) => {
|
|
const { value, onChange } = props;
|
|
const { t } = useTranslation();
|
|
|
|
const modes = ["light", "dark", "system"] as const;
|
|
|
|
return (
|
|
<ButtonGroup size="small">
|
|
{modes.map((mode) => (
|
|
<Button
|
|
key={mode}
|
|
variant={mode === value ? "contained" : "outlined"}
|
|
onClick={() => onChange?.(mode)}
|
|
sx={{ textTransform: "capitalize" }}
|
|
>
|
|
{t(`theme.${mode}`)}
|
|
</Button>
|
|
))}
|
|
</ButtonGroup>
|
|
);
|
|
};
|
|
|
|
export default ThemeModeSwitch;
|