open-index/open-npm huggingface dataset:
npm package: @leapfinance/ui-kit
Description: Reusable react component library for Leap Organisation
Author: vishwajeet
Latest version: 1.0.2

# Leap UI Kit
Reusable react component library for Leap Organisation

## Installation
```bash
npm i @leapfinance/ui-kit
```
OR
```bash
yarn add @leapfinance/ui-kit
```

## UseCase
```node
import { ImageWithText } from "@leapfinance/ui-kit";
// ...
<ImageWithText
  img="https://leapassets.s3.ap-south-1.amazonaws.com/workshop/1669013114743-tick_(2)_1.png"
  onClick={() => {}}
  text="100+ Mock Tests"
/>
```

## Guide
### Useful CLI
```bash
# to create folder structure in components 
yarn plop create {$FileName} 

# to create new Component in the packages
yarn plop add {$ComponentName} 
   
# to displaying components
yarn storybook
  
# to create declaration file
yarn tsm
```

## reference
1. Design System Doc [open](https://www.figma.com/file/9PjOOT38HuQ9Hs4mmvUEk7/Design-System-for-Tailwind?node-id=2%3A232)

## Tips and Tricks For Development
1. use npm link to test your package in your project. [read more](https://classic.yarnpkg.com/en/docs/cli/link)
2. use storybook to see the ui of your components. [read more](https://storybook.js.org/docs/react/get-started/introduction)
3. use snapshot to publish your packages for testing.


## RULES
1. Always use TitleCase to create new folder or component
2. Don't use any external lib
3. Always use plop to create new folder or components.
4. Never forget to write stories for the components.