/wc-ribbon

This repository contains a collection of web components, initially centered on the GO ribbon, a UI tool to visualize a summary of annotations for gene and gene sets.

Primary LanguageTypeScript

Built With Stencil

Ribbon Web Component

This repository contains multiple web components, each published on NPM for easy integration in 3rd party projects:

GH folder Description NPM package
wc-go-ribbon GO ribbon component benefiting from the components described below @geneontology/wc-go-ribbon
wc-ribbon-strips interactive visual summary with colored cells for association data (e.g. gene <-> number of GO annotations @geneontology/wc-ribbon-strips
wc-ribbon-table table to display association data (e.g. gene <-> GO annotation @geneontology/wc-ribbon-table
wc-go-autocomplete GO Autocomplete Web Component to search for genes and terms @geneontology/wc-go-autocomplete
wc-spinner simple spinner shared across components to display a pending process @geneontology/wc-spinner
wc-light-modal simple modal component able to display HTML content and controllable through JS events @geneontology/wc-light-modal

An integrated simple to use Web Component dedicated to GO data and benefit from all these parts is available in the folder wc-go-ribbon.

Examples of web integration of the GO ribbon are also provided in the web/ folder:

  • basic example : the simplest way to integrate the GO ribbon anywhere
  • advanced example : advanced example to integrate the GO ribbon, giving access to various events and how to link the wc-ribbon-strips and wc-ribbon-table with Javascript