Skip to content

utilitywarehouse/design-systems

Repository files navigation

UW Design Systems

Code Checks Release

Shared tools and libraries for building UW applications.

Active Packages

Native UI

A set of React Native components for building UW branded UIs, built in collaboration with the UX design team.

Please have a look at the documentation for how to get started using these components.

Dormant Packages

These packages are now in Maintenance mode, meaning there will be no new features or breaking changes. New releases will only be made to support critical bug fixes or security maintenance updates.

We are currently prioritising work on the new Hearth Design Systems libraries.

Web UI

A set of React components for building UW branded UIs, built in collaboration with the UX design team.

Please have a look at the documentation for how to get started using these components.

v0 support

The web-ui-v0.x branch exists to support any Web UI v0.x bug fixes.

Colour System

Sets of colour scales for web and mobile, including light and dark mode for native mobile applications, as well as colours common to both colour modes. These colour scales are autogenerated from the Figma source.

Please have a look at the documentation for how to get started using these colours.

CSS Reset

A bare-bones CSS reset for UW web development.

Contributing

Please read our contribution guide.

Issues

Please feel free to open issues here, however we are using linear for issue tracking, so it may be moved there after being evaluated.

Publishing

All changes are published through Github Actions on the main branch. All development should take place on branches from main then submit a PR to merge back to main.

Changesets will be added as changes are contributed. When changes are merged to main the release workflow will run which will open, and keep updated, a Version Pull Request containing all changes. When this is merged to main all packages will be versioned, published to npm and changelogs will be generated based on the changesets.

Local development

You can use storybook to develop UW Web UI components locally. To get started, clone this repo and run the following command in the root directory.

npm run setup

This will get pnpm set up. If necessary, refer to the corepack documentation if there are issues with the corepack installation.

You can then install all the necessary dependencies, build the packages, and run the Storybook app and the Web UI library in watch mode. As before, run these commands in the root directory.

pnpm install
pnpm build
pnpm dev