A complete, interactive data structure that includes all necessary information to display and interact with a Blink.
A Blink
contains the complete, interactive data structure. It includes all necessary information to display and interact with a Blink
, including its current state, possible actions, and related data.
This section covers adding Blinks directly to your React dApp using our Blinks React SDK. The SDK is open-source and can be found on our Github.
To simplify the integration, the following hooks are exported from @dialectlabs/blinks/react
useBlink
- This is the overall hook, it fetches the BlinkInstance
, initializes a security registry, and refreshes it every 10 minutes.useBlinksRegistryInterval
- This fetches the security registry and refreshes it.useBlinkSolanaWalletAdapter
- This sets up an adapter for Blink
using a wallet provider.If you want to build your own hooks, use Blink
, BlinksRegistry
, and BlinkConfig/BlinkAdapter
classes and interfaces.
If you are using the useBlinkSolanaWalletAdapter
hook, then be sure to have<WalletProvider />
and<WalletModalProvider />
above in the component tree.
Here’s a basic setup:
The URLs in blinkApiUrl
must be direct Blink provider URLs and not interstitials or website urls with actions.json
This section covers adding blinks directly to your React Native dApp through our React Native SDK for Blinks. The SDK is completely open-source and can be found on our GitHub.
The following imports are needed to simplify the Blink integration:
useBlink
hook and BlinkAdapter
type from @dialectlabs/blinks
Blink
component from @dialectlabs/blinks-react-native
A getWalletAdapter
function has to be defined to generate an BlinkAdapter
for interactions with user wallets, like wallet connect and signing transactions through the React Native dApp.
After that, the <Blink />
component can be used in the React Native dApp to render the Blink. It takes the following props:
theme
- has the styling for the blink to be rendered;blink
- object returned from useBlink
function (which requires the adapter from getWalletAdapter
and Blink Provider URL);websiteUrl
- the complete URL of the Blink;websiteText
- the domain name of the Blink URL;