@ugurdemirel/landcraft 0.1.5 → 0.1.9

package/src/components/Footer/parts.tsx

@@ -1,101 +0,0 @@
-import type { ElementType, ReactNode } from "react";
-import { cn } from "../../utils/cn";
-import type { FooterColumn } from "./types";
-
-export function FooterLogoNode({
-  logo,
-  logoSrc,
-  logoAlt,
-  logoClassName,
-  brand,
-  imageClassName = "h-7 w-auto",
-}: {
-  logo?: ReactNode;
-  logoSrc?: string;
-  logoAlt?: string;
-  logoClassName?: string;
-  brand?: ReactNode;
-  imageClassName?: string;
-}) {
-  if (logo) return logo;
-  if (logoSrc) {
-    return (
-      <img
-        src={logoSrc}
-        alt={logoAlt ?? (typeof brand === "string" ? brand : "Logo")}
-        className={cn(imageClassName, logoClassName)}
-      />
-    );
-  }
-  return null;
-}
-
-export function FooterWordmark({ brand }: { brand?: ReactNode }) {
-  return (
-    <span className="flex items-center gap-2 font-display text-lg font-bold tracking-tight">
-      <span aria-hidden className="inline-block h-2.5 w-2.5 rounded-sm bg-current" />
-      {brand}
-    </span>
-  );
-}
-
-export function FooterEditorialWordmark({ brand }: { brand?: ReactNode }) {
-  return (
-    <span className="font-display text-5xl font-bold tracking-[-0.03em] text-foreground sm:text-7xl">
-      {brand}
-    </span>
-  );
-}
-
-export function FooterColumnsBlock({
-  columns,
-  Link,
-  linkClassName,
-}: {
-  columns: FooterColumn[];
-  Link: ElementType;
-  linkClassName: string;
-}) {
-  return (
-    <div className="grid grid-cols-2 gap-8 md:grid-cols-4">
-      {columns.map((column) => (
-        <div key={column.title}>
-          <h3 className="text-xs font-semibold uppercase tracking-[0.16em] text-muted-foreground">
-            {column.title}
-          </h3>
-          <ul className="mt-4 space-y-2.5">
-            {column.links.map((link) => (
-              <li key={link.href}>
-                <Link href={link.href} className={linkClassName}>
-                  {link.label}
-                </Link>
-              </li>
-            ))}
-          </ul>
-        </div>
-      ))}
-    </div>
-  );
-}
-
-export function FooterBottomBar({
-  bottom,
-  languageSwitcher,
-  brand,
-  wrapperClassName,
-  textClassName,
-}: {
-  bottom?: ReactNode;
-  languageSwitcher?: ReactNode;
-  brand?: ReactNode;
-  wrapperClassName: string;
-  textClassName: string;
-}) {
-  return (
-    <div className={wrapperClassName}>
-      <span className={cn(textClassName)}>{bottom}</span>
-      {languageSwitcher ? <div>{languageSwitcher}</div> : null}
-      <span className={cn(textClassName)}>© {new Date().getFullYear()} {brand}. All rights reserved.</span>
-    </div>
-  );
-}

package/src/components/Footer/types.ts

@@ -1,32 +0,0 @@
-import type { ElementType, HTMLAttributes, ReactNode } from "react";
-
-export interface FooterLink {
-  label: string;
-  href: string;
-}
-
-export interface FooterColumn {
-  title: string;
-  links: FooterLink[];
-}
-
-export interface FooterProps extends Omit<HTMLAttributes<HTMLElement>, "title"> {
-  brand?: ReactNode;
-  /** Custom logo node (component, <img>, inline SVG…). Replaces the wordmark. */
-  logo?: ReactNode;
-  /** Quick logo image source. */
-  logoSrc?: string;
-  logoAlt?: string;
-  /** Size / position tuning for logo images. Defaults to `h-7 w-auto`. */
-  logoClassName?: string;
-  description?: string;
-  columns: FooterColumn[];
-  socials?: ReactNode;
-  bottom?: ReactNode;
-  /** Optional language switcher rendered in the footer's bottom bar. */
-  languageSwitcher?: ReactNode;
-  option?: "classic" | "minimal" | "editorial";
-  badge?: ReactNode;
-  /** Component used to render footer links. Defaults to `<a>`. Pass your router's `<Link>` (Next.js, Remix, React Router…) for framework-aware navigation. */
-  LinkComponent?: ElementType;
-}

