GOV.WALES Development React component library

WARNING: This component library is in development and is subject to change. It is not intended for public usage at this time.

About

GOV.WALES frontend contains the code you need to start building and integrating GOV.WALES user interface components for government platforms and services.

Contact the team

GOV.WALES Frontend is maintained by a team at Welsh Government Corporate Digital Team. If you want to know more about GOV.WALES Frontend, please email the Corporate Digital Team.

Quick start

1. Install with npm (recommended)

npm install @govwales/dev-component-library

2. Importing GOV.WALES react components into your project

Follow the GOV.WALES component library guidance on how to use import components properties and mark-up.

import { ComponentName } from '@govwales/dev-component-library';

3. Importing SCSS or CSS into your project

You can import the GOV.WALES global styles into your project using SCSS or CSS.

Your project will require a SCSS complier such as 'Dart-sass'. To import dart sass:

npm -i --save-dev sass

To import global SCSS add the below to your app react file:

@import '@govwales/dev-component-library/dist/scss/_govwales-global.scss';

To import component SCSS only add the below to app react file:

@import '@govwales/dev-component-library/dist/scss/_govwales-components.scss';

To import global SCSS and components add the below to app react file:

@import '@govwales/dev-component-library/dist/scss/govwales-styles.scss';

To import global CSS add the below to app react file:

@import '@govwales/dev-component-library/dist/css/govwales-styles.css';