Table of Contents

• Table of Contents

• Tech Stack

• Prerequisites

• Installation

• Development

• Releases

• Notes

Tech Stack

Building components used of the project:

• 📚 Storybook for UI component development and auto-generated docs
• 👩‍🎤 Storybook theming | for component-scoped styling
• ⚛️ React declarative component-centric UI
• ⚛️ ChakraUI declarative component-centric UI and components are extended via this.
• ⚛️ JEST Testing of Components are covered by JEST (React/Testing Library)

Prerequisites

To work with this repository locally, ensure you have:

• Node.js 20+ and npm available in your shell.
• An npm account only if you intend to publish packages.

Installation

To install AW's UI-kit library into an existing project, execute the command:

npm install --save @alienworlds/uikit

To import the UI-kit components into the project:

import { Button } from '@alienworlds/uikit';

<Button> Start </Button>

Development

In order to run the project in a development environment, from the repository folder type in your terminal:

npm install

To compile the project with all required dependencies, from the repository folder type in your terminal:

npm run storybook

This will compile the required dependencies and run the application in the browser.

Releases

Regarding the version number:

• Use the alpha version 0.x.x-alpha-1.0 to test the new version in the game-ui. This is also useful during development to ensure proper testing.
• Update the minor or patch version number when you are ready to release the new changes.

There are two separate releases: one for uikit and one for icon. Please follow these steps:

To release uikit:

• Ensure that you are in the root directory.
• Proceed with the release process.

To release icon:

• Navigate to the src/packages/icons directory.
• Proceed with the release process from there.

Steps to release a new version:

1. Ensure that you are using Node.js 20+ and a recent npm version.
2. Confirm that you have updated the version number in the package.json file as mentioned above.
3. Execute the command npm run release.

Notes

• Installing public packages from npm does not require a token.
• Publishing requires npm authentication (for CI, set NPM_TOKEN; for local publishing, use npm login).