import { useEffect, useRef } from 'react'; import { isRouteErrorResponse, Links, Meta, Outlet, Scripts, ScrollRestoration, useLocation, useRouteError } from 'react-router'; import { SkipLinks } from './components/layout/SkipLinks'; import { SiteHeader } from './components/layout/SiteHeader'; import { SiteFooter } from './components/layout/SiteFooter'; import { NotFoundContent } from './routes/not-found'; import './styles/tokens.css'; import './styles/reset.css'; import './styles/typography.css'; import './styles/layout.css'; import './styles/components.css'; import './styles/scenes.css'; import './styles/reduced-motion.css'; import './styles/print.css'; export function Layout({ children }: { children: React.ReactNode }) { return ( {children} ); } /** Client navigation moves focus to the page's main landmark so keyboard and screen-reader users land on the new content. */ function RouteFocusManager() { const location = useLocation(); const first = useRef(true); useEffect(() => { if (first.current) { first.current = false; return; } if (location.hash) return; document.getElementById('content')?.focus({ preventScroll: true }); }, [location.pathname, location.hash]); return null; } export default function App() { return ( <>

); } export function ErrorBoundary() { const error = useRouteError(); const notFound = isRouteErrorResponse(error) && error.status === 404; return (

{notFound ? : (

Something went wrong

The page could not be displayed. The navigation above still works.

)}

); }