import { render, screen } from "@solidjs/testing-library";
import { describe, expect, it } from "vitest";
import { Card } from "../../../src/components/card/index";
import { CardPropsSchema, CardMeta } from "../../../src/components/card/card.props";

describe("Card", () => {
  it("renders with compound API", () => {
    render(() => (
      <Card>
        <Card.Header>
          <Card.Title>Title</Card.Title>
          <Card.Description>Description</Card.Description>
        </Card.Header>
        <Card.Content>Body content</Card.Content>
        <Card.Footer>Footer</Card.Footer>
      </Card>
    ));
    expect(screen.getByText("Title")).toBeTruthy();
    expect(screen.getByText("Description")).toBeTruthy();
    expect(screen.getByText("Body content")).toBeTruthy();
    expect(screen.getByText("Footer")).toBeTruthy();
  });

  it("renders as div element", () => {
    render(() => <Card data-testid="card"><Card.Content>Content</Card.Content></Card>);
    expect(screen.getByTestId("card").tagName).toBe("DIV");
  });

  it("schema validates empty props", () => {
    expect(CardPropsSchema.safeParse({}).success).toBe(true);
  });

  it("meta has all required fields", () => {
    expect(CardMeta.name).toBe("Card");
    expect(CardMeta.parts).toContain("Root");
    expect(CardMeta.parts).toContain("Header");
    expect(CardMeta.parts).toContain("Content");
    expect(CardMeta.parts).toContain("Footer");
  });
});