@uktrade/react-component-library

React Design System

A collection of reusable React components following GOV.UK design patterns.

Table of Contents

• Installation
• Usage
• Development
  • Build
  • Playground

Installation

npm install @uktrade/react-component-library

Peer Dependencies:

• react >= 19
• react-dom >= 19

Usage

Import components from the package:

import { SummaryList, SummaryItem } from "@uktrade/react-component-library";

You can use them directly in your React applications.

Development

Build

git clone https://github.com/uktrade/react-component-library.git
cd react-component-library
nvm use
npm ci
npm run build

Copies TypeScript output and .css files into dist/.

Playground

npm run build
npm run docs:build
npm run docs:start

This opens a Vite dev server with the playground for testing components.

Publishing a new version

To publish a new version to NPM @uktrade/react-component-library:

• Update the version in package.json following semantic versioning (don’t forget to sync the lockfile as well).
• Commit your changes on a feature or working branch.
• Open a pull request and merge it into main.
• Create a new GitHub Release from the main branch and tag it with the same version (for example, v0.10.1).
• Once the release is published, the GitHub Actions workflow will automatically build and publish the package to NPM.