import PropTypes from "prop-types";
import React from "react";
import Icon from "react-oui-icons";
import classNames from "classnames";

/**
 *
 * @param {Object} props - Properties passed to component
 * @returns {ReactElement}
 */

const CloseButton = ({
    className,
    onClick,
    size,
    ...props
}) => {
    return (
        <button className={classNames("oui-close-button", className)} onClick={onClick} {...props}>
            <Icon name="close" size={size} />
        </button>
    );
};

CloseButton.propTypes = {
    /** CSS class names. */
    className: PropTypes.string,
    /**
     *  Function to perform when the close button is clicked.
     */
    onClick: PropTypes.func.isRequired,
    /**
     *  Size of the close button.
     */
    size: PropTypes.oneOf(["small", "medium", "large"]),
};

CloseButton.defaultProps = {
    size: "medium",
};

export default CloseButton;
