/**
 * (share/ui/card — subcomponents and size prop).
 */
import React from 'react'
import { render, screen } from '@testing-library/react'
import {
  Card,
  CardContent,
  CardHeader,
  CardTitle,
  CardFooter,
  CardDescription,
  CardAction,
} from '@/share/ui/card'

describe('[share/ui/card]', () => {
  describe('structure', () => {
    it('renders Card with CardContent', () => {
      render(
        <Card>
          <CardContent>Content</CardContent>
        </Card>,
      )
      expect(screen.getByText('Content')).toBeInTheDocument()
    })

    it('renders CardHeader and CardTitle', () => {
      render(
        <Card>
          <CardHeader>
            <CardTitle>Title</CardTitle>
          </CardHeader>
        </Card>,
      )
      expect(screen.getByText('Title')).toBeInTheDocument()
    })

    it('renders CardFooter', () => {
      render(
        <Card>
          <CardFooter>Footer</CardFooter>
        </Card>,
      )
      expect(screen.getByText('Footer')).toBeInTheDocument()
    })

    it('renders CardDescription under header', () => {
      render(
        <Card>
          <CardHeader>
            <CardTitle>Title</CardTitle>
            <CardDescription>Description text</CardDescription>
          </CardHeader>
        </Card>,
      )
      expect(screen.getByText('Description text')).toBeInTheDocument()
    })

    it('renders CardAction in header', () => {
      render(
        <Card>
          <CardHeader>
            <CardTitle>Title</CardTitle>
            <CardAction>
              <button type="button">Action</button>
            </CardAction>
          </CardHeader>
        </Card>,
      )
      expect(screen.getByRole('button', { name: 'Action' })).toBeInTheDocument()
    })
  })

  describe('size (BVA-style)', () => {
    it('sets data-size for sm, lg, xl', () => {
      const { rerender } = render(<Card size="sm">Content</Card>)
      expect(document.querySelector('[data-size="sm"]')).toBeInTheDocument()

      rerender(<Card size="lg">Content</Card>)
      expect(document.querySelector('[data-size="lg"]')).toBeInTheDocument()

      rerender(<Card size="xl">Content</Card>)
      expect(document.querySelector('[data-size="xl"]')).toBeInTheDocument()
    })
  })
})
