var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
    return cooked;
};
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx } from "react/jsx-runtime";
import styled from 'styled-components';
import { Box } from '@chakra-ui/react';
var StyledButton = styled(Box)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: ", ";\n  cursor: ", ";\n  justify-content: center;\n  align-items: center;\n  border-radius: 4px;\n  font-size: 14px;\n  padding: 5px 15px;\n"], ["\n  display: ", ";\n  cursor: ", ";\n  justify-content: center;\n  align-items: center;\n  border-radius: 4px;\n  font-size: 14px;\n  padding: 5px 15px;\n"])), function (_a) {
    var inline = _a.inline;
    return (inline ? 'inline-flex' : 'flex');
}, function (_a) {
    var disabled = _a.disabled;
    return (disabled ? 'not-allowed' : 'pointer');
});
export var ColorButton = function (_a) {
    var disabled = _a.disabled, type = _a.type, width = _a.width, height = _a.height, fontSize = _a.fontSize, loading = _a.loading, clickable = _a.clickable, onClick = _a.onClick, fontWeight = _a.fontWeight, children = _a.children, rest = __rest(_a, ["disabled", "type", "width", "height", "fontSize", "loading", "clickable", "onClick", "fontWeight", "children"]);
    var bgStyle = disabled
        ? { background: '#F2F4FA' }
        : type === 'filled'
            ? {
                background: 'linear-gradient(315deg, #FE3876 0%, #7C30DD 71.44%, #3A30DD 100%)',
            }
            : {
                background: 'linear-gradient(#ffffff, #ffffff) padding-box, linear-gradient(to right, #3A30DD, #FE3876) border-box',
                border: '1px solid transparent',
            };
    var textStyle = disabled
        ? { color: '#9D9D9D' }
        : type === 'filled'
            ? { color: '#F5F6FB' }
            : {
                background: 'linear-gradient(315deg, #FE3876 0%, #7C30DD 71.44%, #3A30DD 100%)',
                WebkitBackgroundClip: 'text',
                WebkitTextFillColor: 'transparent',
                backgroundClip: 'text',
            };
    return (_jsx(StyledButton, __assign({ style: __assign({ width: width ? width + 'px' : '', height: height ? height + 'px' : '', fontSize: fontSize ? fontSize + 'px' : '14px', fontWeight: fontSize ? fontWeight : '400' }, bgStyle), onClick: function () {
            if (!(disabled || loading) || clickable) {
                onClick && onClick();
            }
        } }, rest, { children: _jsx("div", __assign({ style: textStyle }, { children: children })) })));
};
var templateObject_1;