package/src/components/Footer/variants/Classic.tsx

@@ -1,59 +0,0 @@
-import { cn } from "../../../utils/cn";
-import { Container } from "../../Container";
-import type { FooterProps } from "../types";
-import {
-  FooterWordmark,
-  FooterLogoNode,
-  FooterBottomBar,
-} from "../parts";
-
-interface ClassicProps extends FooterProps {}
-
-export function FooterClassic({ className, brand, logo, logoSrc, logoAlt, logoClassName, description, columns, socials, bottom, languageSwitcher, badge, LinkComponent, ...props }: ClassicProps) {
-  const Link = LinkComponent ?? "a";
-  const brandNode = FooterLogoNode({ logo, logoSrc, logoAlt, logoClassName, brand }) ?? <FooterWordmark brand={brand} />;
-
-  return (
-    <footer className={cn("w-full bg-secondary text-on-secondary", className)} {...props}>
-      <Container className="py-16">
-        <div className="grid grid-cols-2 gap-10 md:grid-cols-4 lg:grid-cols-6">
-          <div className="col-span-2">
-            <span style={{ color: "rgb(var(--color-on-secondary))" }}>{brandNode}</span>
-            {description ? (
-              <p className="mt-4 max-w-xs text-sm leading-6 text-on-secondary/60">{description}</p>
-            ) : null}
-            {socials ? <div className="mt-6 flex items-center gap-3">{socials}</div> : null}
-            {badge ? <div className="mt-6">{badge}</div> : null}
-          </div>
-          {columns.map((column) => (
-            <div key={column.title}>
-              <h3 className="text-xs font-semibold uppercase tracking-[0.16em] text-on-secondary/50">
-                {column.title}
-              </h3>
-              <ul className="mt-4 space-y-2.5">
-                {column.links.map((link) => (
-                  <li key={link.href}>
-                    <Link
-                      href={link.href}
-                      className="text-sm text-on-secondary/70 transition-colors duration-150 hover:text-on-secondary"
-                    >
-                      {link.label}
-                    </Link>
-                  </li>
-                ))}
-              </ul>
-            </div>
-          ))}
-        </div>
-        <FooterBottomBar
-          bottom={bottom}
-          languageSwitcher={languageSwitcher}
-          brand={brand}
-          wrapperClassName="mt-14 flex flex-col items-center justify-between gap-4 border-t border-white/10 pt-8 text-sm text-on-secondary/50 sm:flex-row"
-          textClassName=""
-        />
-      </Container>
-    </footer>
-  );
-}
-FooterClassic.displayName = "FooterClassic";

package/src/components/Footer/variants/Editorial.tsx

@@ -1,47 +0,0 @@
-import { cn } from "../../../utils/cn";
-import { Container } from "../../Container";
-import type { FooterProps } from "../types";
-import {
-  FooterColumnsBlock,
-  FooterEditorialWordmark,
-  FooterLogoNode,
-  FooterBottomBar,
-} from "../parts";
-
-interface EditorialProps extends FooterProps {}
-
-export function FooterEditorial({ className, brand, logo, logoSrc, logoAlt, logoClassName, description, columns, socials, bottom, languageSwitcher, LinkComponent, ...props }: EditorialProps) {
-  const Link = LinkComponent ?? "a";
-  const brandNode = FooterLogoNode({ logo, logoSrc, logoAlt, logoClassName, brand, imageClassName: "h-12 w-auto" }) ?? <FooterEditorialWordmark brand={brand} />;
-
-  return (
-    <footer className={cn("w-full border-t border-border bg-background", className)} {...props}>
-      <Container className="py-16 sm:py-20">
-        <div className="mb-14 flex flex-col justify-between gap-8 sm:flex-row sm:items-end">
-          <div>
-            {brandNode}
-            {description ? (
-              <p className="mt-3 max-w-sm text-sm leading-6 text-muted-foreground">{description}</p>
-            ) : null}
-          </div>
-          {socials ? <div className="flex items-center gap-3">{socials}</div> : null}
-        </div>
-        <div className="border-t border-border pt-12">
-          <FooterColumnsBlock
-            columns={columns}
-            Link={Link}
-            linkClassName="text-[15px] text-foreground/80 transition-colors duration-150 hover:text-foreground"
-          />
-        </div>
-        <FooterBottomBar
-          bottom={bottom}
-          languageSwitcher={languageSwitcher}
-          brand={brand}
-          wrapperClassName="mt-12 flex flex-col items-center justify-between gap-4 border-t border-border pt-8 text-sm text-muted-foreground sm:flex-row"
-          textClassName=""
-        />
-      </Container>
-    </footer>
-  );
-}
-FooterEditorial.displayName = "FooterEditorial";

