"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 Button_1 = require("./Button");
const BFUIProvider_1 = require("../../BFUIProvider");
// Wrap component with BFUIProvider for Chakra UI theme context
const renderWithProvider = (ui) => {
    return (0, react_1.render)((0, jsx_runtime_1.jsx)(BFUIProvider_1.BFUIProvider, { children: ui }));
};
describe('Button Component', () => {
    test('renders with children text', () => {
        renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { 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" });
        renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { 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" });
        renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { 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();
        renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { 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();
        renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { isDisabled: true, onClick: handleClick, children: "Disabled Button" }));
        const button = react_1.screen.getByRole('button', { name: 'Disabled Button' });
        expect(button).toBeDisabled();
        await user.click(button);
        expect(handleClick).not.toHaveBeenCalled();
    });
    test('renders in loading state', () => {
        renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { isLoading: true, loadingText: "Loading...", children: "Submit" }));
        const button = react_1.screen.getByRole('button', { name: 'Loading...' });
        expect(button).toHaveAttribute('data-loading');
    });
    test('renders with custom variants', () => {
        const { rerender } = renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "outline", children: "Outline Button" }));
        const outlineButton = react_1.screen.getByRole('button', { name: 'Outline Button' });
        expect(outlineButton).toBeInTheDocument();
        rerender((0, jsx_runtime_1.jsx)(BFUIProvider_1.BFUIProvider, { children: (0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "ghost", children: "Ghost Button" }) }));
        const ghostButton = react_1.screen.getByRole('button', { name: 'Ghost Button' });
        expect(ghostButton).toBeInTheDocument();
        rerender((0, jsx_runtime_1.jsx)(BFUIProvider_1.BFUIProvider, { children: (0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "link", children: "Link Button" }) }));
        const linkButton = react_1.screen.getByRole('button', { name: 'Link Button' });
        expect(linkButton).toBeInTheDocument();
    });
    test('renders with different sizes', () => {
        const { rerender } = renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { size: "sm", children: "Small Button" }));
        const smallButton = react_1.screen.getByRole('button', { name: 'Small Button' });
        expect(smallButton).toBeInTheDocument();
        rerender((0, jsx_runtime_1.jsx)(BFUIProvider_1.BFUIProvider, { children: (0, jsx_runtime_1.jsx)(Button_1.Button, { size: "lg", children: "Large Button" }) }));
        const largeButton = react_1.screen.getByRole('button', { name: 'Large Button' });
        expect(largeButton).toBeInTheDocument();
    });
    test('renders with custom color scheme', () => {
        renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { colorScheme: "red", children: "Danger Button" }));
        const dangerButton = react_1.screen.getByRole('button', { name: 'Danger Button' });
        expect(dangerButton).toBeInTheDocument();
    });
    test('renders as full width', () => {
        renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { isFullWidth: true, children: "Full Width Button" }));
        const fullWidthButton = react_1.screen.getByRole('button', { name: 'Full Width Button' });
        expect(fullWidthButton).toHaveStyle({ width: '100%' });
    });
    test('maps custom variants to Chakra variants', () => {
        const { rerender } = renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "primary", children: "Primary Button" }));
        const primaryButton = react_1.screen.getByRole('button', { name: 'Primary Button' });
        expect(primaryButton).toBeInTheDocument();
        rerender((0, jsx_runtime_1.jsx)(BFUIProvider_1.BFUIProvider, { children: (0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "secondary", children: "Secondary Button" }) }));
        const secondaryButton = react_1.screen.getByRole('button', { name: 'Secondary Button' });
        expect(secondaryButton).toBeInTheDocument();
        rerender((0, jsx_runtime_1.jsx)(BFUIProvider_1.BFUIProvider, { children: (0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "danger", children: "Danger Button" }) }));
        const dangerButton = react_1.screen.getByRole('button', { name: 'Danger Button' });
        expect(dangerButton).toBeInTheDocument();
    });
    test('renders with custom class name', () => {
        renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { className: "custom-button-class", children: "Custom Class Button" }));
        const button = react_1.screen.getByRole('button', { name: 'Custom Class Button' });
        expect(button).toHaveClass('custom-button-class');
    });
    test('renders with aria-label', () => {
        renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { "aria-label": "Close modal", children: "X" }));
        const button = react_1.screen.getByRole('button', { name: 'Close modal' });
        expect(button).toBeInTheDocument();
    });
    test('forwards data-testid attribute', () => {
        renderWithProvider((0, jsx_runtime_1.jsx)(Button_1.Button, { "data-testid": "submit-button", children: "Submit" }));
        const button = react_1.screen.getByTestId('submit-button');
        expect(button).toBeInTheDocument();
        expect(button).toHaveTextContent('Submit');
    });
});
//# sourceMappingURL=Button.test.js.map