Skip to main content

​
Overview

Inject Moongate Wallet is a Solana wallet adapter that provides seamless authentication and wallet functionality through various social login methods. It integrates with the Solana Wallet Standard and supports multiple authentication providers including Google, Apple, Twitter, and Ethereum. Moongate Wallet Connection Interface

​
Installation

​
Prerequisites

  • Node.js 16+
  • React 18+
  • Solana Web3.js
  • Solana Wallet Adapter packages

​
Install Dependencies

# Install Inject Moongate Wallet
npm install @moongate/moongate-adapter

# Install required Solana wallet adapter packages
npm install @solana/wallet-adapter-base @solana/wallet-adapter-react @solana/wallet-adapter-react-ui @solana/web3.js

​
Package Dependencies

Inject Moongate Wallet requires the following peer dependencies: 
{
  "@moongate/solana-wallet-sdk": "^3.3.4",
  "@solana/wallet-standard-features": "^1.2.0",
  "@solana/wallet-standard-chains": "^1.1.0",
  "@solana/wallet-standard-util": "^1.1.1",
  "@wallet-standard/app": "^1.0.1",
  "@wallet-standard/base": "^1.0.1",
  "@wallet-standard/wallet": "^1.0.1",
  "@wallet-standard/features": "^1.0.1",
  "bs58": "^6.0.0",
  "@solana/web3.js": "^1.91.8"
}

​
Wallet Registration

​
Basic Registration

import { registerMoonGateWallet } from '@moongate/moongate-adapter';

// Register with Google authentication
registerMoonGateWallet({
  authMode: 'Google',
  environment: 'production',
});

// Register with Apple authentication
registerMoonGateWallet({
  authMode: 'Apple',
  environment: 'production',
});

// Register with Ethereum authentication
registerMoonGateWallet({
  authMode: 'Ethereum',
  environment: 'production',
});
registerMoonGateWallet({
  authMode: 'Twitter',
  environment: 'production',
});

​
Configuration Options

ParameterTypeDefaultDescription
authModestring'Google'Authentication provider (‘Google’, ‘Apple’, ‘Ethereum’, ‘Twitter’)
logoDataUristring'Default'Custom logo data URI for the wallet
positionstring'top-right'Modal position (‘top-right’, ‘top-left’, ‘bottom-right’, ‘bottom-left’)
buttonLogoUristring'https://i.ibb.co/NjxF2zw/Image-3.png'Button logo URI
environmentstring'production'Environment (‘production’, ‘staging’, ‘development’)
displayStatestringundefinedDisplay state (‘fullscreen’, ‘minimized’, ‘hidden’)

​
Example Configuration

registerMoonGateWallet({
  authMode: 'Google',
  logoDataUri: 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTcxIiBoZWlnaHQ9IjE3MyI...',
  position: 'top-right',
  buttonLogoUri: 'https://your-custom-logo.com/logo.png',
  environment: 'staging',
  displayState: 'fullscreen',
});

​
🆘 Need Help?

⌘I