Hanzo-ui-basics-react NPM

Getting Started with UI Basics React

This is a basic React project that includes several components built on top of the @hanzo/hanzo-ui-core library, which is required as a dependency in its latest version.

This project need to be used as a NPM package, and then all the components shoul be accesible using:

import { [NAME OF THE COMPONENT] } from '@hanzo/hanzo-ui-basics-react/lib';

Getting Started

You must authenticate to the Package Registry to install a package from a private project.

First get auth token from:

https://repos.codehanzo.com/-/profile/personal_access_tokens

When creating the access token, check the scope bellow

read_api

ATTENTION
This token is a global access token. This will allow you to access all projects and registries you have access to in your Gitlab Account. For a more specific token, create a Project Access Token instead.

Config NPM access to registry

1 - Config registry

npm config set @hanzo:registry=https://repos.codehanzo.com/api/v4/packages/npm/

2 - Config auth token for registry

npm config set '//repos.codehanzo.com/api/v4/packages/npm/:_authToken' "<your_token>"

Replace <your_token> with a access token your personal access token.

NOTE:
This token can also be a Project access token. To get that token go to <project> > Settings > Access Tokens. Although, this token will only allow you to access this specific package.

Using this package

To start using this project, you can clone the repository and install its dependencies using the following commands:

git clone git@repos.codehanzo.com:hanzo/hanzo-ui-basics-react.git

npm install

Once you have installed the dependencies, you can build the package using the following commands

npm run build

This command will compile the project and create a lib folder that can be published using NPM.

Publishing to NPM

To publish the project to NPM, you must first build it using the npm run build command, and then use the npm publish command to publish it.

Testing

This project includes tests that run on the React Testing Library. You can run the tests using the following command

npm run test

Update or add a new component

Any update or any update of a component need to increase the version of the package, and then publish again the NPM package. Remember build first and then publish.