Address

The Address component displays Ethereum addresses with optional abbreviation and validation.

Usage

import { Address } from '@avalabs/builderkit';
 
// Basic usage
<Address address="0x1234567890123456789012345678901234567890" />
 
// With abbreviation
<Address 
  address="0x1234567890123456789012345678901234567890"
  abbreviate={true}
/>
 
// Using context (inside Identity provider)
<Address abbreviate={true} />

Props

Prop	Type	Default	Description
`address`	`string`	-	The Ethereum address to display (optional if used within Identity context)
`abbreviate`	`boolean`	`false`	Whether to show abbreviated address (e.g., 0x1234...5678)

Features

Validates input address using ethers.isAddress
Supports address abbreviation (0x1234...5678)
Can use address from Identity context if not provided directly
Throws error for invalid addresses

Examples

Basic Display

<Address address="0x1234567890123456789012345678901234567890" />
// Output: 0x1234567890123456789012345678901234567890

Abbreviated Display

<Address 
  address="0x1234567890123456789012345678901234567890"
  abbreviate={true}
/>
// Output: 0x1234...5678

With Identity Context

<Identity address="0x1234567890123456789012345678901234567890">
  <Address abbreviate={true} />
</Identity>

Error Handling

The component will throw an error if:

No address is provided (either via props or context)
The provided address is not a valid Ethereum address

Address

On this page