import React, { useMemo } from 'react';
import PropTypes from 'prop-types';
import CircularProgress from '@mui/material/CircularProgress';
import MuiIconButton from './IconButtonStyles';
import { iconType } from './types';
/**
 * IconButtons allow users to take actions, and make choices using icons to describe best the action
 * It triggers an action or event when activated.
 *
 * Props of the [Material-UI Button](https://mui.com/material-ui/api/button/#props) component are also available.
 */
const IconButton = ({ children, type, fontSize = 'small', loading, size = 'medium', color = 'secondary', ...rest }) => {
    const CustomIcon = useMemo(() => iconType[type], [type]);
    const iconButtonProps = {
        ['aria-label']: type || 'iconButton'
    };
    return (React.createElement(MuiIconButton, { ...iconButtonProps, size: size, color: color, ...rest }, loading ? (React.createElement(CircularProgress, { color: "inherit", size: 24 })) : type ? (React.createElement(CustomIcon, { fontSize: fontSize })) : (children)));
};
IconButton.propTypes = {
    /**
     * @default 'secondary'
     * Color of the button
     */
    color: PropTypes.oneOf([
        'primary',
        'secondary',
        'info',
        'success',
        'warning',
        'error',
        'rose',
        'white',
        'dark',
        'transparent',
        'default',
    ]),
    /**
     * @default 'medium'
     * Size of the button
     */
    size: PropTypes.oneOf(['tiny', 'small', 'medium', 'large']),
    /**
     * Override or extend the styles applied to the component
     */
    className: PropTypes.string,
    /**
     * If true, button will be disabled. Default is set to false
     */
    disabled: PropTypes.bool,
    /**
     * If true, button is in loading state.
     */
    loading: PropTypes.bool,
    /**
     * Text to be displayed when the user hover over the button
     */
    tooltip: PropTypes.string,
    /**
     * Content of the button
     */
    children: PropTypes.node,
    /**
     * 	Callback fired when a "click" event is detected.
     */
    onClick: PropTypes.func,
    /**
     * Custom icon to be displayed
     */
    type: PropTypes.oneOf(['add', 'cancel', 'delete', 'download', 'downward', 'edit', 'view', 'save', 'upward', 'expandLess', 'expandMore']),
    /**
     * @default 'small'
     * Size of the icon.
     */
    fontSize: PropTypes.oneOf(['inherit', 'small', 'medium', 'large'])
};
export default IconButton;
//# sourceMappingURL=IconButton.js.map