import { useCallback } from 'react'; import { useColorScheme } from '@mui/material/styles'; /** * Returns an event handler that toggles dark/light mode via MUI's CSS-vars system. * Calling the returned function sets data-mui-color-scheme on — no React * re-render happens outside the component that calls this hook. */ export function useEventSwitchDarkMode() { const { mode, setMode } = useColorScheme(); return useCallback(() => { setMode(mode === 'dark' ? 'light' : 'dark'); }, [mode, setMode]); }