@solana-mobile/seeker-connect-ui

The Seeker-Connect-owned UI for Seeker Connect: a connect button, a progress overlay, and an error dialog, implemented as Lit custom elements in Shadow DOM. No host-page styling is required or affected.

@solana-mobile/seeker-connect-wallet-standard already uses this package's presenter by default, so most dapps get this UI without depending on it directly. Install it explicitly only to render the connect button or to customize the presenter.

Install

npm install @solana-mobile/seeker-connect-ui

Usage

Register the custom elements, then use them in markup:

import { defineSeekerConnectElements } from '@solana-mobile/seeker-connect-ui';

defineSeekerConnectElements(); // registers <seeker-connect-button> and friends

<seeker-connect-button theme="dark"></seeker-connect-button>

To supply a themed presenter to the Wallet Standard package:

import { registerSeekerConnect } from '@solana-mobile/seeker-connect-wallet-standard';
import { createSeekerConnectPresenter } from '@solana-mobile/seeker-connect-ui';

registerSeekerConnect({
	identity: { name: 'My Dapp', uri: window.location.origin },
	relayDomain: '<relay-domain>',
	presenter: createSeekerConnectPresenter({ theme: 'dark' }),
});

The elements are seeker-connect-button, seeker-connect-progress, and seeker-connect-error-dialog. The package also re-exports the brand mark vector paths (S_MARK_PATH, S_MARK_ARC_PATH, FOOTER_WORDMARK_PATHS).

Docs

• API reference
• Live example dapp
• Repository
• Web integration guide

Licensed under Apache-2.0.