Contributors-table NPM

contributors-table

GitHub contributors table generator

Powers the contributors-table.vercel.app 😎

✨ Features

⚙️ Flexible settings
🔗 Hyperlinks to contributors profiles
💡 Hints when hovering over an avatar
🎨 Customizable
🤝 Images supported by Markdown on GitHub and anywhere!

📦 Installation

npm install contributors-table
# If you are using Bun
bun install contributors-table

🚀 Usage

Basic Usage

import { generateContributorsTable } from 'contributors-table'
import { Octokit } from '@octokit/core'

const octokit = new Octokit()
const contributorsList = await octokit.request(
    'GET /repos/{owner}/{repo}/contributors',
    {
        owner: 'octocat',
        repo: 'Hello-World'
    }
)

const image = generateContributorsTable(contributorsList.data)
// <svg>...</svg>

🏞️ An example of an image

Contributor Table Example

Advanced Usage

Use another image format

// Generate a PNG image
generateContributorsTable(..., { format: 'png' })

Customize the table

generateContributorsTable(..., {
    // The width of the avatars
    width: 60,
    // Gap between avatars
    gap: 10,
    // The number of avatars per row
    columns: 10,
    // Number of rows
    rows: 7,
    // The roundness of the avatars
    roundness: 50,
    // Stroke around avatars
    strokeWith: 0.8,
    // Whether to render avatars on the server side.
    // If false - then the browser itself downloads images from GitHub
    // If true - then the script takes care of downloading avatars and embedding them
    // Always `true` if `format` != `'svg'`
    ssr: true
})

🤝 Contributing

Thank you for considering contributing to contributors-table 😀! Please read the CONTRIBUTING.md file for more information about how to contribute to this project.