Files
meditation-admin/components/ThemeToggle.tsx
T
2026-06-03 09:01:42 +03:30

22 lines
675 B
TypeScript

"use client";
import { useTheme } from "@/lib/theme";
import { SunIcon, MoonIcon } from "./icons";
export function ThemeToggle({ className }: { className?: string }) {
const { theme, toggle } = useTheme();
const dark = theme === "dark";
return (
<button
type="button"
onClick={toggle}
aria-label={dark ? "حالت روشن" : "حالت تاریک"}
title={dark ? "حالت روشن" : "حالت تاریک"}
className={`rounded-lg p-2 text-muted transition hover:bg-surface-muted hover:text-foreground ${className ?? ""}`}
>
{dark ? <SunIcon className="h-5 w-5" /> : <MoonIcon className="h-5 w-5" />}
</button>
);
}