@desci-labs/frontend-components/README.md

A library for commonly used components on the DeSci Frontend web apps

# Frontend Components Library

This library provides a collection of components for integration across DeSci Frontend Apps.

⚠️ Only supports React 19 >=

## Features

-   🌓 Dark mode support via storybook
-   📦 Built with Vite
-   🎯 TypeScript
-   🎭 Storybook
-   🧪 Vitest for testing
-   🎨 Tailwind CSS

## Installation

```bash
npm install @desci-labs/frontend-components
```

## Note

-   The `stories` folder contains examples of storybook integration, it was added upon installation of storybook. You can refer for guidance.
-   The `test` folder contains app file to run UI on local server, not recommended since we have Storybook.

### Prerequisites

-   Node.js (v16 or higher)
-   npm or yarn

### Setup

```bash
# Clone the repository
git clone [repository-url]

# Install dependencies
npm install

# Start Storybook for component visualisation
npm run storybook
```

## How To Test New Updates

Step 1. Create new component and add export to index.ts

Step 2. `npm run build` to get updated dist folder

Step 3. `npm pack` to create zip of dist folder

Step 4. On codebase for test, install with `npm install <local path to zip file>`

Step 5. Test component

Always delete generated zip folder after tests.

## How To Publish

-   Update the version in package.json
-   `npm run build` - Build the library
-   `npm publish --access public` - Publish Library

⚠️ Note that an access token is required to publish successfully without the need for manual authentication during publish. To authenticate, create a .npmrc file and add this //registry.npmjs.org/:\_authToken=<Access_Token>