import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef } from 'react';
import './Button.scss';
import '../../assets/styles/_colors.scss';
import Icon from '../Icon';
import classNames from 'classnames';
import Typography from '../Typography';
const Button = forwardRef(({ variant = 'primary', backgroundColor, border, size = 'small', onClick, onCopy, label, disabled = false, children = null, type = 'button', className = '', style = {}, iconName, iconPosition = 'left', isChooseFile = false, buttonWidth = 'auto', buttonHeight = '28px', handleCloseIcon, selectedFile, fontSize = 10, typographyStyle, iconColor = '', isMandatory = false, iconSize, ...props }, ref) => {
    const iconWidth = iconSize?.width ?? 16;
    const iconHeight = iconSize?.height ?? 16;
    const renderIcon = () => iconName && (_jsx("div", { onClick: (e) => {
            if (iconName === 'close') {
                e.stopPropagation();
                handleCloseIcon?.();
            }
        }, children: _jsx(Icon, { height: iconHeight, width: iconWidth, color: iconName === 'close'
                ? 'var(--ff-delete-button-attachment)'
                : variant === 'danger'
                    ? 'var(--status-rejected-text-color)'
                    : iconColor ||
                        (variant === 'primary'
                            ? 'var(--primary-icon-color)'
                            : 'var(--secondary-icon-color)'), name: iconName, className: "ff-button-icon", disabled: disabled }) }));
    return (_jsxs("button", { type: type, ref: ref, className: classNames('ff-button', `ff-button--${size}`, `ff-button--${variant}`, `${className}`, { 'ff-button-choose-file': isChooseFile }, { 'ff-button-choose-file-text': selectedFile }), style: {
            backgroundColor,
            border,
            ...style,
            width: buttonWidth,
            height: buttonHeight,
        }, onClick: onClick, onCopy: onCopy, disabled: disabled, ...props, children: [iconPosition === 'left' && renderIcon(), _jsxs(Typography, { fontSize: fontSize, style: { ...typographyStyle }, fontWeight: "semi-bold", className: classNames(`ff-button-${variant}--text`, {
                    'ff-button-choose-file-text': selectedFile,
                }), children: [isMandatory && _jsx("span", { className: "required-asterisk", children: "*" }), label] }), iconPosition === 'right' && renderIcon(), children] }));
});
export default Button;
//# sourceMappingURL=Button.js.map