JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 130563
  • Score
    100M100P100Q200102F
  • License BSD-2-Clause

GitHub Buttons

Package Exports

  • github-buttons

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (github-buttons) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

github-buttons

CircleCI Codecov

Usage

Use as a Snippet

Get started quickly with github:button configurator.

The source code for the configurator is available at ntkme/github-buttons-app.

Use as a Module

import { render } from 'github-buttons'

// export function render(anchor: HTMLAnchorElement, callback: (el: HTMLElement) => void): void;
render(anchor, function (el) {
  anchor.parentNode.replaceChild(el, anchor)
})

// export function render(options: object, callback: (el: HTMLElement) => void): void;
render(options, function (el) {
  document.body.appendChild(el) 
})

Use as a Component

Options

These options are the same for all the use cases described above:

Attribute Description
href GitHub link for the button.
title title attribute for the button's rendered element.
data-icon octicon-mark-github by default. A subset of Octicons is bundled.
data-size None by default or large.
data-show-count false by default or true. The dynamic count is generated based on detected button type.
data-text Text displayed on the button. It defaults to the text content within the link.
aria-label Aira label for the button link.
Built-in Button Types

Button type is detected from href.

  • https://github.com/:user (follow)
  • https://github.com/:user/:repo (star)
  • https://github.com/:user/:repo/subscription (watch)
  • https://github.com/:user/:repo/fork (fork)
  • https://github.com/:user/:repo/issues (issues)
  • https://github.com/:user/:repo/issues/new (issues)

Tailing slash, query string, and hash in the href won't affect type detection.

  • https://github.com/:user/ (follow)
  • https://github.com/:user?tab=repositories (follow)
  • https://github.com/:user/:repo#readme (star)
  • https://github.com/:user/:repo/#readme (star)

Development

Clone

git clone https://github.com/ntkme/github-buttons.git
cd github-buttons && npm install

Build

npm run build

Test

npm test

See also

License

See LICENSE.