Web Components

GlycanAge publishes a web component library called ga-components. It's under the MIT license and available on npm.

Web components are framework agnostic, so they work in any modern browser whatever you've built your app with.

Installing the package

The easiest way to get @glycanage/web-components is through npm:

npm i --save-exact @glycanage/web-components

Every component expects a GaReportService property on the window object, so set that up first.

<script>
	window.GaReportService = {
		getReport: (id) => {
			return ...logic for fetching the report;
		}
	};
</script>

Next, import the component you want:

import '@glycanage/web-components/dist/atherosclerosis.wc';

warning

We're importing atherosclerosis.wc here as an example. Import whichever component you actually want to render.

From there you can drop the component anywhere in your HTML:

<ga-arthritis report="{{id}}" type="{{'header'|'summary'|null}}"></ga-arthritis>