Port the explorer shell: tokens, header, hero, and a generic table.

CONTENT-WP-0002-T01 adapts the pinned OnCo visual system under ui/ without the corpus, mark, or kind routes.

Assistant: grok
Assistant-Session: 01a1346c-fdff-7741-b1af-b7283661554b

ui/components/ResultsTable.test.tsx

@@ -0,0 +1,36 @@
+import { renderToStaticMarkup } from "react-dom/server";
+import { describe, expect, it } from "vitest";
+import { ResultsTable } from "./ResultsTable";
+
+type Row = { title: string; kindLabel: string };
+
+const columns = [
+  { key: "title", label: "Title", sortable: true, render: (row: Row) => row.title },
+  { key: "kindLabel", label: "Kind", sortable: true, render: (row: Row) => row.kindLabel },
+];
+
+describe("ResultsTable", () => {
+  it("renders an empty state", () => {
+    const html = renderToStaticMarkup(
+      <ResultsTable columns={columns} rows={[]} rowKey={() => "none"} onSort={() => undefined} />,
+    );
+    expect(html).toContain("No records.");
+    expect(html).not.toContain("aria-sort");
+  });
+
+  it("exposes sort buttons and aria-sort for the active column", () => {
+    const html = renderToStaticMarkup(
+      <ResultsTable
+        columns={columns}
+        rows={[{ title: "Feedback", kindLabel: "Concept" } satisfies Row]}
+        rowKey={(row) => row.title}
+        sort={{ key: "title", dir: 1 }}
+        onSort={() => undefined}
+      />,
+    );
+    expect(html).toContain("Sort by Kind");
+    expect(html).toContain('aria-sort="ascending"');
+    expect(html).toContain("Feedback");
+    expect(html).toContain(">Title");
+  });
+});