protvista-uniprot

A Web Component which uses Nightingale components to display protein sequence information.

Compatibility

• protvista-uniprot v3 is compatible with nightingale v5
• protvista-uniprot v2 is compatible with nightingale v3

Usage

Use within an HTML file

Create an es-module import within a static HTML file:

<script type="module" src="./protvista-uniprot.mjs"></script>

and then the component can be displayed with:

<protvista-uniprot accession="P05067"></protvista-uniprot>

Importing as a module

import ProtvistaUniprot from 'protvista-uniprot';
...
window.customElements.define('protvista-uniprot', ProtvistaUniprot);

You can then use it like this:

<protvista-uniprot accession="P05067" />

API

• accession: String
• config?: Array see below
• nostructure?: Boolean(false)

Development

Run yarn install to install dependencies and yarn start to start the local server.

Configuration

You can pass your own configuration to the component using the config attribute/property.

{
  "categories": [
    {
      "name": string,
      "label": string,
      "trackType": nightingale-track|nightingale-linegraph-track|nightingale-variation,
      "adapter": feature-adapter|structure-adapter|proteomics-adapter|variation-adapter,
      "url": string,
      "tracks": [
        {
          "name": string,
          "label": string,
          "filter": string,
          "trackType": "nightingale-track|nightingale-linegraph-track|nightingale-variation",
          "tooltip": string
        }
      ]
    }
  ]
}

Events

Custom protvista-event are emitted:

• when at least one of the track returns data

detail: {
    hasData: true
}