package/src/components/Footer/variants/Minimal.tsx

@@ -1,33 +0,0 @@
-import { cn } from "../../../utils/cn";
-import { Container } from "../../Container";
-import type { FooterProps } from "../types";
-import { FooterWordmark, FooterLogoNode } from "../parts";
-
-interface MinimalProps extends FooterProps {}
-
-export function FooterMinimal({ className, brand, logo, logoSrc, logoAlt, logoClassName, columns, languageSwitcher, bottom, LinkComponent, ...props }: MinimalProps) {
-  const Link = LinkComponent ?? "a";
-  const brandNode = FooterLogoNode({ logo, logoSrc, logoAlt, logoClassName, brand }) ?? <FooterWordmark brand={brand} />;
-
-  return (
-    <footer className={cn("w-full border-t border-border bg-background", className)} {...props}>
-      <Container className="flex flex-col items-center justify-between gap-6 py-10 sm:flex-row">
-        {brandNode}
-        <ul className="flex flex-wrap items-center justify-center gap-x-8 gap-y-3">
-          {columns.flatMap((c) => c.links).slice(0, 6).map((link) => (
-            <li key={link.href}>
-              <Link href={link.href} className="text-sm text-muted-foreground transition-colors duration-150 hover:text-foreground">
-                {link.label}
-              </Link>
-            </li>
-          ))}
-        </ul>
-        <div className="flex flex-col items-center gap-3">
-          {languageSwitcher ? <div>{languageSwitcher}</div> : null}
-          <div className="text-sm text-muted-foreground">{bottom}</div>
-        </div>
-      </Container>
-    </footer>
-  );
-}
-FooterMinimal.displayName = "FooterMinimal";

package/src/components/Hero/Hero.test.tsx

@@ -1,71 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { render, screen } from "@testing-library/react";
-import { Hero } from "./Hero";
-
-const base = {
-  title: "Build something great",
-  description: "A short description.",
-  eyebrow: "New release",
-};
-
-describe("Hero", () => {
-  it("renders the headline and description", () => {
-    render(<Hero {...base} />);
-    expect(
-      screen.getByRole("heading", { name: "Build something great" }),
-    ).toBeInTheDocument();
-    expect(screen.getByText("A short description.")).toBeInTheDocument();
-  });
-
-  it("renders an eyebrow, primary and secondary actions", () => {
-    render(
-      <Hero
-        {...base}
-        primaryAction={<a href="#a">Primary</a>}
-        secondaryAction={<a href="#b">Secondary</a>}
-      />,
-    );
-    expect(screen.getByText("New release")).toBeInTheDocument();
-    expect(screen.getByRole("link", { name: "Primary" })).toBeInTheDocument();
-    expect(screen.getByRole("link", { name: "Secondary" })).toBeInTheDocument();
-  });
-
-  it("renders the split variant by default with meta row and media", () => {
-    render(
-      <Hero
-        {...base}
-        media={<div data-testid="media" />}
-        meta={[{ label: "4.9/5", icon: <span>★</span> }]}
-      />,
-    );
-    expect(screen.getByTestId("media")).toBeInTheDocument();
-    expect(screen.getByText("4.9/5")).toBeInTheDocument();
-    const section = screen.getByTestId("media").closest("section");
-    expect(section).toHaveClass("bg-background");
-  });
-
-  it("renders the centered variant with centered copy", () => {
-    render(<Hero {...base} variant="centered" media={<div data-testid="m" />} />);
-    const h1 = screen.getByRole("heading", { name: "Build something great" });
-    expect(h1).toBeInTheDocument();
-    expect(screen.getByTestId("m")).toBeInTheDocument();
-  });
-
-  it("renders the statement variant as an ink band with a grain overlay", () => {
-    const { container } = render(<Hero {...base} variant="statement" />);
-    const section = container.querySelector("section");
-    expect(section).toHaveClass("bg-secondary");
-    // Statement paints a grain overlay div.
-    expect(container.querySelector(".grain")).toBeInTheDocument();
-  });
-
-  it("omits the meta row when no meta is supplied", () => {
-    render(<Hero {...base} />);
-    expect(screen.queryByRole("list")).not.toBeInTheDocument();
-  });
-
-  it("forwards an id to the section", () => {
-    const { container } = render(<Hero {...base} id="home" />);
-    expect(container.querySelector("section#home")).not.toBeNull();
-  });
-});

