"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 = __importDefault(require("react"));
const react_2 = require("@testing-library/react");
const TailwindSelect_1 = require("../components/modern/TailwindSelect");
describe('TailwindSelect', () => {
    const mockOptions = [
        { value: 'option1', label: 'Option 1' },
        { value: 'option2', label: 'Option 2' },
        { value: 'option3', label: 'Option 3', disabled: true }
    ];
    const mockGroups = [
        {
            label: 'Group 1',
            options: [
                { value: 'group1-option1', label: 'Group 1 - Option 1' },
                { value: 'group1-option2', label: 'Group 1 - Option 2' }
            ]
        },
        {
            label: 'Group 2',
            options: [
                { value: 'group2-option1', label: 'Group 2 - Option 1' },
                { value: 'group2-option2', label: 'Group 2 - Option 2', disabled: true }
            ]
        }
    ];
    test('renders correctly with default props', () => {
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", options: mockOptions }));
        const select = react_2.screen.getByRole('combobox');
        expect(select).toBeInTheDocument();
        expect(select).toHaveAttribute('name', 'test-select');
        const options = react_2.screen.getAllByRole('option');
        expect(options).toHaveLength(3);
        expect(options[0]).toHaveTextContent('Option 1');
        expect(options[1]).toHaveTextContent('Option 2');
        expect(options[2]).toHaveTextContent('Option 3');
        expect(options[2]).toHaveAttribute('disabled');
    });
    test('renders with label and required indicator', () => {
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", label: "Test Label", isRequired: true, options: mockOptions }));
        const label = react_2.screen.getByText('Test Label');
        expect(label).toBeInTheDocument();
        const requiredIndicator = react_2.screen.getByText('*');
        expect(requiredIndicator).toBeInTheDocument();
        expect(requiredIndicator).toHaveClass('text-red-500');
    });
    test('renders with placeholder', () => {
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", placeholder: "Select an option", options: mockOptions }));
        const placeholder = react_2.screen.getByText('Select an option');
        expect(placeholder).toBeInTheDocument();
        expect(placeholder.tagName).toBe('OPTION');
        expect(placeholder).toHaveAttribute('disabled');
        expect(placeholder).toHaveAttribute('value', '');
    });
    test('renders helper text when provided', () => {
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", helperText: "This is a helper text", options: mockOptions }));
        const helperText = react_2.screen.getByText('This is a helper text');
        expect(helperText).toBeInTheDocument();
        expect(helperText).toHaveClass('text-gray-500');
    });
    test('renders error message when provided', () => {
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", error: "Please select an option", options: mockOptions }));
        const errorMessage = react_2.screen.getByText('Please select an option');
        expect(errorMessage).toBeInTheDocument();
        expect(errorMessage).toHaveClass('text-red-500');
        const select = react_2.screen.getByRole('combobox');
        expect(select).toHaveAttribute('aria-invalid', 'true');
    });
    test('handles selection correctly', () => {
        const handleChange = jest.fn();
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", options: mockOptions, onChange: handleChange }));
        const select = react_2.screen.getByRole('combobox');
        react_2.fireEvent.change(select, { target: { value: 'option2' } });
        expect(handleChange).toHaveBeenCalledTimes(1);
        expect(select).toHaveValue('option2');
    });
    test('applies disabled state correctly', () => {
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", isDisabled: true, options: mockOptions }));
        const select = react_2.screen.getByRole('combobox');
        expect(select).toBeDisabled();
        expect(select).toHaveClass('disabled:opacity-50');
    });
    test('renders with option groups', () => {
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", groups: mockGroups }));
        const optgroups = react_2.screen.getAllByRole('group');
        expect(optgroups).toHaveLength(2);
        expect(optgroups[0]).toHaveAttribute('label', 'Group 1');
        expect(optgroups[1]).toHaveAttribute('label', 'Group 2');
        const options = react_2.screen.getAllByRole('option');
        expect(options).toHaveLength(4);
        expect(options[0]).toHaveTextContent('Group 1 - Option 1');
        expect(options[1]).toHaveTextContent('Group 1 - Option 2');
        expect(options[2]).toHaveTextContent('Group 2 - Option 1');
        expect(options[3]).toHaveTextContent('Group 2 - Option 2');
        expect(options[3]).toHaveAttribute('disabled');
    });
    test('applies different sizes correctly', () => {
        const { rerender } = (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", size: "sm", options: mockOptions, "data-testid": "test-select" }));
        let select = react_2.screen.getByTestId('test-select');
        expect(select).toHaveClass('h-8');
        rerender((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", size: "md", options: mockOptions, "data-testid": "test-select" }));
        select = react_2.screen.getByTestId('test-select');
        expect(select).toHaveClass('h-10');
        rerender((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", size: "lg", options: mockOptions, "data-testid": "test-select" }));
        select = react_2.screen.getByTestId('test-select');
        expect(select).toHaveClass('h-12');
    });
    test('renders with icon', () => {
        const iconTestId = 'test-icon';
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", options: mockOptions, icon: (0, jsx_runtime_1.jsx)("div", { "data-testid": iconTestId, children: "\uD83D\uDD0D" }), iconPosition: "left" }));
        const icon = react_2.screen.getByTestId(iconTestId);
        expect(icon).toBeInTheDocument();
        const select = react_2.screen.getByRole('combobox');
        expect(select).toHaveClass('pl-10');
    });
    test('renders with custom arrow', () => {
        const arrowTestId = 'custom-arrow';
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", options: mockOptions, customArrow: (0, jsx_runtime_1.jsx)("div", { "data-testid": arrowTestId, children: "\u25BC" }) }));
        const arrow = react_2.screen.getByTestId(arrowTestId);
        expect(arrow).toBeInTheDocument();
        const select = react_2.screen.getByRole('combobox');
        expect(select).toHaveClass('pr-10');
        expect(select).not.toHaveClass('appearance-none');
    });
    test('applies additional class names correctly', () => {
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", options: mockOptions, containerClassName: "test-container-class", selectClassName: "test-select-class", labelClassName: "test-label-class", label: "Test Label" }));
        const container = react_2.screen.getByRole('combobox').parentElement?.parentElement;
        expect(container).toHaveClass('test-container-class');
        const select = react_2.screen.getByRole('combobox');
        expect(select).toHaveClass('test-select-class');
        const label = react_2.screen.getByText('Test Label');
        expect(label).toHaveClass('test-label-class');
    });
    test('forwards ref to select element', () => {
        const ref = react_1.default.createRef();
        (0, react_2.render)((0, jsx_runtime_1.jsx)(TailwindSelect_1.TailwindSelect, { name: "test-select", options: mockOptions, ref: ref }));
        expect(ref.current).not.toBeNull();
        expect(ref.current?.tagName).toBe('SELECT');
    });
});
//# sourceMappingURL=TailwindSelect.test.js.map