This design system serves a variety of audiences, and will be most useful in the Abstract format (a repository for designer files) to Developers/Engineers, and then to Designers. To make it accessible to the DRC as a whole, and to share the importance of a consistent user experience, we have added explanatory text to the majority of pages; demonstrating utility of individual components.
As development becomes shared across the Cores, we recommend each Core's engineers refer to this design system, when creating new feature/functionality which will be highlighted on Sparc.Science.
Our intention is to create an online resource with the code for these components, and to update this quarterly.
The story book is deployed here: NIH SPARC Storybook
- Element UI
- Tabs
yarn add @nih-sparc/sparc-design-system-components
npm install @nih-sparc/sparc-design-system-components
import Vue from 'vue'
import SparcComponentLibrary from 'sparc-test-design-system-components'
Vue.use(SparcComponentLibrary)
yarn install
yarn serve
yarn build-bundle
Utlizes Vue Test Utils and Jest.
It is recommended to have tests live alongside of your component. For one off tests, the ./tests/unit folder can be uses.
Can be manually run with:
yarn test:unit
Automatically run every push with GitHub Actions