package/src/components/Hero/Hero.tsx

@@ -1,12 +0,0 @@
-import { forwardRef } from "react";
-import type { HeroProps } from "./types";
-import { HeroSplit } from "./variants/Split";
-import { HeroCentered } from "./variants/Centered";
-import { HeroStatement } from "./variants/Statement";
-
-export const Hero = forwardRef<HTMLElement, HeroProps>(({ variant = "split", ...props }, ref) => {
-  if (variant === "centered") return <HeroCentered ref={ref} {...props} />;
-  if (variant === "statement") return <HeroStatement ref={ref} {...props} />;
-  return <HeroSplit ref={ref} {...props} />;
-});
-Hero.displayName = "Hero";

package/src/components/Hero/index.ts

@@ -1,2 +0,0 @@
-export { Hero } from "./Hero";
-export type { HeroProps, HeroMeta, HeroVariant } from "./types";

package/src/components/Hero/parts.tsx

@@ -1,29 +0,0 @@
-import type { ReactNode } from "react";
-
-export const heroContainer =
-  "relative mx-auto flex w-full max-w-6xl flex-col items-center px-5 sm:px-8";
-
-export const heroTitleBase =
-  "font-display font-semibold tracking-[-0.03em] text-balance text-foreground";
-
-export function HeroEyebrow({ eyebrow }: { eyebrow?: ReactNode }) {
-  if (typeof eyebrow === "string") {
-    return (
-      <p className="text-xs font-semibold uppercase tracking-[0.2em] text-primary">
-        {eyebrow}
-      </p>
-    );
-  }
-  return eyebrow ? <div>{eyebrow}</div> : null;
-}
-
-export function HeroActions({
-  primaryAction,
-  secondaryAction,
-}: {
-  primaryAction?: ReactNode;
-  secondaryAction?: ReactNode;
-}) {
-  if (!primaryAction && !secondaryAction) return null;
-  return <div className="flex flex-wrap items-center gap-4">{primaryAction}{secondaryAction}</div>;
-}

package/src/components/Hero/types.ts

@@ -1,20 +0,0 @@
-import type { HTMLAttributes, ReactNode } from "react";
-
-export type HeroVariant = "split" | "centered" | "statement";
-
-export interface HeroMeta {
-  label: string;
-  icon?: ReactNode;
-}
-
-export interface HeroProps extends Omit<HTMLAttributes<HTMLElement>, "title"> {
-  variant?: HeroVariant;
-  eyebrow?: ReactNode;
-  title: ReactNode;
-  description?: ReactNode;
-  primaryAction?: ReactNode;
-  secondaryAction?: ReactNode;
-  media?: ReactNode;
-  /** Small trust/status row shown under the copy or CTAs. */
-  meta?: HeroMeta[];
-}

package/src/components/Hero/variants/Centered.tsx

@@ -1,54 +0,0 @@
-import { forwardRef } from "react";
-import { cn } from "../../../utils/cn";
-import { HeroActions, HeroEyebrow, heroContainer, heroTitleBase } from "../parts";
-import type { HeroProps } from "../types";
-
-/** Centered — understated, one statement, generous white space. */
-export const HeroCentered = forwardRef<HTMLElement, HeroProps>(
-  (
-    { className, eyebrow, title, description, primaryAction, secondaryAction, media, meta, id, ...props },
-    ref,
-  ) => (
-    <section
-      ref={ref}
-      id={id}
-      className={cn("relative w-full border-b border-border bg-background", className)}
-      {...props}
-    >
-      <div className={cn(heroContainer, "pt-24 pb-20 text-center sm:pt-32 sm:pb-24")}>
-        <HeroEyebrow eyebrow={eyebrow} />
-        <h1 className={cn(heroTitleBase, "mt-7 max-w-4xl text-5xl leading-[1.04] sm:text-6xl lg:text-7xl")}>
-          {title}
-        </h1>
-        {description ? (
-          <p className="mx-auto mt-7 max-w-xl text-pretty leading-relaxed text-muted-foreground sm:text-lg">
-            {description}
-          </p>
-        ) : null}
-        {primaryAction || secondaryAction ? (
-          <div className="mt-10 justify-center">
-            <HeroActions primaryAction={primaryAction} secondaryAction={secondaryAction} />
-          </div>
-        ) : null}
-        {meta ? (
-          <ul className="mt-14 flex flex-wrap items-center justify-center gap-x-9 gap-y-3">
-            {meta.map((m, i) => (
-              <li
-                key={m.label}
-                className={cn(
-                  "flex items-center gap-2 text-sm text-muted-foreground",
-                  i > 0 && "sm:border-l sm:border-border sm:pl-9",
-                )}
-              >
-                {m.icon ? <span className="text-foreground/35">{m.icon}</span> : null}
-                {m.label}
-              </li>
-            ))}
-          </ul>
-        ) : null}
-        {media ? <div className="mt-16 w-full">{media}</div> : null}
-      </div>
-    </section>
-  ),
-);
-HeroCentered.displayName = "HeroCentered";

