npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

@genesys-pgr/ui-embedded

v1.7.5

Published

Genesys is an openly accessible database on **plant genetic resources** maintained in **genebanks** around the world. This package allows for embedding data from [Genesys](https://www.genesys-pgr.org) into your website.

Downloads

362

Readme

Enhance your website with data from Genesys

Genesys is an openly accessible database on plant genetic resources maintained in genebanks around the world. This package allows for embedding data from Genesys into your website.

Instead of hosting and maintaining a separate database, web server and domain name, use Embedded Genesys to integrate your genebank collection data directly into the institutional website!

Explore the demo at https://genesys-pgr.p.gitlab.croptrust.org/ui-embedded/

Quickstart

Use the Configuration Wizard to generate the Javascript code to embed in your website!

Note: Please see available configuration options in the Configuration options section below.

Note: Any website that uses the Genesys API must be registered. Please contact [email protected] to obtain API keys for use in your environment.

Configuration options

The genesysConfig argument to showGenesysUI() is a simple map of various settings you can pass to @geneesys-pgr/ui-embedded:

|Property|Default|Description| |---|---|---| |apiUrl | https://api.sandbox.genesys-pgr.org | Production Genesys API is at https://api.genesys-pgr.orgSandbox API is at https://api.sandbox.genesys-pgr.org | |clientId | Required | Please contact [email protected] to obtain API keys for use in your environment.The API keys are limited to your website and will not work on a different domain. | |clientSecret | Required | Ditto. | |filter |undefined | Allows for narrowing the scope of requested accession data from Genesys API. To filter for accessions from your genebank, use: { institute: { code: ['XXX000'] } } with the FAO WIEWS Code of your genebank. Default undefined value will return all accessions. | |language|'en'| Specify the language of the user interface.Fully supported: English 'en', French 'fr', Chinese (Taiwanese) 'zh-tw'.Partially supported: Spanish 'es'.For other languages provide custom i18, see Customizing translations. | | i18n | { ... } | See Customizing translations | |title| Genesys: | HTML page title prefix | | accession | { ... } | See Accession configuration options | | shoppingCart | { ... } | See Shopping cart configuration options | | map | { ... } | See Map configuration |

Additional configuration options are described below.

Accession options

Features can be toggled by setting corresponding property on (set to true) or off (false):

|Property|Default|Description| |---|---|---| |subsets|true| Display the list of subsets on accession details page | |datasets|true| Display the list of C&E datasets on accession details page | |traitData|true| Display trait observations on accession details page | |pdci|true| Display passport data completeness index (PDCI) information on accession details page | |filters|{...}|Allows for disabling individual filters on the Accession list page| |overviews|{ ... }| Allows for disabling individual sections in the display of Overviews |

Disabling individual Accession filters

By default all available filters are enabled. This option allows you to disable the filters you do not want to display when users search for accessions by setting that filter to false in the configuration.

|Filter|Enabled|Description| |--|--|--| |fullText|true|Full text search| |countryOfOrigin|true|Provenance of material| |genus|true|Genus| |species|true|Specific epithet| |sampStat|true|Biological status of accession| |accessionNumbers|true|Filter by list of accession numbers| |historic|true|Include historical material| |available|true|Only material I can request| |images|true|Accessions with images|

To disable the Image and Country of Provenance filters you would use

const genesysConfig = {
    ..., // other configuration options
    accession: {
      ... // other accession options
      filters: {
        'images': false, // Don't display the image filter
        'countryOfOrigin': false, // Don't display the Country of Provenance filter
        // all other filters remain enabled
      },
    },
    ... // other configuration
}

Disabling individual Overview sections

The Overviews sections display the number of accessions by different categories. The following categories are available and enabled by default:

|Overview|Enabled|Description| |--|--|--| |institute.code| false | Number of accessions by FAO Institute Code of the holding genebank |institute.country.code3| false | Number of accessions by the country of the holding genebank |cropName| true | Crop name as submitted to Genesys |crop.shortName| true | Genesys crop |sampStat| true | Biological status of accession |taxonomy.genus| true | Genus name |taxonomy.genusSpecies| true | Species name |taxonomy.grinTaxonomySpecies.name| true | Species name according to GRIN-Taxonomy (auto-detected by Genesys) |taxonomy.currentTaxonomySpecies.name| true | The current species name according to GRIN-Taxonomy |countryOfOrigin.code3| true | Country of origin |donorCode| true | FAO WIEWS Institute code of the accession donor institute |mlsStatus| true | Accession status in the Multi-lateral System of the ITPGRFA |available| true | Accession availability |duplSite| true | FAO WIEWS Institute code where accessions are safety-duplicated |storage| true | Type of germplasm storage |breederCode| true | FAO WIEWS Insitute code of the institute that bred the material |aegis| false | Status of accession in European AEGIS network |sgsv| true | Accessions safety-backed up in Svalbard Global Seed Vault

To disable the AEGIS and Institute code sections in the Overviews, the update your config to include:

const genesysConfig = {
    ..., // other configuration options
    accession: {
      ... // other accession options
      overviews: {
        'aegis': false, // Don't display the AEGIS Overview
        'institute.code': false, // Exclude summary by FAO Institude Code
      },
    },
    ... // other configuration
}

Shopping cart and captcha options

The shopping cart is disabled by default.

To allow users to add accessions to the cart, access the cart and submit requests for material you must explicity enable the shopping cart and specify the captcha site key in your configuration:

const genesysConfig = {
  captchaSiteKey: '<public key for your site>', // Your hCaptcha site key from https://dashboard.hcaptcha.com
  shoppingCart: {
    enabled: true, // Enable shopping cart
  },
};

|Property|Default|Description| |---|---|---| |enabled|false| Toggle Shopping cart functionality |

Note: The request for material form includes an hCaptcha check. Valid public and private keys for your hCaptcha account must be registered with Genesys. Please contact [email protected] for support.

When captchaSiteKey is missing, the Shopping cart functionality is automatically disabled.

Map configuration

The map is disabled by default. To allow users to see map of accession collecting site on accession details page and access the map page you must explicity enable it in your configuration and provide a tile server URL and an attribution data for the base map layer:

|Property|Default|Description| |---|---|---| |enabled|false| Toggle map functionality | |height|'400px'| Height of the map of accessions (use a CSS expression) | |baseMap|{ url: ..., attribution: ... }| See url and attribution below. | |baseMap.url|World_Light_Gray_Base| Tile server template URL for the base map layer. | |baseMap.attribution|Tiles © ...| Map base layer attribution |

Translating Embedded Genesys

Embedded Genesys is developed in English. The en/translations.json lists all labels currently in use by the library. The library is translated by friends in our community members to other languages, listed in src/locales.

Help us make Embedded Genesys available in your language or improve the current translations at https://www.transifex.com/crop-trust/embedded-genesys/content/

We welcome your contributions!

Customizing translations

It is possible that the translations bundled with the library do not match your needs, or that you wish to use a language that is not bundled with the library.

You can customize translations by listing them in the i18n property of the genesysConfig:

const genesysConfig = {
  i18n: {
    'es': { // customizations for Spanish labels
      translations: { // 'translations' is mandatory
        "pagetitle": {
          "accessionList": "Accesiones" // customize the translation of 'pagetitle.accessionList'
        }
      }
    },
    'zh-tw': { // customizations for Chinese Taiwanese
      translations: { // 'translations' is mandatory
        "pagetitle": {
          "accessionList": "..." // customize the translation of 'pagetitle.accessionList'
        }
      }
    },
}

Note: the complete list of labels is available in en/translations.json.

Customizing crop names

The Genesys API does not provide translations of crop names, they are generally provided only in English language.

You should provide translations for crop names from English to your language. This can be achieved with adding crop name translations to the i18n section:

const genesysConfig = {
  i18n: {
    'en': { // English
      translations: {
        crop: {
          'lemon': 'Lemon', // Use capitalized "Lemon"
          'limon': 'Lemon' // Use "Lemon" for "limon"
        }
      }
    },
    'es': { // Spanish
      translations: {
        crop: {
          'lemon': 'Limón', // The lemon
          'cassava': 'Yuca',
          'beans': 'Frijol',
          'forages': 'Forrajes',
          'banana': 'Plátano',
        }
      }
    },
    'zh-tw': {
      translations: {
        crop: {
          'mungbean': '綠豆'
        }
      }
    },
  }
}

Debugging

Use the Developer Tools > Console to spot syntax errors or issues with the connection to Genesys PGR.

Add debug: true to your genesysConfig to enable debug-level logging.

License and Disclaimer

This software is licensed under the Apache License, Version 2.0 (the "License").

You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.