feat(ui): add light theme toggle

src/lib/ui/components/ThemeToggle.tsx

@@ -0,0 +1,30 @@
+import type { UiTheme } from "../theme";
+import { getNextUiTheme } from "../theme";
+import { IconGlyph } from "./IconGlyph";
+
+export interface ThemeToggleProps {
+  theme: UiTheme;
+  onThemeChange: (theme: UiTheme) => void;
+}
+
+export function ThemeToggle({ theme, onThemeChange }: ThemeToggleProps) {
+  const nextTheme = getNextUiTheme(theme);
+  const label = `Switch to ${nextTheme} theme`;
+
+  return (
+    <button
+      aria-label={label}
+      aria-pressed={theme === "dark"}
+      className="theme-toggle"
+      data-ui-theme-toggle="true"
+      onClick={() => onThemeChange(nextTheme)}
+      type="button"
+    >
+      <IconGlyph
+        name={theme === "dark" ? "mdi:weather-night" : "mdi:white-balance-sunny"}
+        size="sm"
+      />
+      <span>{theme === "dark" ? "Dark" : "Light"}</span>
+    </button>
+  );
+}