import React from 'react';
import PropTypes from 'prop-types';
import {Dropdown as ReactBootstrapDropdown} from 'react-bootstrap';

export type DropdownProps = {
    testAutomationId?: string;
    bsStyle?: string;
} & ReactBootstrapDropdown.DropdownBaseProps;

export class Dropdown extends React.Component<DropdownProps & React.HTMLProps<Dropdown>> {
    static Menu = ReactBootstrapDropdown.Menu as any;
    static Toggle = ReactBootstrapDropdown.Toggle as any;

    static propTypes = {
        testAutomationId: PropTypes.string,
        children: PropTypes.node.isRequired
    };

    static defaultProps = {
        testAutomationId: null,
        children: null
    };

    render() {
        let {children, testAutomationId, ...props} = this.props;

        return (
            <ReactBootstrapDropdown data-test-automation-id={testAutomationId} {...props as any}>
                {children}
            </ReactBootstrapDropdown>
        );
    }
}
