"use client";
import { Elements } from "../../../components";
import Style from "./Button.styled";
export default function Button(props) {
    const title = props?.title || "";
    const type = props?.type;
    const color = props?.color || "black";
    const fit = props?.fit || false;
    const scale = props?.scale || 1;
    const hide = props?.hide || false;
    const disabled = props?.disabled || false;
    const align = props?.align;
    const Icons = (icon) => {
        return typeof icon === "string" ? (<Elements.Icon icon={icon} scale={scale}/>) : typeof icon === "object" ? (<Elements.Icon {...icon} scale={scale}/>) : (<></>);
    };
    function handleClick(e) {
        if (disabled)
            return;
        if (typeof props?.onClick === "function")
            props?.onClick(e);
    }
    function handleClickLonger(e) {
        if (disabled)
            return;
        if (typeof props?.onClickLonger === "function")
            props?.onClickLonger(e);
    }
    const handleBlur = (e) => {
        if (props?.disabled)
            return;
        if (typeof props?.onBlur === "function")
            props?.onBlur(e);
    };
    return (<Style style={props?.style} title={title} $type={type} $align={align} $color={color} $scale={scale} $fit={fit} $hide={hide} onClick={(e) => handleClick(e)} onMouseDown={(e) => handleClickLonger(e)} onTouchStart={(e) => handleClickLonger(e)} onBlur={(e) => handleBlur(e)} $disabled={disabled}>
            <div>
                {props?.icon && typeof props?.children === "undefined" ? (Icons(props?.icon)) : (<>
                        {Icons(props?.iconLeft)}
                        <span>{props?.children}</span>
                        {Icons(props?.iconRight)}
                    </>)}
            </div>
        </Style>);
}
//# sourceMappingURL=Button.jsx.map