@pushchain/ui-kit
Version:
Push Chain is a true universal L1 that is 100% EVM compatible. It allows developers to deploy once and make their apps instantly compatible with users from all other L1s (Ethereum, Solana, etc) with zero on-chain code change.
38 lines • 2.57 kB
JavaScript
;
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, customComponent, className, style, }) => {
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)(ButtonContainer, { onClick: handleConnectWalletButton, children: customComponent ? customComponent : ((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)", disabled: isConnectButtonDisbaled || isLoading, style: style, className: className, 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 ButtonContainer = styled_components_1.default.div `
cursor: inherit;
`;
const SpinnerContainer = styled_components_1.default.div `
padding: 0px 4px;
`;
//# sourceMappingURL=ConnectWalletButton.js.map