feat: server entry and web shell with design tokens

Co-Authored-By: Claude Opus 5.5 <[email protected]>

apps/web/src/features.ts

@@ -0,0 +1,4 @@
+import type { WebFeature } from "@stc/contracts";
+
+// Phase 1 packages append one import line each and push into this list.
+export const webFeatures: WebFeature[] = [];

apps/web/src/main.tsx

@@ -0,0 +1,39 @@
+import { createRoot } from "react-dom/client";
+import { lazy, Suspense } from "react";
+import { createBrowserRouter, Link, Outlet, RouterProvider, type RouteObject } from "react-router-dom";
+import { AppShell } from "@stc/ui";
+import { webFeatures } from "./features";
+
+function Home() {
+  return <p className="work">No features installed yet</p>;
+}
+
+function Layout() {
+  const nav = webFeatures.flatMap((f) => f.routes.filter((r) => r.nav?.area === "header"));
+  const header = (
+    <>
+      <Link to="/" style={{ fontWeight: 600, color: "var(--head)", textDecoration: "none" }}>STCourses</Link>
+      <nav style={{ display: "flex", gap: 14 }}>
+        {nav.map((r) => <Link key={r.path} to={r.path}>{r.nav!.label}</Link>)}
+      </nav>
+    </>
+  );
+  return (
+    <AppShell header={header}>
+      <Suspense fallback={null}><Outlet /></Suspense>
+    </AppShell>
+  );
+}
+
+const featureRoutes: RouteObject[] = webFeatures.flatMap((f) =>
+  f.routes.map((r) => {
+    const Element = lazy(r.element);
+    return { path: r.path, element: <Element /> };
+  }),
+);
+
+const router = createBrowserRouter([
+  { element: <Layout />, children: [...featureRoutes, ...(featureRoutes.some((r) => r.path === "/") ? [] : [{ path: "*", element: <Home /> }])] },
+]);
+
+createRoot(document.getElementById("root")!).render(<RouterProvider router={router} />);