'use client';
import { useEffect, useState } from 'react';
import { Sun, Moon } from 'lucide-react';
export default function ThemeToggle() {
const [theme, setTheme] = useState('light');
const [mounted, setMounted] = useState(false);
useEffect(() => {
setMounted(true);
const isDark = document.documentElement.classList.contains('dark');
setTheme(isDark ? 'dark' : 'light');
}, []);
function toggle() {
const next = theme === 'dark' ? 'light' : 'dark';
setTheme(next);
if (next === 'dark') document.documentElement.classList.add('dark');
else document.documentElement.classList.remove('dark');
try { localStorage.setItem('theme', next); } catch {}
}
// плейсхолдер до маунта, чтобы кнопка не прыгала
if (!mounted) return ;
return (
);
}