package/src/components/Hero/variants/Split.tsx

@@ -1,53 +0,0 @@
-import { forwardRef } from "react";
-import { cn } from "../../../utils/cn";
-import { HeroActions, HeroEyebrow, heroContainer, heroTitleBase } from "../parts";
-import type { HeroProps } from "../types";
-
-/** Split — editorial grid: huge type left, media right, meta rule under. */
-export const HeroSplit = forwardRef<HTMLElement, HeroProps>(
-  (
-    { className, eyebrow, title, description, primaryAction, secondaryAction, media, meta, id, ...props },
-    ref,
-  ) => (
-    <section
-      ref={ref}
-      id={id}
-      className={cn("relative w-full border-b border-border bg-background", className)}
-      {...props}
-    >
-      <div className={cn(
-        heroContainer,
-        "items-start gap-14 pt-20 pb-20 sm:pt-28 sm:pb-28 lg:grid lg:grid-cols-[1.05fr_0.95fr] lg:gap-20",
-      )}>
-        <div className="max-w-xl">
-          <HeroEyebrow eyebrow={eyebrow} />
-          <h1 className={cn(heroTitleBase, "mt-6 text-5xl leading-[1.03] sm:text-6xl lg:text-7xl")}>
-            {title}
-          </h1>
-          {description ? (
-            <p className="mt-7 max-w-md text-pretty leading-relaxed text-muted-foreground sm:text-lg">
-              {description}
-            </p>
-          ) : null}
-          {primaryAction || secondaryAction ? (
-            <div className="mt-10">
-              <HeroActions primaryAction={primaryAction} secondaryAction={secondaryAction} />
-            </div>
-          ) : null}
-          {meta ? (
-            <ul className="mt-14 flex flex-wrap items-center gap-x-8 gap-y-3 border-t border-border pt-6">
-              {meta.map((m) => (
-                <li key={m.label} className="flex items-center gap-2 text-sm text-muted-foreground">
-                  {m.icon ? <span className="text-foreground/35">{m.icon}</span> : null}
-                  {m.label}
-                </li>
-              ))}
-            </ul>
-          ) : null}
-        </div>
-        {media ? <div className="w-full self-center">{media}</div> : null}
-      </div>
-    </section>
-  ),
-);
-HeroSplit.displayName = "HeroSplit";

package/src/components/Hero/variants/Statement.tsx

