feat(web): useLang + segmentClass/rowStateClass helpers; delete dead Card (#66)

web/src/lib/class-recipes.test.ts

@@ -0,0 +1,22 @@
+import { expect, test } from "vitest";
+
+import { rowStateClass, segmentClass } from "./class-recipes";
+
+test("segmentClass active uses the primary tokens + focus ring", () => {
+  const cls = segmentClass(true, "px-2 py-1");
+  expect(cls).toContain("bg-primary");
+  expect(cls).toContain("text-primary-foreground");
+  expect(cls).toContain("focus-visible:ring-ring/50");
+  expect(cls).toContain("px-2");
+});
+
+test("segmentClass inactive uses border, not the primary fill", () => {
+  const cls = segmentClass(false);
+  expect(cls).toContain("border");
+  expect(cls).not.toContain("bg-primary");
+});
+
+test("rowStateClass toggles selected vs idle-hover", () => {
+  expect(rowStateClass(true)).toBe("bg-primary/10");
+  expect(rowStateClass(false)).toBe("hover:bg-muted");
+});

web/src/lib/class-recipes.ts

@@ -0,0 +1,14 @@
+import { cn } from "@/lib/utils";
+
+import { focusRing } from "./focus-ring";
+
+/** Segmented-control / filter-pill item. Unifies the active/inactive token recipe +
+ *  focus ring; callers pass their contextual padding/size via `className`. */
+export function segmentClass(active: boolean, className?: string): string {
+  return cn("rounded-md", focusRing, active ? "bg-primary text-primary-foreground" : "border", className);
+}
+
+/** Selected vs idle row background for master-detail / list rows. */
+export function rowStateClass(active: boolean): string {
+  return active ? "bg-primary/10" : "hover:bg-muted";
+}

web/src/lib/use-lang.ts

@@ -0,0 +1,7 @@
+import { useTranslation } from "react-i18next";
+
+/** The instance's active UI language, narrowed to the two supported locales. */
+export function useLang(): "sv" | "en" {
+  const { i18n } = useTranslation();
+  return i18n.language.startsWith("sv") ? "sv" : "en";
+}