// Exercise 1: conditional class composition (easy)
//
// Per theory section 5, a Tailwind className is just a string — build it
// with plain JS composition, not a CSS-in-JS runtime.
//
// TODO 1: implement cn(...args) — a minimal clsx-style helper. Each arg
// is either a string, a falsy value (false/null/undefined/""), or an
// object mapping class-name strings to booleans. Return a single
// space-joined string of every "truthy" class, in the order encountered,
// skipping falsy entries and skipping object keys whose value is falsy.
//
// TODO 2: implement badgeClassName(variant, active) — use cn() to build:
//   base classes (always present): "px-2 py-1 rounded text-xs font-medium"
//   variant "success": "bg-green-100 text-green-800"
//   variant "error":   "bg-red-100 text-red-800"
//   when active is true, additionally: "ring-2 ring-offset-1"

type ClassValue = string | false | null | undefined | Record<string, boolean>;

function cn(...args: ClassValue[]): string {
  // TODO: implement per the spec above
  return "";
}

function badgeClassName(variant: "success" | "error", active: boolean): string {
  // TODO: implement using cn()
  return "";
}

export { cn, badgeClassName };

// --- self-check: do not modify below this line ---
const checks: Array<[string, string, string]> = [];

checks.push(["joins plain strings", cn("a", "b", "c"), "a b c"]);
checks.push(["skips falsy args", cn("a", false, null, undefined, "", "b"), "a b"]);
checks.push(["reads truthy object keys only",
  cn("base", { active: true, disabled: false, loud: true }),
  "base active loud"]);

checks.push(["success badge, inactive",
  badgeClassName("success", false),
  "px-2 py-1 rounded text-xs font-medium bg-green-100 text-green-800"]);

checks.push(["error badge, active",
  badgeClassName("error", true),
  "px-2 py-1 rounded text-xs font-medium bg-red-100 text-red-800 ring-2 ring-offset-1"]);

let passed = 0;
for (const [label, actual, expected] of checks) {
  const ok = actual === expected;
  passed += ok ? 1 : 0;
  console.log(`${ok ? "PASS" : "FAIL"}: ${label} (got "${actual}", expected "${expected}")`);
}
console.log(passed === checks.length ? "PASS" : "FAIL");