The ARN If Connected component is specifically designed to check the wallet connection status and conditionally display HTML slots based on the connection state. Here's how you can use it:
<arn-if-connected> <div slot="if-false"> You're not wallet-connected. </div> <div slot="if-true"> Hello connected! </div> </arn-if-connected>
<arn-if-connected> component, you can define HTML content within slots. The slots are labeled as "if-false" and "if-true", corresponding to the wallet connection being false or true, respectively. You can include any HTML content within these slots.
The ARN If Connected component simplifies the process of checking the wallet connection status by handling it internally. It automatically detects changes in the connection state and updates the displayed content accordingly.
Note that the ARN If Connected component assumes you have already set up the necessary dependencies and configurations for the ARN Client and other required packages in your application. Make sure to follow the setup instructions provided in the documentation for a seamless integration.
Since 2.3, you can display more detailed status about the ongoing authenticated process:
<arn-connect> <button slot="if-disconnected">Please connect</p> <p slot="if-connecting">Connecting</p> <p slot="if-connected">Wallet is connected. Now please sign.</p> <p slot="if-signing">Signing</p> <button slot="if-authenticated">Click to disconnect</p> </arn-connect>
if-trueis synonym of
if-falseis synonym of any status but authenticated.
Updated about 2 months ago