import * as __WEBPACK_EXTERNAL_MODULE__chakra_ui_react__ from "@chakra-ui/react";
import * as __WEBPACK_EXTERNAL_MODULE__utils_getProviderIcon_mjs__ from "../../utils/getProviderIcon.mjs";
import * as __WEBPACK_EXTERNAL_MODULE__Button_Button_mjs__ from "../Button/Button.mjs";
const disableStyle = {
    backgroundColor: 'gray.100',
    borderColor: 'gray.100',
    color: 'gray.500',
    pointerEvents: 'none'
};
const Auth0Button = ({ provider, children, ...rest })=>/*#__PURE__*/ React.createElement(__WEBPACK_EXTERNAL_MODULE__Button_Button_mjs__["default"], {
        display: "flex",
        justifyContent: "start",
        position: "relative",
        padding: "0px 8px 0px 52px",
        background: "white",
        alignItems: "center",
        width: "100%",
        fontSize: "16px",
        fontFamily: "inherit",
        fontWeight: "400",
        height: "52px",
        border: "1px solid #c9cace",
        borderRadius: "3px",
        color: "#1e212a",
        cursor: "pointer",
        outline: "0",
        _focus: {
            backgroundColor: 'rgba(226,67,41, 0.15)',
            boxShadow: '0 0 0 4px rgba(0,123,173,.15)',
            outline: 'none'
        },
        _hover: {
            boxShadow: 'inset 0 0 0 150px rgba(0,0,0,.1)',
            _disabled: disableStyle
        },
        _disabled: disableStyle,
        _loading: {
            justifyContent: 'center',
            padding: '0px 8px'
        },
        transition: "box-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out",
        type: "submit",
        "data-provider": provider,
        "data-action-button-secondary": "true",
        ...rest
    }, /*#__PURE__*/ React.createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Image, {
        src: (0, __WEBPACK_EXTERNAL_MODULE__utils_getProviderIcon_mjs__["default"])(provider),
        alt: `${provider} logo`,
        "data-provider": provider,
        position: "absolute",
        left: "26px",
        top: "50%",
        height: "20px",
        width: "20px",
        transform: "translateX(-50%) translateY(-50%)"
    }), /*#__PURE__*/ React.createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.chakra.span, {
        textAlign: "left"
    }, children));
/* ESM default export */ const Auth0Button_rslib_entry_ = Auth0Button;
export { Auth0Button_rslib_entry_ as default };
