import { jsx as _jsx } from "react/jsx-runtime";
import { Tooltip } from '@mui/material';
import cx from 'classnames';
import Icon from '../Icon/Icon';
import { iconSizeToPx } from '../Icon/IconSizes';
import './styles.scss';
export const IconButtonSizes = ['large', 'medium', 'small', 'x-small'];
export const IconButtonColors = ['accent', 'danger', 'white'];
export default function IconButton({ name, iconImage, className, disabled = false, active = false, color = 'accent', size = 'large', mode = 'filled', filledIcon, title, spin = false, iconSize, iconClassName, tooltipPlacement = 'top', onClick = () => { }, type = 'button', ...buttonProps }) {
    const getClassNames = cx('ds-icon-button', className, size, mode, color, {
        active: !disabled && active,
    });
    const getIconSize = () => {
        if (iconSize)
            return iconSize;
        if (size === 'large')
            return 'small';
        if (size === 'medium' || size === 'small')
            return 'x-small';
        return 'x-small';
    };
    const resolvedIconSize = getIconSize();
    const iconBoxPx = iconSizeToPx(resolvedIconSize);
    const renderContent = () => {
        if (spin) {
            return (_jsx(Icon, { name: "progress_activity", size: resolvedIconSize, filled: filledIcon, className: "spin" }));
        }
        if (iconImage) {
            return (_jsx("img", { src: iconImage, alt: "", className: "ds-button-icon-image", width: iconBoxPx, height: iconBoxPx }));
        }
        if (name) {
            return (_jsx(Icon, { name: name, size: resolvedIconSize, filled: filledIcon, className: iconClassName }));
        }
        return null;
    };
    const renderButton = () => (_jsx("button", { type: type, disabled: disabled, className: getClassNames, onClick: onClick, ...buttonProps, children: renderContent() }));
    return (_jsx(Tooltip, { title: title, placement: tooltipPlacement, arrow: true, slotProps: {
            tooltip: {
                className: 'ds-icon-button-tooltip',
            },
        }, children: renderButton() }));
}
