Proton Web SDK
Installation
npm i @protonprotocol/proton-web-sdk
yarn add @protonprotocol/proton-web-sdk
Full Documentation: https://docs.protonchain.com/sdk/proton-web-sdk
Usage
import { ConnectWallet } from '@protonprotocol/proton-web-sdk'
// Constants
const appIdentifier = 'taskly'
// Pop up modal
const link = await ConnectWallet({
linkOptions: {
endpoints: ['https://proton.greymass.com'],
// rpc: rpc /* Optional: if you wish to provide rpc directly instead of endpoints */
},
transportOptions: {
requestAccount: 'myprotonacc', /* Optional: Your proton account */
requestStatus: true, /* Optional: Display request success and error messages, Default true */
},
selectorOptions: {
appName: 'Taskly', /* Optional: Name to show in modal, Default 'app' */
appLogo: 'https://protondemos.com/static/media/taskly-logo.ad0bfb0f.svg', /* Optional: Logo to show in modal */
customStyleOptions: { /* Optional: Custom style options for modal */
modalBackgroundColor: '#F4F7FA',
logoBackgroundColor: 'white',
isLogoRound: true,
optionBackgroundColor: 'white',
optionFontColor: 'black',
primaryFontColor: 'black',
secondaryFontColor: '#6B727F',
linkColor: '#752EEB'
}
// walletType: 'proton' /* Optional: Connect to only specified wallet (e.g. 'proton', 'anchor') */
}
})
//Login
const { link, session } = await ConnectWallet({
linkOptions: { chainId: this.chainId, endpoints: this.endpoints },
transportOptions: { requestAccount: this.requestAccount, backButton: true },
selectorOptions: { appName: this.appName, appLogo: appLogo}
});
this.link = link;
this.session = session;
return { auth: session.auth, accountData: session.accountData[0] };
// Send Transaction
const result = await session.transact({
transaction: {
actions: [{
// Token contract for XUSDT
account: 'xtokens',
// Action name
name: 'transfer',
// Action parameters
data: {
from: session.auth.actor,
to: 'syed',
quantity: '0.000001 XUSDT',
memo: 'Tip!'
},
authorization: [session.auth]
}]
},
broadcast: true
})
console.log('Transaction ID', result.processed.id)
// Restore session after refresh (must recreate link first with restoreSession as true)
const { link, session } = await ConnectWallet({
linkOptions: { chainId: this.chainId, endpoints: this.endpoints, restoreSession: true},
transportOptions: { requestAccount: this.requestAccount },
selectorOptions: { appName: this.appName, appLogo: appLogo}
});
this.link = link;
this.session = session;
// Logout
await link.removeSession(appIdentifier, session.auth)
session = undefined