- CSS 46.9%
- TypeScript 32.3%
- JavaScript 8%
- SCSS 8%
- MDX 4.8%
| Filename | Latest commit message | Latest commit date |
|---|---|---|
21b959ab7bNieuw patroon dat beschrijft hoe een klant na tussentijds opslaan direct terug kan keren naar een openstaand formulier, op basis van bevindingen uit het Tripleforms webanalyse-onderzoek. |
||
| .changeset | ||
| .github | ||
| .husky | ||
| components | ||
| documentation | ||
| packages | ||
| proprietary | ||
| utilities | ||
| .editorconfig | ||
| .eslintignore | ||
| .eslintrc.js.json | ||
| .eslintrc.json | ||
| .eslintrc.mdx.json | ||
| .eslintrc.react.json | ||
| .gitattributes | ||
| .gitignore | ||
| .htmlvalidate.json | ||
| .lintstagedrc.json | ||
| .markdownlint.json | ||
| .markdownlintignore | ||
| .ncurc.major.cjs | ||
| .ncurc.minor.cjs | ||
| .ncurc.patch.cjs | ||
| .npmpackagejsonlintrc.json | ||
| .npmrc | ||
| .nvmrc | ||
| .prettierignore | ||
| .prettierrc.json | ||
| .stylelintignore | ||
| CODE_OF_CONDUCT.md | ||
| CODE_OF_CONDUCT.nl.md | ||
| LICENSE.md | ||
| NOTICE.md | ||
| package.json | ||
| pnpm-lock.yaml | ||
| pnpm-workspace.yaml | ||
| README.md | ||
| stylelint.config.mjs | ||
| tsconfig.json | ||
| vercel.json | ||
RVO Design System
The RVO design system is based on the NL Design System architecture.
For more info about the NL Design System and learn about things happening in our open source community, join the #nl-design-system Slack via praatmee.codefor.nl!
Getting started
Include the Design Token CSS variables:
<link rel="stylesheet" type="text/css" href="https://unpkg.com/@nl-rvo/design-tokens/dist/index.css" />
Combine it with the latest CSS Component classes from the NL Design System community, for example:
<link rel="stylesheet" type="text/css" href="https://unpkg.com/@nl-rvo/component-library-css/dist/index.css" />
Then you can go ahead and use the HTML snippets of the components in this Storybook.
Avoid automatic upgrades to a new version with breaking changes
For all dependencies, see what the version is you use while developing and update the URL without version to include a version number, and ensure your page keeps working even when new versions are released:
For alpha, beta and rc versions:
https://unpkg.com/@nl-rvo/design-tokens/dist/index.css
Above should become:
https://unpkg.com/@nl-rvo/design-tokens@1.0.0-alpha.2/dist/index.css
For stable versions it would become:
https://unpkg.com/@nl-rvo/design-tokens@^1.0.0/dist/index.css
npm packages
| name | version |
|---|---|
| @nl-rvo/component-library-css |  |
| @nl-rvo/design-tokens |  |
Contributing
Install prerequisites
You need to have the following tools installed to run Storybook locally:
- Git
- Node.js and npm
- pnpm
Open a terminal and run the following commands to check:
git --version: a relatively recent version should be installed (Git 2.28 or later)node -v: should be at least the version defined in theenginessection ofpackage.jsonnpm -v: should be at least the version defined in theenginessection ofpackage.jsonpnpm -v: should be at least the version defined in theenginessection ofpackage.json
Install code editor
You can use any editor you'd like, but in case you use Visual Studio Code. We recommend the following extensions that are useful for this project:
Developing locally
- Open Terminal
- Select the directory this repository should be cloned into with
cd <name-of-directory> - Clone this Git repository
cd rvogit checkout masterto switch to the main master branch, if you previously worked in this repository.git pullto get to the latest version of the master branchpnpm installto download and install all the dependencies
Run Docusaurus on your computer
- Open Terminal
- Ensure your current directory is
rvo - Run
pnpm installto ensure the latest and greatest of all dependencies - Run
pnpm run docs - The local version of docusaurus will be running on
localhost:3000/rvo - Press
Control+Cin your terminal to stop Docusaurus
Read the standalone/docusaurus/README.md for docusaurus details
Run Storybook on your computer
- Open Terminal.
- Ensure your current directory is
rvo - Run
pnpm installto ensure the latest and greatest of all dependencies - Run
pnpm run storybookto start Storybook - Your main browser opens automatically with your local storybook on
localhost:6006. - Press
Control+Cin your terminal to stop Storybook.
Debugging Storybook
First check the logs in the terminal if any error is displayed, if something doesn't work as expected.
Secondly check the JavaScript logs in your browsers developer tools if there are errors or warnings.
You can run the code checks with pnpm run lint to see if any code errors can be detected.
You can also check the build logs of the design tokens for errors, if you have changed Style Dictionary JSON files, by building those separately:
cd proprietary/design-tokens/pnpm run build
Code of Conduct
We pledge to act and interact in ways that contribute to an open, welcoming, diverse, inclusive, and healthy community. Read our Code of Conduct if you haven't already.
License
This project is free and open-source software licensed under the European Union Public License (EUPL) v1.2. The documentation is licensed as Creative Commons Zero 1.0 Universal (CC0-1.0).
For information about proprietary assets in this repository, please carefully read the NOTICE file