"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("@testing-library/react");
const user_event_1 = __importDefault(require("@testing-library/user-event"));
const TailwindButton_1 = require("../TailwindButton");
describe('TailwindButton Component', () => {
    test('renders with children text', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { children: "Click Me" }));
        const button = react_1.screen.getByRole('button', { name: 'Click Me' });
        expect(button).toBeInTheDocument();
        expect(button).toHaveTextContent('Click Me');
    });
    test('renders with left icon', () => {
        const LeftIcon = () => (0, jsx_runtime_1.jsx)("span", { "data-testid": "left-icon", children: "\uD83D\uDD0D" });
        (0, react_1.render)((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { leftIcon: (0, jsx_runtime_1.jsx)(LeftIcon, {}), children: "Search" }));
        const button = react_1.screen.getByRole('button', { name: /Search/ });
        const icon = react_1.screen.getByTestId('left-icon');
        expect(button).toBeInTheDocument();
        expect(icon).toBeInTheDocument();
        expect(button).toContainElement(icon);
    });
    test('renders with right icon', () => {
        const RightIcon = () => (0, jsx_runtime_1.jsx)("span", { "data-testid": "right-icon", children: "\u27A1\uFE0F" });
        (0, react_1.render)((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { rightIcon: (0, jsx_runtime_1.jsx)(RightIcon, {}), children: "Next" }));
        const button = react_1.screen.getByRole('button', { name: /Next/ });
        const icon = react_1.screen.getByTestId('right-icon');
        expect(button).toBeInTheDocument();
        expect(icon).toBeInTheDocument();
        expect(button).toContainElement(icon);
    });
    test('handles click events', async () => {
        const handleClick = jest.fn();
        const user = user_event_1.default.setup();
        (0, react_1.render)((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { onClick: handleClick, children: "Click Me" }));
        const button = react_1.screen.getByRole('button', { name: 'Click Me' });
        await user.click(button);
        expect(handleClick).toHaveBeenCalledTimes(1);
    });
    test('renders in disabled state', async () => {
        const handleClick = jest.fn();
        const user = user_event_1.default.setup();
        (0, react_1.render)((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { isDisabled: true, onClick: handleClick, children: "Disabled Button" }));
        const button = react_1.screen.getByRole('button', { name: 'Disabled Button' });
        expect(button).toBeDisabled();
        expect(button).toHaveClass('disabled:opacity-50');
        await user.click(button);
        expect(handleClick).not.toHaveBeenCalled();
    });
    test('renders in loading state', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { isLoading: true, loadingText: "Loading...", children: "Submit" }));
        const button = react_1.screen.getByRole('button', { name: 'Loading...' });
        expect(button).toHaveAttribute('data-loading');
        expect(button).toContainElement(react_1.screen.getByText('Loading...'));
        // Should contain SVG loading spinner
        const spinner = button.querySelector('svg');
        expect(spinner).toBeInTheDocument();
        expect(spinner).toHaveClass('animate-spin');
    });
    test('renders with various sizes', () => {
        const { rerender } = (0, react_1.render)((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { size: "sm", children: "Small Button" }));
        let button = react_1.screen.getByRole('button', { name: 'Small Button' });
        expect(button).toHaveClass('h-9');
        expect(button).toHaveClass('text-sm');
        rerender((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { size: "lg", children: "Large Button" }));
        button = react_1.screen.getByRole('button', { name: 'Large Button' });
        expect(button).toHaveClass('h-12');
        expect(button).toHaveClass('text-lg');
    });
    test('renders with various variants', () => {
        const { rerender } = (0, react_1.render)((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { variant: "outline", children: "Outline Button" }));
        let button = react_1.screen.getByRole('button', { name: 'Outline Button' });
        expect(button).toHaveClass('border');
        expect(button).toHaveClass('bg-background');
        rerender((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { variant: "primary", children: "Primary Button" }));
        button = react_1.screen.getByRole('button', { name: 'Primary Button' });
        expect(button).toHaveClass('bg-blue-600');
        expect(button).toHaveClass('text-white');
    });
    test('renders as full width', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { isFullWidth: true, children: "Full Width Button" }));
        const button = react_1.screen.getByRole('button', { name: 'Full Width Button' });
        expect(button).toHaveClass('w-full');
    });
    test('applies additional class names', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { className: "custom-class", children: "Custom Class Button" }));
        const button = react_1.screen.getByRole('button', { name: 'Custom Class Button' });
        expect(button).toHaveClass('custom-class');
    });
    test('forwards additional props to button element', () => {
        (0, react_1.render)((0, jsx_runtime_1.jsx)(TailwindButton_1.TailwindButton, { "data-testid": "test-button", "aria-label": "Test Button", type: "submit", children: "Submit" }));
        const button = react_1.screen.getByTestId('test-button');
        expect(button).toHaveAttribute('aria-label', 'Test Button');
        expect(button).toHaveAttribute('type', 'submit');
    });
});
//# sourceMappingURL=TailwindButton.test.js.map