Enable every plugin recommended preset and replace Biome with ESLint formatting. Preserve API contracts and JSX whitespace; verify source, tests, builds and tooling.
34 lines
1.3 KiB
TypeScript
34 lines
1.3 KiB
TypeScript
import { DEFAULT_THEME, mergeMantineTheme } from "@mantine/core";
|
|
import source from "@wealthledger/tokens/tokens.json";
|
|
import { describe, expect, it } from "vitest";
|
|
|
|
import { colorRoles, cssVariablesResolver, theme } from "./theme";
|
|
|
|
describe("design theme adapter", () => {
|
|
it("preserves scale-aware sizes, unscaled breakpoints and shadow layers", () => {
|
|
expect(theme.spacing?.md).toBe("calc(1rem * var(--mantine-scale))");
|
|
expect(theme.fontSizes?.sm).toBe("calc(0.875rem * var(--mantine-scale))");
|
|
expect(theme.breakpoints?.sm).toBe("48em");
|
|
expect(theme.shadows?.sm).toContain(
|
|
"calc(-0.3125rem * var(--mantine-scale))",
|
|
);
|
|
expect(theme.shadows?.sm).toContain("rgba(0, 0, 0, 0.04)");
|
|
});
|
|
|
|
it("keeps default-shade roles attached to native filled variables", () => {
|
|
const resolved = mergeMantineTheme(DEFAULT_THEME, theme);
|
|
const variables = cssVariablesResolver(resolved).variables;
|
|
expect(colorRoles.primary).toBe("blue");
|
|
expect(variables["--wl-color-primary"]).toBe(
|
|
"var(--mantine-color-blue-filled)",
|
|
);
|
|
expect(variables["--wl-color-canvas"]).toBe("var(--mantine-color-gray-2)");
|
|
expect(Object.keys(variables)).toHaveLength(
|
|
Object.keys(source.color.roles).length,
|
|
);
|
|
expect(cssVariablesResolver(resolved).light["--mantine-color-dimmed"]).toBe(
|
|
variables["--wl-color-muted"],
|
|
);
|
|
});
|
|
});
|