This package includes Nord Design System web components

Usage no npm install needed!

<script type="module">
  import nordhealthComponents from 'https://cdn.skypack.dev/@nordhealth/components';


Tests Build and deploy

Nord Web Components

The component package found from packages/components is built with Lit, a library for building Web Components. The component source code is written in TypeScript, with stylesheets written in CSS.

The following are the most commonly used commands during development:

  • npm start - Compile components, start watching for changes, start local development server on port 3333.
  • npm run build - Builds the project.
  • npm test - Run all tests once.
  • npm test -- [path/glob for test file] - Run specific tests file.
  • npm run test:watch - Run all tests and watch for changes.
  • INCLUDE_VISUAL_REGRESSION=true npm test - Run all tests and including visual regression.
  • INCLUDE_VISUAL_REGRESSION=true npm test -- --update-visual-baseline - Updates all failing screenshot snapshots. I sure hope you know what you’re doing. ;-)

The local development server started by npm start serves a file located at /packages/components/demo/index.html. Any local changes or new components are available on this page, so this can be used as a testing ground when developing. Component usage examples are available from the dev server using the URL structure http://localhost:3333/[component]/[example]/ e.g. /button/kitchen-sink/. These pages get reloaded on any change.

To create a new component

npm run scaffold [component-name]


npm run scaffold date-picker


See license in LICENSE.md


Copyright © 2021 Nordhealth Ltd