@ugurdemirel/landcraft 0.1.4 → 0.1.5

package/src/components/Testimonials/Testimonials.test.tsx

@@ -0,0 +1,48 @@
+import { describe, it, expect } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { TestimonialCard } from "./TestimonialCard";
+import { Testimonials } from "./Testimonials";
+
+const items = [
+  { quote: "Great product.", author: "Ayşe Yıldız", role: "Founder", company: "Lumina", rating: 5 },
+  { quote: "Saved us hours.", author: "Mehmet Demir", company: "Nova" },
+];
+
+describe("TestimonialCard", () => {
+  it("renders quote, author, role and company", () => {
+    render(<TestimonialCard testimonial={items[0]} />);
+    expect(screen.getByText("Great product.")).toBeInTheDocument();
+    expect(screen.getByText("Ayşe Yıldız")).toBeInTheDocument();
+    expect(screen.getByText("Founder · Lumina")).toBeInTheDocument();
+  });
+
+  it("renders initials for the default avatar", () => {
+    render(<TestimonialCard testimonial={items[0]} />);
+    expect(screen.getByText("AY")).toBeInTheDocument();
+  });
+});
+
+describe("Testimonials", () => {
+  it("renders all items in the grid (default) option", () => {
+    render(<Testimonials items={items} option="grid" />);
+    expect(screen.getByText("Great product.")).toBeInTheDocument();
+    expect(screen.getByText("Saved us hours.")).toBeInTheDocument();
+  });
+
+  it("renders the marquee option (items are duplicated for the loop)", () => {
+    render(<Testimonials items={items} option="marquee" />);
+    expect(screen.getAllByText("Great product.").length).toBeGreaterThan(0);
+    expect(screen.getAllByText("Saved us hours.").length).toBeGreaterThan(0);
+  });
+
+  it("renders a carousel that advances on next and cycles", () => {
+    render(<Testimonials items={items} option="carousel" />);
+    expect(screen.getByText("Great product.")).toBeInTheDocument();
+
+    fireEvent.click(screen.getByRole("button", { name: "Next testimonial" }));
+    expect(screen.getByText("Saved us hours.")).toBeInTheDocument();
+
+    fireEvent.click(screen.getByRole("button", { name: "Next testimonial" }));
+    expect(screen.getByText("Great product.")).toBeInTheDocument();
+  });
+});

package/src/test/setup.ts

@@ -0,0 +1,7 @@
+import "@testing-library/jest-dom/vitest";
+import { cleanup } from "@testing-library/react";
+import { afterEach } from "vitest";
+
+afterEach(() => {
+  cleanup();
+});

package/src/utils/cn.test.ts

@@ -0,0 +1,21 @@
+import { describe, it, expect } from "vitest";
+import { cn } from "../utils/cn";
+
+describe("cn", () => {
+  it("joins class names", () => {
+    expect(cn("a", "b", "c")).toBe("a b c");
+  });
+
+  it("filters out falsy values", () => {
+    expect(cn("a", false, null, undefined, 0, "b")).toBe("a b");
+  });
+
+  it("handles nested arrays and objects", () => {
+    expect(cn(["a", "b"], { c: true, d: false })).toBe("a b c");
+  });
+
+  it("merges conflicting tailwind classes keeping the last", () => {
+    expect(cn("px-2", "px-4")).toBe("px-4");
+    expect(cn("p-2", "p-4")).toBe("p-4");
+  });
+});

package/src/utils/contrast.test.ts

