/** @jsx h **/

import { component, h, render } from "rocky7";
import { Link, Route, Switch, BrowserRouter } from "rocky7-router";

export const Layout = component<{}>("Layout", (props, {}) => {
  return (
    <BrowserRouter>
      <div>
        <ul>
          <li>
            <Link href="/">Home</Link>
          </li>
          <li>
            <Link href="/about">About</Link>
          </li>
        </ul>
        <Switch>
          <Route path="" component={Home} />
          <Route path="about" component={About} />
        </Switch>
      </div>
    </BrowserRouter>
  );
});
export const Home = component<{}>("Home", (props, {}) => {
  return <div>Home</div>;
});

export const About = component<{}>("About", (props, {}) => {
  return <div>About</div>;
});

render(<Layout />, document.body);