@@ -1,60 +0,0 @@
-"use client";
-import { forwardRef } from "react";
-import { cn } from "../../../utils/cn";
-import { useTokenForeground } from "../../../utils/useTokenForeground";
-import { HeroActions, heroContainer } from "../parts";
-import type { HeroProps } from "../types";
-
-/** Statement — full-bleed ink band. No eyebrow, pure message. */
-export const HeroStatement = forwardRef<HTMLElement, HeroProps>(
-  (
-    { className, title, description, primaryAction, secondaryAction, media, meta, id, ...props },
-    ref,
-  ) => {
-    // Statement paints its own background from --color-secondary, so the
-    // readable text color must be derived from THAT token, not the brand.
-    const fg = useTokenForeground("--color-secondary");
-
-    return (
-      <section
-        ref={ref}
-        id={id}
-        className={cn("relative w-full overflow-hidden bg-secondary", className)}
-        style={{ color: fg }}
-        {...props}
-      >
-        <div aria-hidden className="pointer-events-none absolute inset-0 grain opacity-[0.07] mix-blend-overlay" />
-        <div aria-hidden className="pointer-events-none absolute inset-x-0 top-0 h-px bg-white/10" />
-        <div className={cn(heroContainer, "pt-28 pb-24 text-center sm:pt-36 sm:pb-32")}>
-          <h1
-            className="max-w-5xl font-display text-[2.9rem] font-semibold leading-[1.02] tracking-[-0.04em] text-balance sm:text-7xl lg:text-8xl"
-            style={{ color: fg }}
-          >
-            {title}
-          </h1>
-          {description ? (
-            <p className="mx-auto mt-8 max-w-xl text-pretty leading-relaxed sm:text-lg" style={{ color: fg, opacity: 0.72 }}>
-              {description}
-            </p>
-          ) : null}
-          {primaryAction || secondaryAction ? (
-            <div className="mt-11 justify-center">
-              <HeroActions primaryAction={primaryAction} secondaryAction={secondaryAction} />
-            </div>
-          ) : null}
-          {meta ? (
-            <ul className="mt-16 flex flex-wrap items-center justify-center gap-x-10 gap-y-3">
-              {meta.map((m) => (
-                <li key={m.label} className="flex items-center gap-2 text-sm font-medium" style={{ color: fg, opacity: 0.72 }}>
-                  {m.icon ? <span>{m.icon}</span> : null}
-                  {m.label}
-                </li>
-              ))}
-            </ul>
-          ) : null}
-        </div>
-      </section>
-    );
-  },
-);
-HeroStatement.displayName = "HeroStatement";

package/src/components/LanguageSwitcher/LanguageSwitcher.test.tsx

@@ -1,64 +0,0 @@
-import { describe, it, expect, vi } from "vitest";
-import { render, screen, fireEvent } from "@testing-library/react";
-import { LanguageSwitcher } from "./LanguageSwitcher";
-
-const languages = [
-  { code: "tr", label: "Türkçe" },
-  { code: "en", label: "English" },
-];
-
-function trigger(container: HTMLElement): HTMLButtonElement {
-  // The dropdown trigger is the only button with aria-haspopup="listbox".
-  return container.querySelector('button[aria-haspopup="listbox"]')!;
-}
-
-describe("LanguageSwitcher", () => {
-  it("renders a trigger showing the current language (dropdown by default)", () => {
-    const { container } = render(
-      <LanguageSwitcher languages={languages} defaultValue="tr" />,
-    );
-    expect(trigger(container)).toBeInTheDocument();
-    expect(trigger(container)).toHaveTextContent("Türkçe");
-  });
-
-  it("opens a listbox and selects a language via onChange", () => {
-    const onChange = vi.fn();
-    const { container } = render(
-      <LanguageSwitcher languages={languages} defaultValue="en" onChange={onChange} />,
-    );
-
-    fireEvent.click(trigger(container));
-    expect(screen.getByRole("listbox")).toBeInTheDocument();
-
-    fireEvent.click(screen.getByRole("option", { name: /Türkçe/ }));
-    expect(onChange).toHaveBeenCalledWith("tr");
-  });
-
-  it("marks the active option as selected", () => {
-    const { container } = render(
-      <LanguageSwitcher languages={languages} defaultValue="en" />,
-    );
-    fireEvent.click(trigger(container));
-
-    const enOption = screen.getByRole("option", { name: /English/ });
-    expect(enOption).toHaveAttribute("aria-selected", "true");
-    const trOption = screen.getByRole("option", { name: /Türkçe/ });
-    expect(trOption).toHaveAttribute("aria-selected", "false");
-  });
-
-  it("collapses the dropdown after selecting a language", () => {
-    const { container } = render(
-      <LanguageSwitcher languages={languages} defaultValue="en" />,
-    );
-    fireEvent.click(trigger(container));
-    expect(trigger(container)).toHaveAttribute("aria-expanded", "true");
-
-    fireEvent.click(screen.getByRole("option", { name: /English/ }));
-    expect(trigger(container)).toHaveAttribute("aria-expanded", "false");
-  });
-
-  it("renders nothing when there are no languages", () => {
-    const { container } = render(<LanguageSwitcher languages={[]} />);
-    expect(container).toBeEmptyDOMElement();
-  });
-});