diff --git a/src/admin/ui/Pagination.tsx b/src/admin/ui/Pagination.tsx
new file mode 100644
index 0000000..03e26c1
--- /dev/null
+++ b/src/admin/ui/Pagination.tsx
@@ -0,0 +1,26 @@
+import Box from "@mui/material/Box";
+import MuiPagination from "@mui/material/Pagination";
+
+/** Centered pager. Renders nothing for a single page. */
+export default function Pagination({
+ page,
+ pageCount,
+ onChange,
+}: {
+ page: number;
+ pageCount: number;
+ onChange: (p: number) => void;
+}) {
+ if (pageCount <= 1) return null;
+ return (
+
+ onChange(p)}
+ color="primary"
+ shape="rounded"
+ />
+
+ );
+}
diff --git a/src/admin/ui/Tabs.tsx b/src/admin/ui/Tabs.tsx
new file mode 100644
index 0000000..f5ca30b
--- /dev/null
+++ b/src/admin/ui/Tabs.tsx
@@ -0,0 +1,51 @@
+import type { ReactNode } from "react";
+import MuiTabs from "@mui/material/Tabs";
+import Tab from "@mui/material/Tab";
+import Box from "@mui/material/Box";
+
+export interface TabDef {
+ value: string;
+ label: string;
+}
+
+/** Tab bar over MUI Tabs. Pair with for the content. */
+export function Tabs({
+ value,
+ onChange,
+ tabs,
+}: {
+ value: string;
+ onChange: (v: string) => void;
+ tabs: TabDef[];
+}) {
+ return (
+ onChange(v)}
+ sx={{
+ borderBottom: 1,
+ borderColor: "divider",
+ minHeight: 44,
+ "& .MuiTab-root": { textTransform: "none", fontWeight: 600 },
+ }}
+ >
+ {tabs.map((t) => (
+
+ ))}
+
+ );
+}
+
+/** Renders children only when its value matches the current tab. */
+export function TabPanel({
+ value,
+ current,
+ children,
+}: {
+ value: string;
+ current: string;
+ children: ReactNode;
+}) {
+ if (value !== current) return null;
+ return {children};
+}
diff --git a/src/admin/ui/index.ts b/src/admin/ui/index.ts
index 279df9c..02a9527 100644
--- a/src/admin/ui/index.ts
+++ b/src/admin/ui/index.ts
@@ -12,3 +12,6 @@ export type { SelectOption } from "./Select";
export { default as StatusChip } from "./StatusChip";
export { CheckboxField } from "./Checkbox";
export { default as Alert } from "./Alert";
+export { Tabs, TabPanel } from "./Tabs";
+export type { TabDef } from "./Tabs";
+export { default as Pagination } from "./Pagination";