Infinite-nft NPM

infinite-nft

Embed your NFTs anywhere and everywhere

infinite-nft is a react component for embedding a grid containing all of your NFTs. The component just-in-time loads elements of the grid so that whoever is viewing has an 'infinite' scroll experience. Huge shoutout to the OpenSea API for making this library possible.

Install

# Yarn
yarn add infinite-nft

# NPM
npm install --save infinite-nft

Documentation

Props for the InfiniteNFT component

Name	Type	Description
`address`	`string`	Public key of the user whose NFTs you want to display.
`gutter`	`number`	Amount of space between columns of the NFT grid.
`padding`	`number`	Amount of space between rows of the NFT grid.

Example usage

The snippet below shows a basic example of how the InfiniteNFT component can be used. We suggest wrapping it in an absolutely positioned element that takes up 100% of both the height and width of the screen for the best viewing and scrolling experience.

<div
    style={{
        width: '100%',
        height: '100%',
        position: 'absolute',
    }}
>
    <InfiniteNFT
        address={'0x82c1b61da09b5fdce098a212bb8070210ab91049'}
        gutter={170}
    />
</div>

Below is a GIF of the component in action with vitalik.eth

Alt Text

react-virtualized react-window react-window-infinite-loader

@infinitebrahmanuniverse/nolb-infi @everything-registry/sub-chunk-1912 @zalastax/nolb-infi

1.0.1

3 years ago

1.0.0

3 years ago