open-index/open-npm huggingface dataset:
npm package: @salesgenterp/ui-components
Description: Made with create-react-library
Latest version: 0.4.533


In the project directory, you can run:

### `yarn install`

To install the dependencies.

### `yarn storybook`

Runs app in storybook mode where you can view all the components.

Note: `import 'antd/dist/antd.css'` in storybook component to apply the style.

# Update version when push into master:

# How to publish package to NPM:

Check latest version [here](https://www.npmjs.com/package/@salesgenterp/ui-components)

### Add tag to publish commit:
- Add tag to maintain the release version. Run following commands:
  - git tag -a `<version-number>` 9fceb02
    - example: git tag -a v1.2 9fceb02
  - git push origin --tags

#### Auto publish:
- Publishing package is automated using github actions.
- Changes pushed/merged into `master` branch with updated package verison will be automatically published to npm.

#### Publish manually:
1. Run `npm login` command in your terminal and enter following credentials:
 - username
 - password
 - email

Note: Contact admin for crendentials.

2. Update package version in `package.json` file.
3. Run one of the following command to publish the package:
   - `npm publish --access=public`
npm package: @saleshandy/aws-kms-crypto
Description: Package that lets you integrate AWS KMS seamlessly in your javascript project
Latest version: 1.0.7

# aws-kms-crypto

A Javascript library to encrypt and decrypt plain text using [AWS KMS service](https://aws.amazon.com/kms/)

## How to use it

`aws-kms-crypto` contains two class and both can be used to encrypt and/or decrypt any payload for separate scenarios.

### Method 1

This method provides simple encryption and decryption flow without any access logging or validation.

    const {AWSKMSCrypto} = require('aws-kms-crypto');

    // create AWSKMSCrypto object by passing aws configuration
    const kms = new AWSKMSCrypto({
    	keyId: <AWS_KMS_KEY_ID>,
    	accessKeyId: <AWS_ACCESS_KEY_ID>,
    	secretAccessKey: <AWS_SECRET_ACCESS_KEY>,
    	region: <AWS_REGION_NAME>
    });

    const plainText = "I am about it encrypt :(";

    // call encrypt function
    const cipherText = await kms.encrypt(plainText);
    console.log(cipherText);

    // call decrypt function
    const  decryptedPlainText = await kms.decrypt(cipherText);
    console.log(decryptedPlainText);

### Method 2

This method provides strict validation and console logging on top of encryption and decryption function. It will validate payload and check for necessary details and after validating it will call encrypt/decrypt function.

    const {AWSKMSValidatorAndLogger} = require('aws-kms-crypto');


    // create AWSKMSCrypto object by passing aws configuration
    const kms = new AWSKMSValidatorAndLogger({
    	keyId: <AWS_KMS_KEY_ID>,
    	accessKeyId: <AWS_ACCESS_KEY_ID>,
    	secretAccessKey: <AWS_SECRET_ACCESS_KEY>,
    	region: <AWS_REGION_NAME>
    });

    const plainText = "I am about it encrypt :(";

    // call encrypt function
    const cipherText = await kms.encryptToken({
    	tokenPayload: plainText,
    	ipAddress: "192.168.2.5",
    	user: "rutvik@saleshandy.com",
    	userRole: "Support User",
    	tokenOwner: "vishal@saleshandy.com",
    	reason: kms.tokenUsageReason.tokenGenerated
    });
    console.log(cipherText);

    // call decrypt function
    const decryptedPlainText = await kms.decryptToken({
    	encryptedTokenPayload: cipherText,
    	ipAddress: "192.168.2.5",
    	user: "rutvik@saleshandy.com",
    	userRole: "Support User",
    	tokenOwner: "vishal@saleshandy.com",
    	reason: kms.tokenUsageReason.tokenGenerated
    });
    console.log(decryptedPlainText);
npm package: @saleshandy/design-system
Description: Saleshandy Design System
Author: Saleshandy
Latest version: 0.17.5

# Saleshandy Design System

<br />

A Design System is the single source of truth which groups all the elements that will allow the teams to design, realize and develop a product.

<br />

## 🚀 Setting up the project

<br />

1️⃣ &nbsp; Install required dependencies →

```
npm install
```

2️⃣ &nbsp; Run the compiler in watch mode, it watches for changes and auto compiles the code →

```
npm start
```

3️⃣ &nbsp; Run the Storybook preview, it opens up the preview in browser at http://localhost:6006 →

```
npm run storybook
```

4️⃣ &nbsp; Create project build, it compiles and generates static code in `dist` folder with minified js and css for production →

```
npm run build
```

5️⃣ &nbsp; Create storybook build, it compiles and generates static storybook preview for deployment in `storybook-static` folder →

```
npm run build-storybook
```

<br />

## ⭐ Steps to add component in design system

<br />

1️⃣ &nbsp; Create folder with component name <span style="color:grey;font-size:12px;"><i>(sample folder structure shown below)</i></span>

2️⃣ &nbsp; Define the component `jsx`, filename will be `component-name.tsx`

3️⃣ &nbsp; Add styling to the component by creating a file with name, `_component-name.scss` in the `assets/scss` directory and import it in `design-system.scss` file with a help comment <span style="color:grey;font-size:12px;"><i>(as shown below)</i></span>

```scss
// Component-Name Styles
@import './scss/component-name';
```

4️⃣ &nbsp; Create an `index.tsx` entry file for component export

5️⃣ &nbsp; Write the documentaion by creating a story file in the `stories` folder, filename will be `component-name.stories.tsx`

<br />

#### 📁 Sample Component Folder Structure →

```

├── src
│   ├── button                  → folder with component name
|   │   ├── button.spec.tsx     → component unit test file
|   │   ├── button.tsx          → component jsx file
|   |   └── index.ts            → component export index
|   │
|   ├── assets
|   |   ├── scss
|   |   |   └── components
|   |   |       └── _button.scss    → component styling file (optional)
|   |   └── design.system.scss  → import component scss in this file
|   |
│   └── index.ts                → import component jsx in this file
│
└── stories
    └── button.stories.tsx      → component documentation in storybook

```

<br />

## 🔗 Conventional Commits Referrence Docs

<br />

[Read more about conventional commit here](https://karma-runner.github.io/6.3/dev/git-commit-msg.html)

<br />

---

<p style="color:grey;font-size:12px;text-align:right">📄 End Of README.md</p>
npm package: @saleshandy/icons
Description: Saleshandy Icons Library
Latest version: 1.17.16

# 🎉 Saleshandy Icons Library

The Saleshandy Icons Library is a comprehensive collection of 570+ SVG icons for use in your projects. These icons cover a wide range of categories and can be easily customized to fit your application's design.

## 🔧 Installation

You can install the Saleshandy Icons Library via npm by running the following command:

```
npm install @saleshandy/icons
```

## 🚀 Usage

To use the icons in your project, you can import them as SVG components or use them directly in your JSX.

### Importing SVG Components

```javascript
import { IconName } from '@saleshandy/icons';

// Use the icon as a component
<IconName />;
```

Replace `IconName` with the specific icon name you want to use from the library.

## 🎨 Customization

Saleshandy Icons can be easily customized to match your application's design. You can modify the size, color, and other properties using CSS.

| Attribute | Description                                     |
| --------- | ----------------------------------------------- |
| `width`   | The width of the icon.                          |
| `height`  | The height of the icon.                         |
| `fill`    | The fill color of the icon.                     |
| `stroke`  | The stroke color of the icon.                   |
| `...`     | Any other attributes supported by SVG elements. |

Please refer to the [SVG Element specification](https://developer.mozilla.org/en-US/docs/Web/SVG/Element) for a complete list of supported attributes.

## 📄 License

The Saleshandy Icons Library is licensed under the MIT License, which means you are free to use it in your projects, both commercial and non-commercial. However, we do ask that you provide attribution to the Saleshandy Icons Library project in your documentation and/or about page.

## 🔥 Credits

The Saleshandy Icons Library is developed and maintained by [Saleshandy](https://www.saleshandy.com/). We hope you find the it useful in your projects. If you have any questions or need further assistance, please don't hesitate to contact us.

Happy coding! ✨👩‍💻👨‍💻