Directory

← Back

github-repository

GitHub Repository Web Component

Author

Rating

Not enough ratings

Popularity

<100

<github-repository>

Version Status macOS Build Status Linux Build Status Windows Build Status Dependency Status

Install

Polyfill tags if you need them. This will include ShadowDOM and Custom Elements support.

<script src="https://unpkg.com/@webcomponents/webcomponentsjs@latest/bundles/webcomponents-sd-ce.js"></script>

Loading this component. It would be a good idea to use a specific version instead of latest.

<script src="https://unpkg.com/github-repository@latest/dist/github-repository.min.js"></script>

Example

Live demo

Usage

Set the owner-repo attribute to the username/repository of a GitHub repository.

<github-repository owner-repo="angular/angular"></github-repository>

Example

For more advanced usage you can include:

  • <img slot="images" /> to include a preview image
  • A number of <a slot="badges"><img /></a> to include status badges
<github-repository owner-repo="abraham/twitter-status">
  <img slot="images" src="https://raw.githubusercontent.com/abraham/twitter-status/master/images/simple.png" alt="Twitter Status embed preview" />

  <a slot="badges" href="https://npmjs.com/package/twitter-status" target="_blank">
    <img src="https://img.shields.io/npm/v/twitter-status.svg?style=flat&label=version&colorB=4bc524" alt="Version Status" />
  </a>
  <a slot="badges" href="https://circleci.com/gh/abraham/twitter-status" target="_blank">
    <img src="https://img.shields.io/circleci/project/github/abraham/twitter-status.svg?style=flat&label=macos" alt="macOS Build Status" />
  </a>
  <a slot="badges" href="https://travis-ci.org/abraham/twitter-status" target="_blank">
    <img src="https://img.shields.io/travis/abraham/twitter-status.svg?style=flat&label=linux" alt="Linux Build Status" />
  </a>
  <a slot="badges" href="https://ci.appveyor.com/project/abraham/twitter-status" target="_blank">
    <img src="https://img.shields.io/appveyor/ci/abraham/twitter-status.svg?style=flat&label=windows" alt="Windows Build Status" />
  </a>
</github-repository>

Example with image and badges

GitHub API Rate limit

This Web Component makes unauthenticated requests to the GitHub API. Since the GitHub API has a fairly restrictive 60 requests/hour per IP address, API responses are cached in localStorage.

License

GithubRepository is released under an MIT license.

Built, tested, and published with Nutmeg.

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

0.3.0 imported 2018-07-24
0.2.2 imported 2018-07-02
0.2.1 imported 2018-06-20
0.2.0 imported 2018-06-20
0.1.9 imported 2018-03-03
0.1.8 imported 2018-02-22
0.1.7 imported 2018-02-21
0.1.6 imported 2018-02-19
0.1.5 imported 2018-02-04
0.1.4 imported 2018-02-04
0.1.3 imported 2018-02-04
0.1.2 imported 2018-01-30
0.1.1 imported 2018-01-30
0.1.0 imported 2018-01-29
0.0.1 imported 2018-01-28

Dependencies

  • @nutmeg/seed#0.13.0
  • approximate-number#2.0.0
Released
2018-07-24
Maturity
IMPORTED
License
MIT License

Compatibility

Framework
Browser
Browser Independent

github-repository - Vaadin Add-on Directory

GitHub Repository Web Component github-repository - Vaadin Add-on Directory
<github-repository> ==== [![Version Status](https://img.shields.io/npm/v/github-repository.svg?style=flat&label=version&colorB=4bc524)](https://npmjs.com/package/github-repository) [![macOS Build Status](https://img.shields.io/circleci/project/github/abraham/github-repository.svg?style=flat&label=macos)](https://circleci.com/gh/abraham/github-repository) [![Linux Build Status](https://img.shields.io/travis/abraham/github-repository.svg?style=flat&label=linux)](https://travis-ci.org/abraham/github-repository) [![Windows Build Status](https://img.shields.io/appveyor/ci/abraham/github-repository.svg?style=flat&label=windows)](https://ci.appveyor.com/project/abraham/github-repository) [![Dependency Status](https://david-dm.org/abraham/github-repository.svg?style=flat)](https://david-dm.org/abraham/github-repository) Install ---- Polyfill tags if you need them. This will include ShadowDOM and Custom Elements support. ``` ``` Loading this component. It would be a good idea to use a specific version instead of `latest`. ``` ``` Example ---- [Live demo](https://codepen.io/abraham/pen/PQoeqV) Usage ---- Set the `owner-repo` attribute to the `username/repository` of a GitHub repository. ``` ``` ![Example](/images/simple.png) For more advanced usage you can include: - `` to include a preview image - A number of `` to include status badges ``` Twitter Status embed preview Version Status macOS Build Status Linux Build Status Windows Build Status ``` ![Example with image and badges](/images/advanced.png) GitHub API Rate limit ---- This Web Component makes unauthenticated requests to the GitHub API. Since the GitHub API has a fairly restrictive 60 requests/hour per IP address, API responses are cached in `localStorage`. License ---- GithubRepository is released under an MIT license. Built, tested, and published with [Nutmeg](https://nutmeg.tools).
Online