Headless UI: Chain components

As part of the continuous development on our Headless UI collection, we introduce in this new SDK release the Chain components, for displaying information about a given EVM network.

There are 2 main components in this release: ChainIcon and ChainName, both should be used inside a ChainProvider, just like how it works with TokenProvider and AccountProvider in the previous posts.

Example:

import { ChainProvider, ChainName, ChainIcon } from "thirdweb/react";
import { ethereum } from "thirdweb/chains";

function App() {
  return <ChainProvider chain={ethereum}>
    {/* Display an image for the icon of the network */}
    <ChainIcon client={thirdwebClient} />
    {/* Display the full name of the network */}
    <ChainName />
  </ChainProvider>
}

To learn more about these components, visit here.