@pushchain/ui-kit/src/lib/components/PushUniversalAccountButton/ConnectWalletButton.js

## Overview

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ConnectWalletButton = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
const usePushWallet_1 = require("../../hooks/usePushWallet");
const common_1 = require("../common");
const constants_1 = require("../../constants");
const ConnectWalletButton = ({ uid, connectButtonText, loadingComponent, }) => {
    const { connectionStatus, handleConnectToPushWallet } = (0, usePushWallet_1.usePushWalletContext)(uid);
    const isConnectButtonDisbaled = connectionStatus === constants_1.PushUI.CONSTANTS.CONNECTION.STATUS.CONNECTED ||
        connectionStatus === constants_1.PushUI.CONSTANTS.CONNECTION.STATUS.AUTHENTICATING ||
        connectionStatus === constants_1.PushUI.CONSTANTS.CONNECTION.STATUS.CONNECTING;
    const isLoading = connectionStatus === constants_1.PushUI.CONSTANTS.CONNECTION.STATUS.CONNECTING ||
        connectionStatus === constants_1.PushUI.CONSTANTS.CONNECTION.STATUS.AUTHENTICATING;
    const capitalize = (word) => {
        if (!word)
            return '';
        return word.charAt(0).toUpperCase() + word.slice(1);
    };
    const handleConnectWalletButton = () => handleConnectToPushWallet();
    return ((0, jsx_runtime_1.jsx)(common_1.Button, { bgColor: "var(--pwauth-btn-connect-bg-color)", textColor: "var(--pwauth-btn-connect-text-color)", borderRadius: "var(--pwauth-btn-connect-border-radius)", onClick: handleConnectWalletButton, disabled: isConnectButtonDisbaled || isLoading, children: connectionStatus === constants_1.PushUI.CONSTANTS.CONNECTION.STATUS.NOT_CONNECTED
            ? connectButtonText
            : isLoading
                ? loadingComponent
                    ? loadingComponent
                    : (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [capitalize(connectionStatus), (0, jsx_runtime_1.jsx)(SpinnerContainer, { children: (0, jsx_runtime_1.jsx)(common_1.Spinner, {}) })] })
                : capitalize(connectionStatus) }));
};
exports.ConnectWalletButton = ConnectWalletButton;
const SpinnerContainer = styled_components_1.default.div `
  padding: 0px 4px;
`;
//# sourceMappingURL=ConnectWalletButton.js.map