@@ -0,0 +1,71 @@
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { getContrastText } from "../utils/contrast";
+
+describe("getContrastText", () => {
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it("returns a light text on very dark backgrounds", () => {
+    expect(getContrastText("#000000")).toBe("#ffffff");
+    expect(getContrastText("#111111")).toBe("#ffffff");
+    expect(getContrastText("#0f172a")).toBe("#ffffff");
+  });
+
+  it("returns a dark text on very light backgrounds", () => {
+    expect(getContrastText("#ffffff")).toBe("#0f172a");
+    expect(getContrastText("#f5f5f5")).toBe("#0f172a");
+    expect(getContrastText("#fafafa")).toBe("#0f172a");
+  });
+
+  it("respects a custom light/dark candidate pair", () => {
+    // On white, the black candidate has more contrast than the white candidate.
+    expect(getContrastText("#ffffff", "#000000", "#ffffff")).toBe("#000000");
+    // On black, the white candidate has more contrast.
+    expect(getContrastText("#000000", "#000000", "#ffffff")).toBe("#ffffff");
+  });
+
+  it("handles 3-digit shorthand hex", () => {
+    expect(getContrastText("#fff")).toBe("#0f172a");
+    expect(getContrastText("#000")).toBe("#ffffff");
+  });
+
+  it("handles lowercase and mixed-case hex", () => {
+    expect(getContrastText("#FFFFFF")).toBe("#0f172a");
+    expect(getContrastText("#000000")).toBe("#ffffff");
+  });
+
+  it("handles bare RGB channel triplets", () => {
+    expect(getContrastText("21 128 61")).toBe("#ffffff");
+    expect(getContrastText("255 255 255")).toBe("#0f172a");
+  });
+
+  it("handles rgb() and rgba() functions", () => {
+    expect(getContrastText("rgb(0 0 0)")).toBe("#ffffff");
+    expect(getContrastText("rgb(255, 255, 255)")).toBe("#0f172a");
+    expect(getContrastText("rgb(0 0 0 / 0.9)")).toBe("#ffffff");
+  });
+
+  it("picks the high-contrast side for mid-luminance colors", () => {
+    // Amber (#eab308) is bright — dark text should win.
+    expect(getContrastText("#eab308")).toBe("#0f172a");
+    // A mid violet keeps white text readable.
+    expect(getContrastText("#4f46e5")).toBe("#ffffff");
+  });
+
+  it("resolves CSS variable references against the live stylesheet when in a DOM", () => {
+    const root = document.documentElement;
+    const getComputedStyle = vi.spyOn(window, "getComputedStyle");
+    getComputedStyle.mockReturnValue({
+      getPropertyValue: (name: string) => (name === "--color-primary" ? "21 128 61" : ""),
+    } as CSSStyleDeclaration);
+    root.setAttribute("style", "--color-primary: 21 128 61");
+
+    expect(getContrastText("rgb(var(--color-primary) / 0.85)")).toBe("#ffffff");
+  });
+
+  it("falls back to the light candidate when the input is unparsable", () => {
+    // An unknown color yields luminance 0, so light text wins by default.
+    expect(getContrastText("not-a-color")).toBe("#ffffff");
+  });
+});

package/src/utils/iso2Flag.test.ts

@@ -0,0 +1,26 @@
+import { describe, it, expect } from "vitest";
+import { iso2ToFlagEmoji } from "../utils/iso2Flag";
+
+describe("iso2ToFlagEmoji", () => {
+  it("converts a known country code to its flag emoji", () => {
+    expect(iso2ToFlagEmoji("tr")).toBe("🇹🇷");
+    expect(iso2ToFlagEmoji("us")).toBe("🇺🇸");
+    expect(iso2ToFlagEmoji("de")).toBe("🇩🇪");
+  });
+
+  it("is case-insensitive", () => {
+    expect(iso2ToFlagEmoji("TR")).toBe("🇹🇷");
+    expect(iso2ToFlagEmoji("Tr")).toBe("🇹🇷");
+  });
+
+  it("returns an empty string for non-country codes like language codes", () => {
+    expect(iso2ToFlagEmoji("en")).toBe("");
+    expect(iso2ToFlagEmoji("qq")).toBe("");
+  });
+
+  it("returns an empty string for empty or invalid input", () => {
+    expect(iso2ToFlagEmoji("")).toBe("");
+    expect(iso2ToFlagEmoji("x")).toBe("");
+    expect(iso2ToFlagEmoji("zz")).toBe("");
+  });
+});

package/src/utils/useTokenForeground.test.ts

@@ -0,0 +1,50 @@
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { renderHook } from "@testing-library/react";
+import { useTokenForeground } from "../utils/useTokenForeground";
+
+class FakeMutationObserver {
+  observe() {}
+  disconnect() {}
+}
+
+describe("useTokenForeground", () => {
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  function stubComputedStyle(resolver: (name: string) => string) {
+    vi.stubGlobal(
+      "MutationObserver",
+      FakeMutationObserver as unknown as typeof MutationObserver,
+    );
+    vi.spyOn(window, "getComputedStyle").mockReturnValue({
+      getPropertyValue: (name: string) => resolver(name),
+    } as CSSStyleDeclaration);
+  }
+
+  it("returns the fallback when the token cannot be resolved", () => {
+    stubComputedStyle(() => "");
+    const { result } = renderHook(() => useTokenForeground("--color-primary"));
+    expect(result.current).toBe("#ffffff");
+  });
+
+  it("returns light text for a dark token value", () => {
+    stubComputedStyle(() => "21 128 61");
+    const { result } = renderHook(() => useTokenForeground("--color-primary"));
+    expect(result.current).toBe("#ffffff");
+  });
+
+  it("returns dark text for a light token value", () => {
+    stubComputedStyle(() => "255 255 255");
+    const { result } = renderHook(() => useTokenForeground("--color-secondary"));
+    expect(result.current).toBe("#0f172a");
+  });
+
+  it("honours a custom fallback", () => {
+    stubComputedStyle(() => "");
+    const { result } = renderHook(() =>
+      useTokenForeground("--color-missing", "#123456"),
+    );
+    expect(result.current).toBe("#123456");
+  });
+});