able-baker/app.tsx

27 lines
865 B
TypeScript
Raw Normal View History

2024-05-16 12:18:01 -04:00
import {Route, useRoute} from ">able/iso-router.tsx";
2024-05-16 12:18:01 -04:00
const Tracer =()=>
{
2024-05-16 14:30:04 -04:00
const {nestedDepth, pathIndex, blocked} = useRoute();
return <div>Depth: {nestedDepth}, Index:{pathIndex}, Match:{blocked.value}</div>
2024-05-16 12:18:01 -04:00
}
2023-08-13 11:00:48 -04:00
export default ()=><div>
<h1 class="p-4 bg-red-500 text-white">App</h1>
2024-05-16 12:18:01 -04:00
<nav class="flex gap-10 p-6">
<a href="/">Home</a>
<a href="/about">About</a>
2024-05-16 14:30:04 -04:00
<a href="/404">404</a>
2024-05-16 12:18:01 -04:00
</nav>
2024-05-16 14:30:04 -04:00
<Route path={[]}><p>home page!</p></Route>
2024-05-16 12:18:01 -04:00
<Route path={["about"]}>
<nav class="flex gap-10 p-6">
<a href="/about/more">more</a>
2024-05-16 14:30:04 -04:00
<a href="/about/404">more 404</a>
2024-05-16 12:18:01 -04:00
</nav>
2024-05-16 14:30:04 -04:00
<Route path={[]}><p>About page!</p></Route>
<Route path={["more"]}><p>more!</p></Route>
<Route><span>couldnt find it</span></Route>
2024-05-16 12:18:01 -04:00
</Route>
2024-05-16 14:30:04 -04:00
<Route><p>404 :(</p></Route>
2023-08-13 11:00:48 -04:00
</div>;