Documentation Index
Fetch the complete documentation index at: https://mintlify.com/Koniverse/SubWallet-Extension/llms.txt
Use this file to discover all available pages before exploring further.
Overview
The @subwallet/extension-inject package defines the interface between SubWallet Extension and web pages (dApps). It provides type definitions and injection functions that enable dApps to interact with the wallet through the window.injectedWeb3 object and EVM providers.
Purpose and Responsibilities
- Window Injection: Injects wallet providers into web pages
- Type Definitions: Defines interfaces for dApp-wallet communication
- Multi-Chain Support: Provides injection for Substrate, EVM, Cardano, and Bitcoin
- EIP-6963: Implements EIP-6963 provider discovery for Ethereum
- Provider Interface: Defines standard interfaces for accounts, signing, and metadata
Key Exports
From src/bundle.ts:
export { packageInfo } from './packageInfo';
// Injection functions
export function injectExtension(
enable: (origin: string, opt?: AuthRequestOption) => Promise<Injected>,
{ name, version }: InjectOptions
): void;
export function injectEvmExtension(evmProvider: EvmProvider): void;
export function injectCardanoExtension(cardanoProvider: CardanoProvider): void;
export function injectBitcoinExtension(bitcoinProvider: BitcoinProvider): void;
export function inject6963EIP(provider: EvmProvider): void;
export const eip6963ProviderInfo: EIP6963ProviderInfo;
Core Functions
injectExtension
Injects the Substrate wallet provider into window.injectedWeb3:
injectExtension(
(origin: string, opt?: AuthRequestOption) => {
// Return Injected interface with accounts, signer, etc.
return Promise.resolve(injected);
},
{ name: 'subwallet-js', version: '1.0.0' }
);
window.injectedWeb3['subwallet-js'] with enable() and version
injectEvmExtension
Injects EVM provider into window.ethereum and window.SubWallet:
injectEvmExtension(evmProvider);
// Creates:
// - window.SubWallet
// - window.ethereum (if not already set)
// Dispatches events:
// - 'subwallet#initialized'
// - 'ethereum#initialized'
// - EIP-6963 announcements
injectCardanoExtension
Injects Cardano provider into window.cardano.subwallet:
injectCardanoExtension(cardanoProvider);
// Creates: window.cardano.subwallet
injectBitcoinExtension
Injects Bitcoin provider into window.SubWalletBitcoin:
injectBitcoinExtension(bitcoinProvider);
// Creates: window.SubWalletBitcoin
inject6963EIP
Implements EIP-6963 provider discovery for Ethereum:
inject6963EIP(evmProvider);
// Listens for 'eip6963:requestProvider' events
// Announces provider with 'eip6963:announceProvider' events
Type Definitions
From src/types.ts:
Core Interfaces
// Account types
export interface InjectedAccount {
address: string;
genesisHash?: string | null;
name?: string;
type?: KeypairType;
}
export interface InjectedAccountWithMeta {
address: string;
meta: {
genesisHash?: string | null;
name?: string;
source: string;
};
type?: KeypairType;
}
// Account access
export interface InjectedAccounts {
get: (anyType?: boolean) => Promise<InjectedAccount[]>;
subscribe: (cb: (accounts: InjectedAccount[]) => void | Promise<void>) => Unsubcall;
}
// Authorization options
export type AuthAccountSubstrateType = 'substrate' | 'both' | 'evm';
export interface AuthRequestOption {
accountAuthType: AuthAccountSubstrateType;
}
// Main injected interface
export interface Injected {
accounts: InjectedAccounts;
metadata?: InjectedMetadata;
provider?: InjectedProvider;
signer: InjectedSigner;
}
// Window provider
export interface InjectedWindowProvider {
enable: (origin: string, opt?: AuthRequestOption) => Promise<Injected>;
version: string;
}
// Augmented window
export interface InjectedWindow extends This {
injectedWeb3: Record<string, InjectedWindowProvider>;
ethereum: EvmProvider;
SubWallet: EvmProvider;
cardano: Record<string, CardanoProvider>;
SubWalletBitcoin: BitcoinProvider;
}
EVM Provider
export interface EvmProvider {
provider?: EvmProvider;
isMetaMask: boolean;
isSubWallet: boolean;
version: string;
isConnected(): boolean;
// ... EIP-1193 methods
}
Cardano Provider
export interface CardanoProvider {
apiVersion: string;
name: string;
icon: string;
enable: () => Promise<unknown>;
supportedExtensions: CardanoExtensionCIP[];
isEnable: () => Promise<boolean>;
}
Bitcoin Provider
export interface BitcoinProvider {
isSubWallet: boolean;
requestAccounts: () => Promise<any[]>;
getAccounts: () => Promise<any[]>;
signPsbt(params: any): Promise<any>;
signMessage(params: any): Promise<any>;
sendTransfer(params: any): Promise<any>;
request: <T>(method: string, params?: any) => Promise<T>;
getProductInfo: () => { name: string; version: string };
}
export interface MetadataDefBase {
chain: string;
genesisHash: string;
icon: string;
ss58Format: number;
chainType?: 'substrate' | 'ethereum';
}
export interface MetadataDef extends MetadataDefBase {
color?: string;
specVersion: number;
tokenDecimals: number;
tokenSymbol: string;
types: Record<string, Record<string, string> | string>;
metaCalls?: string;
userExtensions?: ExtDef;
}
export interface InjectedMetadata {
get: () => Promise<InjectedMetadataKnown[]>;
provide: (definition: MetadataDef) => Promise<boolean>;
}
Provider Types
export interface ProviderMeta {
network: string;
node: 'full' | 'light';
source: string;
transport: string;
}
export type ProviderList = Record<string, ProviderMeta>;
export interface InjectedProvider extends ProviderInterface {
listProviders: () => Promise<ProviderList>;
startProvider: (key: string) => Promise<ProviderMeta>;
}
EIP-6963 Types
export interface EIP6963ProviderInfo {
uuid: string;
name: string;
icon: string;
rdns: string;
}
export interface EIP6963ProviderDetail {
info: EIP6963ProviderInfo;
provider: EvmProvider;
}
Directory Structure
src/
├── bundle.ts # Injection functions and exports
├── types.ts # TypeScript type definitions
├── chrome.ts # Chrome-specific utilities
├── crossenv.ts # Cross-environment utilities
├── index.ts # Package entry point
└── packageInfo.ts # Package metadata
Dependencies
- @polkadot/rpc-provider: RPC provider interfaces
- @polkadot/types: Type system
- @polkadot/util: Utility functions
- @polkadot/util-crypto: Cryptographic utilities
- @polkadot/x-global: Global environment utilities
- @subwallet/keyring: Keyring types
- web3-core: Web3 core types
Dev dependencies:
- @types/chrome: Chrome extension API types
- @types/firefox-webext-browser: Firefox WebExtensions API types
Integration in Architecture
The extension-inject package:
- Content Script: Imported and executed in content scripts
- Window Object: Injects providers into the page’s window object
- dApp Communication: Enables dApps to detect and interact with SubWallet
- Multi-Chain: Supports multiple blockchain ecosystems simultaneously
- Standards Compliance: Implements EIP-6963 and other wallet standards
EIP-6963 Provider Discovery
SubWallet implements EIP-6963 for improved wallet discovery:
export const eip6963ProviderInfo: EIP6963ProviderInfo = {
uuid: '10c67337-9211-48d9-aab0-cecdc4224acc',
name: 'SubWallet',
icon: 'data:image/svg+xml;base64,...',
rdns: 'app.subwallet'
};
- Multiple wallets can coexist
- dApps can discover all available wallets
- No race conditions for
window.ethereum
- Better user experience for wallet selection
Usage Examples
Substrate Injection (Content Script)
import { injectExtension } from '@subwallet/extension-inject';
injectExtension(
(origin: string) => {
// Request authorization from background script
return requestAccess(origin);
},
{
name: 'subwallet-js',
version: '1.0.0'
}
);
EVM Injection
import { injectEvmExtension } from '@subwallet/extension-inject';
const evmProvider = createEvmProvider();
injectEvmExtension(evmProvider);
dApp Usage (External)
// Substrate
const injected = window.injectedWeb3['subwallet-js'];
const extension = await injected.enable('my-dapp');
const accounts = await extension.accounts.get();
// EVM
const accounts = await window.ethereum.request({
method: 'eth_requestAccounts'
});
// EIP-6963
window.addEventListener('eip6963:announceProvider', (event) => {
const { info, provider } = event.detail;
if (info.rdns === 'app.subwallet') {
// Use SubWallet provider
}
});