near-react-nft-gallery

A React component for displaying NFT galleries from NEAR Protocol smart contracts.

Installation

npm install near-react-nft-gallery

Usage

import { NearReactNftGallery } from 'near-react-nft-gallery'

function App() { return ( ) }

With all props

import { NearReactNftGallery } from 'near-react-nft-gallery'

function App() { const handleTokenClick = (token) => { console.log('Clicked token:', token.token_id) }

return ( <NearReactNftGallery contractId="example.mintbase1.near" limit={20} columns={3} className="my-gallery" style={{ padding: '16px' }} cardStyle={{ borderRadius: '8px' }} onTokenClick={handleTokenClick} /> ) }

Props

| Prop | Type | Required | Description | |------|------|----------|-------------| | contractId | string | ✅ | NEAR NFT contract ID | | limit | number | No | Max number of tokens to fetch | | columns | number | No | Number of grid columns | | className | string | No | CSS class for the wrapper | | style | React.CSSProperties | No | Inline style for the wrapper | | cardStyle | React.CSSProperties | No | Inline style for each card | | onTokenClick | (token: NftToken) => void | No | Callback when a token card is clicked |

Token Shape

interface NftToken { token_id: string metadata?: { title?: string; description?: string; media?: string } owner_id?: string }

License

MIT