53 lines
1.4 KiB
TypeScript
53 lines
1.4 KiB
TypeScript
import { describe, expect, it } from "vitest";
|
|
|
|
import {
|
|
badgeClass,
|
|
buttonClass,
|
|
cn,
|
|
inputClass,
|
|
segmentedClass,
|
|
statusNoteClass,
|
|
} from "./variants";
|
|
|
|
describe("ui variants", () => {
|
|
it("joins classes without falsey values", () => {
|
|
expect(cn("a", false, undefined, null, "b")).toBe("a b");
|
|
});
|
|
|
|
it("builds stable primary button classes", () => {
|
|
const klass = buttonClass({ variant: "primary", size: "sm" });
|
|
|
|
expect(klass).toContain("bg-cinnabar");
|
|
expect(klass).toContain("px-3");
|
|
expect(klass).toContain("focus-visible:ring-2");
|
|
});
|
|
|
|
it("keeps warning badges readable on the paper background", () => {
|
|
const klass = badgeClass({ variant: "warning" });
|
|
|
|
expect(klass).toContain("bg-overdue/10");
|
|
expect(klass).toContain("text-ink");
|
|
});
|
|
|
|
it("marks invalid inputs with conflict styling", () => {
|
|
const klass = inputClass({ state: "error" });
|
|
|
|
expect(klass).toContain("border-conflict");
|
|
expect(klass).toContain("focus-visible:ring-conflict/25");
|
|
});
|
|
|
|
it("gives warning status notes a non-color icon slot friendly shell", () => {
|
|
const klass = statusNoteClass({ variant: "warning" });
|
|
|
|
expect(klass).toContain("border-overdue");
|
|
expect(klass).toContain("px-3");
|
|
});
|
|
|
|
it("builds segmented control chrome", () => {
|
|
const klass = segmentedClass();
|
|
|
|
expect(klass).toContain("inline-flex");
|
|
expect(klass).toContain("border-line");
|
|
});
|
|
});
|