import { render } from '@testing-library/react';
import { describe, it, expect } from 'vitest';
import { AnimatedSection, AnimatedItem } from '../AnimatedSection';

describe('AnimatedSection', () => {
  it('renders children', () => {
    const { getByText } = render(
      <AnimatedSection><span>Content</span></AnimatedSection>
    );
    expect(getByText('Content')).toBeTruthy();
  });

  it('passes className to wrapper', () => {
    const { container } = render(
      <AnimatedSection className="grid gap-4"><span>X</span></AnimatedSection>
    );
    expect((container.firstChild as HTMLElement).className).toContain('grid');
    expect((container.firstChild as HTMLElement).className).toContain('gap-4');
  });
});

describe('AnimatedItem', () => {
  it('renders children', () => {
    const { getByText } = render(<AnimatedItem>Item</AnimatedItem>);
    expect(getByText('Item')).toBeTruthy();
  });
});
