Comment on page

Cypher On-Boarding SDK

Cypher On-Boarding SDK was created to solve the Cold Start Problem in dApp User Onboarding where users have to rely on 3rd party sources for on-ramp, bridging and go through a steep learning curve.

Immediately after the user connects the wallet, Cypher On-Boarding SDK with just a line of code intelligently understands the context of the user on multiple-chains and suggests different options in which they can bridge or on-ramp the necessary token before using the dApp. 
​
​
​
Example Code Snippet
<script src="https://public.cypherd.io/sdk/cypher-sdk.js"></script>
// For Testnet
​
window.Cypher({ 
  address: '0xdEc1bc71bf91431D60eF2742f412DCd1c5A204B8',
  targetChainIdHex: '0x5', // Eth - Goerli
  requiredTokenBalance: 65,
  isTestnet: true,
  theme:'light',
  callBack: () => { console.log('callBack called'); }
});
​
​
// For Mainnet 
​
window.Cypher({
  appId: '<<app id for your account>>' 
  address: '0xdEc1bc71bf91431D60eF2742f412DCd1c5A204B8',
  targetChainIdHex: '0x1', // Ethereum
  requiredTokenBalance: 0.1,
  callBack: () => { console.log('callBack called'); }
});
​
Args
Value
Description
appId
STRING : UUID
Optional (but required for production development) to unlock partner benefits. 

Reachout to us on support(at)cypherwallet(dot)io get the key
*address
STRING
User wallet address
*targetChainIdHex
STRING
Chain ID in hex
*requiredTokenBalance
Number
Token value
requiredTokenContractAddress
STRING: Optional
Native Currency by default or ERC-20 contract address
isTestnet
Boolean: Optional
Default: False, When enabled only testnets will be included. 
callBack (boolean)
Function: Optional
Callback function will be triggered at the end of the onboarding workflow with boolean value
theme
Enum : 'light' | 'dark'
UI theme. Dark mode by default
connector
walletconnect's connector instance
applicable only for walletconnect 
provider
walletconnect's provider instance
applicable only for walletconnect 
showInfoScreen
Boolean
Defaults to false.

To show users an intro page to set context on this operation. 
parentComponentId
STRING: Optional
Default: '' ( empty string )

ONLY NEEDED IN CASE OF WIDGET.
Add the above snippet of <script> tag to import the necessary SDK into your dApp's <head> tag. Then as soon as the user Connects wallet and the dApp has access to the user's wallet address listen to the necessary event and trigger the window.Cypher() with the user's wallet address and the necessary token required to use the dApp. 
There are two ways to integrate the SDK into your dApp. You can choose the mode based on your preference and use case:
1.Pop-up Modal: 
The SDK will be added as a pop-up modal that will only be triggered if the user has a balance in the requiredToken less than the requiredTokenBalance. This mode allows for a more dynamic and on-demand interaction with the SDK.
2.Widget: 
The SDK will be added as a widget that is always present inside a designated <div> tag of your dApp. In this mode, the SDK will be permanently visible and accessible to users, regardless of their token balance. This mode provides a consistent and readily available user experience, allowing users to interact with the SDK at any time.
POP-UP MODE:
In this mode, the On-Boarding SDK appears only if the user does not have the necessary token to use the dApp. 
If the user does not have the necessary token to use the dApp, a modal similar to the one shown below will appear, displaying a list of tokens that the user has on other chains and providing various options for converting that token to the necessary token in the target chain that the dApp supports.
Cypher On-Boarding SDK as pop-up modal
WIDGET MODE:
In this mode, the On-Boarding SDK will be always present inside the designated <div> tag of your dApp. Pass the id of the <div> in which you want to embed the widget as value to the parentComponentId parameter in the window.Cypher() call. The to chain and to token will be locked to the chain and token contract address that you provide. The from chain and from token can be chosen from a list of tokens in which the user has balance.
Cypher On-Boarding SDK as widget
DEMO
The SDK automatically detects the window.etherum object for injected web3 and generates a transaction and routes it to the connected wallet. The routing is currently being powered by Cypher's proprietary bridge technology that sources liquidity through DEXs on different chains. Will add more options in the future. Cypher's bridge technology has been powering the Cypher Wallet Users for the last 1 year to seamlessly bridge across multiple EVM and Cosmos chains (coming soon). Support for other bridges, DEX, Exchanges and On-Ramp Providers coming soon. https://cypherwallet.io​
ChainId List
0x1 - Ethereum
0x89 - Polygon
0x38 - Binance Smart Chain
0xa86a - Avalanche C-Chain
0xfa - Fantom
0x2329 - EVMOS
0xa4b1 - Arbitrum
0xa - Optimism
0x5 - Ethereum Goerli (Testnet)
0x13881 - Polygon Mumbai (Testnet)
​

Args	Value	Description
appId	STRING : UUID	Optional (but required for production development) to unlock partner benefits. Reachout to us on support(at)cypherwallet(dot)io get the key
*address	STRING	User wallet address
*targetChainIdHex	STRING	Chain ID in hex
*requiredTokenBalance	Number	Token value
requiredTokenContractAddress	STRING: Optional	Native Currency by default or ERC-20 contract address
isTestnet	Boolean: Optional	Default: False, When enabled only testnets will be included.
callBack (boolean)	Function: Optional	Callback function will be triggered at the end of the onboarding workflow with boolean value
theme	Enum : 'light' \| 'dark'	UI theme. Dark mode by default
connector	walletconnect's connector instance	applicable only for walletconnect
provider	walletconnect's provider instance	applicable only for walletconnect
showInfoScreen	Boolean	Defaults to `false.` To show users an intro page to set context on this operation.
parentComponentId	STRING: Optional	Default: '' ( empty string ) ONLY NEEDED IN CASE OF WIDGET.

Cypher Push Notification SDK

Last modified 4mo ago