open-index/open-npm huggingface dataset:
npm package: @perseu-vue/vuetify-messenger
Description: ## Installing
Author: Perseu Tech
Latest version: 0.5.0

# vuetify-messenger

## Installing

```bash
yarn add @perseu-vue/vuetify-messenger
```

Or

```bash
npm install @perseu-vue/vuetify-messenger
```

## Setup

Register `vuetify-messenger` globally:

```javascript
import Vue from "vue";
import VMessenger from "@perseu-vue/vuetify-messenger";

Vue.use(VMessenger);
```

### Changing default messages

```javascript
import Vue from "vue";
import VMessenger from "@perseu-vue/vuetify-messenger";

Vue.use(VMessenger, {
  texts: {
    confirmTitle: "Confirmação",
    successTitle: "Pronto",
    errorTitle: "Ops",
    closeText: "Fechar",
    yesText: "Sim",
    noText: "Não"
  }
});
```

Use the `<v-messenger></v-messenger>` component in the page that you want use it

> If you're ussing SPA, use it on the SPA's default page. like `App.vue` or `default.vue` (for Nuxt)

## Alert usage

### Sucess alert

```javascript
this.$messenger.showSuccessAlert("Some message");
```

![Success alert GIF](./assets/success-alert.gif)

### Error alert

```javascript
this.$messenger.showErrorAlert("Some message");
```

![Error alert GIF](./assets/error-alert.gif)

## Confirm usage

```javascript
this.$messenger.showConfirmAlert(
  "Some message",
  () => {
    console.log("Yes clicked");
  },
  () => {
    console.log("No clicked");
  }
);
```

![Confirm GIF](./assets/confirm.gif)

## Snackbar usage

### Sucess snackbar

```javascript
this.$messenger.showSuccessSnackbar("Some message");
```

![Success snackbar GIF](./assets/success-snackbar.gif)

### Error snackbar

```javascript
this.$messenger.showErrorSnackbar("Some message");
```

![Error snackbar GIF](./assets/error-snackbar.gif)
npm package: @perseu/browser-file-downloader
Description: A simple JavaScript module for download file from a Blob in the Browser-side.
Author: Perseu Tech
Latest version: 0.4.0

# Browser File Downloader

A simple JavaScript module for download file from a Blob in the Browser-side.

## Installing

NPM:

```bash
npm install @perseu/browser-file-downloader
```

Yarn:

```bash
yarn add @perseu/browser-file-downloader
```

## Example

```js
import FileDownloader from '@perseu/browser-file-downloader'

await FileDownloader.downloadFileAsPdf(blob, fileName)
```

## API

### Methods

**downloadFileAsPdf(data, fileName)**

- `data: File|ArrayBuffer|Blob` the data object to be downloaded.
- `fileName: ?String` the name of the file that will be downloaded. The file extension type should to be explicit (e.g. `Download.pdf`). The default value is `Download`.
- `returns: Promise<void>`

  This method will download the `data` as a PDF file.

**downloadFileAs(data, type, fileName)**

- `data: File|ArrayBuffer|Blob` the data object to be downloaded.
- `type: ?String` the MIME type of the file. The default value is `text/plain`.
- `fileName: ?String` the name of the file that will be downloaded. The file extension type should to be explicit (e.g. `Download.pdf`). The default value is `Download`.
- `returns: Promise<void>`

  This method will download the `data` as specified in `type` parameter.

**downloadFile(blob, fileName)**

- `blob: Blob` the blob object to be downloaded.
- `fileName: String` the name of the file that will be downloaded. The file extension type should to be explicit (e.g. `Download.pdf`).
- `returns: void`

  This method will download the `blob` as a file. The file type should be informed on the Blob object.

**base64ToArrayBuffer(base64)**

- `base64: String` the base64 string to be converted.
- `returns: ArrayBuffer`

  This method will convert the `base64` string to a `ArrayBuffer` object.

## License

[MIT](LICENSE)
npm package: @perseu/number-formatter-js
Description: A simple JavaScript module for number formatter
Author: Perseu Tech
Latest version: 0.2.0

# Number Formatter JS

A simple JavaScript module for number formatter in Brazil pattern

## Installing

NPM:

```bash
npm install @perseu/number-formatter-js
```

Yarn:

```bash
yarn add @perseu/number-formatter-js
```

## Example

```js
import NumberFormatter from '@perseu/number-formatter-js'

NumberFormatter.decimalFmt(3.4) // 3,4
NumberFormatter.decimalTwoFixedFmt(3.4) // 3,40
NumberFormatter.decimalNFixedFmt(1.5, 4) // 1,5000
NumberFormatter.currencyBRLFmt(3.4) // R$ 3,40
```

## API

### Methods

**decimalFmt(number)**

- `number: number|string` the number to be formatted
- `returns: string`

  This method will replace `.` with `,` for decimal values

**decimalTwoFixedFmt(number)**

- `number: number|string` the number to be formatted
- `returns: string`

  This method will replace `.` with `,` and will fix two decimal numbers after decimal separator

**decimalNFixedFmt(number, decimals)**

- `number: number|string` the number to be formatted
- `decimals: number` the quantity of numbers after decimal separator
- `returns: string`

  This method will replace `.` with `,` and will fix two n numbers after decimal separator

**currencyBRLFmt(number)**

- `number: number|string` the number to be formatted
- `returns: string`

  This method will replace transform a decimal (number) value to a String BRL currency. It utilizes `Intl`.

## License

[MIT](LICENSE)
npm package: @perseus-with-complex-numbers/kas
Description: A lightweight JavaScript CAS for comparing expressions and equations.
Author: Khan Academy
Latest version: 1.0.3

# @khanacademy/kas

A lightweight JavaScript CAS (Computer Algebra System) for comparing expressions and equations.
It is used throughout [Khan Academy](https://khanacademy.org)'s interactive exercises.

## What can it do?

It can parse plain text math, LaTeX, or a mix of both:

```js
var expr = KAS.parse("3x \\frac{42}{42} sin^2y").expr;
expr.print();
// "3*x*42/42*sin(y)^(2)"
```

It can evaluate expressions:

```js
var expr = KAS.parse("(x^2+y^2)^.5").expr;
expr.eval({x: 3, y: 4});
// 5
```

It can compare expressions and equations:

```js
var expr1 = KAS.parse("(1-x)(-1-6x)").expr;
var expr2 = KAS.parse("(6x+1)(x-1)").expr;
KAS.compare(expr1, expr2).equal;
// true

var eq1 = KAS.parse("2w+50/w=25").expr;
var eq2 = KAS.parse("w(12.5-w)=25").expr;
KAS.compare(eq1, eq2).equal;
// true
```

It can perform basic transforms that always simplify an expression:

```js
var expr = KAS.parse("1+1+x+x+x+y").expr;
expr.collect().print();
// "2+3*x+y"

var expr = KAS.parse("b^(2*y*log_b x)").expr;
expr.collect().print();
// "x^(2*y)"
```

It can perform non-simplifying transforms on an expression:

```js
var expr = KAS.parse("ab(c+d)e^f").expr;
expr.print();
// "a*b*(c+d)*e^(f)"
expr.expand().print();
// "a*b*e^(f)*c+a*b*e^(f)*d"
expr.expand().factor().print();
// "a*b*e^(f)*(c+d)"
```

It can combine the above abilities to perform powerful simplification:

```js
var expr = KAS.parse("((nx^5)^5)/(n^-2x^2)^-3").expr;
expr.print();
// "(n*x^(5))^(5)*(n^(-2)*x^(2))^(-1*-3)"
expr.simplify().print();
// "n^(-1)*x^(31)"

var expr = KAS.parse("(15np-25mp)/(15p^2-5p)+(20mp+10p^2)/(15p^2-5p)").expr;
expr.print();
// "(15*n*p+-25*m*p)*(15*p^(2)+-5*p)^(-1)+(20*m*p+10*p^(2))*(15*p^(2)+-5*p)^(-1)"
expr.simplify().print();
// "(-1+3*p)^(-1)*(3*n+-1*m+2*p)"
```

## How to build the library
    pnpm install
    pnpm build

## How to build the parser
First, make any changes in `src/parser-generator.js`

    pnpm install
    pnpm build:parser

## License
[MIT License](http://opensource.org/licenses/MIT)
npm package: @persevie/grimoire-css-js
Description: **Grimoire CSS JS** is a high-performance Node.js wrapper for [Grimoire CSS](https://github.com/persevie/grimoire-css), a Rust-powered CSS engine. It brings Grimoire’s advanced styling, optimization, and dynamic composition features to the JavaScript ecos
Author: Dmitrii Shatokhin
Latest version: 2.0.0

# grimoire-css-js

**Grimoire CSS JS** is a high-performance Node.js wrapper for [Grimoire CSS](https://github.com/persevie/grimoire-css), a Rust-powered CSS engine. It brings Grimoire’s advanced styling, optimization, and dynamic composition features to the JavaScript ecosystem - usable via CLI, API, or build tool plugins.

## Installation

```bash
npm i @persevie/grimoire-css-js
```

## Usage

### CLI

```bash
grimoire-css-js init           # Create config
grimoire-css-js build          # Build CSS from sources
grimoire-css-js shorten        # Convert long spell components to shorthands
```

### Node.js API

```js
const { start } = require('@persevie/grimoire-css-js')
start('build') // or 'init', etc.
```

### Configuration

All features are controlled via a single `grimoire.config.json` file. Define spells, scrolls, variables, projects, shared/critical CSS, and more. See [Grimoire CSS docs](https://github.com/persevie/grimoire-css#configuration) for details.

## Build Tool Plugins

- [Rollup](./plugins/grimoire-css-js-rollup)
- [Vite](./plugins/grimoire-css-js-vite)
- [Webpack](./plugins/grimoire-css-js-webpack)

## Migration

Convert existing CSS to Grimoire format using the [Transmutator](https://github.com/persevie/grimoire-css-transmutator) (CLI or Web UI).

## Resources

- [Grimoire CSS Documentation](https://github.com/persevie/grimoire-css)
- [Playground](https://grimoirecss.com/playground)

---

Grimoire CSS JS brings the full power of Grimoire’s engine to JavaScript projects - no compromises, no boilerplate, just pure CSS magic.
npm package: @persevie/grimoire-css-js-darwin-arm64
Description: This is the **aarch64-apple-darwin** binary for `@persevie/grimoire-css-js`
Author: Dmitrii Shatokhin
Latest version: 2.0.0

# `@persevie/grimoire-css-js-darwin-arm64`

This is the **aarch64-apple-darwin** binary for `@persevie/grimoire-css-js`
npm package: @persevie/grimoire-css-js-darwin-x64
Description: This is the **x86_64-apple-darwin** binary for `@persevie/grimoire-css-js`
Author: Dmitrii Shatokhin
Latest version: 2.0.0

# `@persevie/grimoire-css-js-darwin-x64`

This is the **x86_64-apple-darwin** binary for `@persevie/grimoire-css-js`
npm package: @persevie/grimoire-css-js-linux-arm64-gnu
Description: This is the **aarch64-unknown-linux-gnu** binary for `@persevie/grimoire-css-js`
Author: Dmitrii Shatokhin
Latest version: 2.0.0

# `@persevie/grimoire-css-js-linux-arm64-gnu`

This is the **aarch64-unknown-linux-gnu** binary for `@persevie/grimoire-css-js`
npm package: @persevie/grimoire-css-js-linux-x64-gnu
Description: This is the **x86_64-unknown-linux-gnu** binary for `@persevie/grimoire-css-js`
Author: Dmitrii Shatokhin
Latest version: 2.0.0

# `@persevie/grimoire-css-js-linux-x64-gnu`

This is the **x86_64-unknown-linux-gnu** binary for `@persevie/grimoire-css-js`
npm package: @persevie/grimoire-css-js-webpack-plugin
Description: webpack plugin for @persevie/grimoire-css-js
Author: Dmitrii Shatokhin
Latest version: 2.0.0

# `@persevie/grimoire-css-js-rollup`

This is the **webpack** plugin for [@persevie/grimoire-css-js](https://github.com/persevie/grimoire-css-js)
npm package: @persevie/grimoire-css-js-win32-x64-msvc
Description: This is the **x86_64-pc-windows-msvc** binary for `@persevie/grimoire-css-js`
Author: Dmitrii Shatokhin
Latest version: 2.0.0

# `@persevie/grimoire-css-js-win32-x64-msvc`

This is the **x86_64-pc-windows-msvc** binary for `@persevie/grimoire-css-js`
npm package: @persevie/rollup-plugin-grimoire-css-js
Description: rollup plugin for @persevie/grimoire-css-js
Author: Dmitrii Shatokhin
Latest version: 2.0.0

# `@persevie/rollup-plugin-grimoire-css-js`

This is the **rollup** plugin for [@persevie/grimoire-css-js](https://github.com/persevie/grimoire-css-js)
npm package: @persevie/vite-plugin-grimoire-css-js
Description: vite plugin for @persevie/grimoire-css-js
Author: Dmitrii Shatokhin
Latest version: 2.0.0

# `@persevie/vite-plugin-grimoire-css-js`

This is the **vite** plugin for [@persevie/grimoire-css-js](https://github.com/persevie/grimoire-css-js)
npm package: @persian-caesar/chatbot
Description: A TypeScript-based chatbot package for Persian Caesar
Author: Sobhan-SRZA
Latest version: 0.0.4

# chatbot
A custom chat bot package free for all.

## Example
```js
const { Database, default: ChatBot } = require("@persian-caesar/chatbot");
const { QuickDB, JSONDriver } = require("quick.db");
const database = new Database(new QuickDB({ driver: new JSONDriver() }));
const chatBot = new ChatBot(database, "1");
const answer = chatBot.handleMessage("hello");
console.log(answer);
```

## Contact
<div align="center">
  <a href="https://srza.ir" target="_blank">
   <img align="left" src="https://raw.githubusercontent.com/Sobhan-SRZA/Sobhan-SRZA/refs/heads/main/images/social.png" alt="Sobhan-SRZA social" width=400px>
  </a>

  <a href="https://t.me/d_opa_mine" target="_blank">
   <img alt="Telegram"
    src="https://raw.githubusercontent.com/Sobhan-SRZA/Sobhan-SRZA/refs/heads/main/images/telegram-ch.svg"
    height="30" />
  </a>

  <a href="https://t.me/Sobhan_SRZA" target="_blank">
   <img alt="Telegram"
    src="https://raw.githubusercontent.com/Sobhan-SRZA/Sobhan-SRZA/refs/heads/main/images/telegram-ac.svg"
    height="30" />
  </a>

  <a href="https://www.instagram.com/mr.sinre?igsh=cWk1aHdhaGRnOGg%3D&utm_source=qr" target="_blank">
   <img alt="Instagram"
    src="https://raw.githubusercontent.com/Sobhan-SRZA/Sobhan-SRZA/refs/heads/main/images/instagram.svg"
    height="30" />
  </a>

  <a href="https://www.twitch.tv/sobhan_srza" target="_blank">
   <img alt="Twitch"
    src="https://raw.githubusercontent.com/Sobhan-SRZA/Sobhan-SRZA/refs/heads/main/images/twitch.svg"
    height="30" />
  </a>

  <a href="https://www.youtube.com/@mr_sinre?app=desktop&sub_confirmation=1" target="_blank">
   <img alt="YouTube"
    src="https://raw.githubusercontent.com/Sobhan-SRZA/Sobhan-SRZA/refs/heads/main/images/youtube.svg"
    height="30" />
  </a>
  
  <a href="https://github.com/Sobhan-SRZA" target="_blank">
   <img alt="Github"
    src="https://raw.githubusercontent.com/Sobhan-SRZA/Sobhan-SRZA/refs/heads/main/images/github.svg"
    height="30" />
  </a>
  
  <p align="left">
   <a href="https://discord.gg/xh2S2h67UW" target="_blank">
    <img src="https://discord.com/api/guilds/1054814674979409940/widget.png?style=banner2" alt="pc-development.png">
   </a>
  </p>

  <p align="right">
   <a href="https://discord.gg/54zDNTAymF" target="_blank">
    <img src="https://discord.com/api/guilds/1181764925874507836/widget.png?style=banner2" alt="pc-club.png">
   </a>
  </p>

  <div align="center">
   <a href="https://discord.com/users/865630940361785345" target="_blank">
    <img alt="My Discord Account" src="https://discord.c99.nl/widget/theme-1/865630940361785345.png" />
   </a>
    <a href="https://discord.com/users/986314682547716117" target="_blank" align="right">
    <img alt="Team Discord Account" src="https://discord.c99.nl/widget/theme-1/986314682547716117.png" />
   </a>
  </div>

 </div>

</div>
npm package: @persian-tools/react-persian-tools
Description: React wrapper component around persian tools
Author: persian-tools
Latest version: 0.3.2

<div align="center">
	<p align="center">
		<img src="./images/logo.png" width="200" />
	</p>
	<h1 align="center">react-persian-tools</h1>
	<p align="center">React wrapper component around persian tools</p>

![CI/CD](https://github.com/persian-tools/react-persian-tools/workflows/Continuous%20Integration/badge.svg)
[![codecov](https://codecov.io/gh/persian-tools/react-persian-tools/branch/master/graph/badge.svg)](https://codecov.io/gh/persian-tools/react-persian-tools)
[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/persian-tools/react-persian-tools/blob/master/LICENSE)
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-orange.svg)](https://github.com/persian-tools/react-persian-tools/compare) 
[![CodeFactor](https://www.codefactor.io/repository/github/persian-tools/react-persian-tools/badge/master)](https://www.codefactor.io/repository/github/persian-tools/react-persian-tools/overview/master)
[![NPM](https://img.shields.io/npm/v/react-persian-tools.svg)](https://www.npmjs.com/package/react-persian-tools) 
[![Storybook](https://cdn.jsdelivr.net/gh/storybookjs/brand@master/badge/badge-storybook.svg)](https://persian-tools.github.io/react-persian-tools/)
[![GitHub contributors](https://img.shields.io/github/contributors/persian-tools/react-persian-tools.svg)](https://GitHub.com/persian-tools/react-persian-tools/contributors/)

</div>
<hr />

## Demo

https://persian-tools.github.io/react-persian-tools/

![alt text](./images/demo.gif "Preview")

## Install

```bash
npm install --save react-persian-tools
```

## Usage

```tsx
import React, { Component } from 'react'

import PersianTools from 'react-persian-tools'

class Example extends Component {
  render() {
    return (
      <>
        <PersianTools.WordsToNumber>منفی سه هزارمین</PersianTools.WordsToNumber>
        <PersianTools.WordsToNumber fuzzy>یگصد و بنجاه هزار</PersianTools.WordsToNumber>
        <PersianTools.NumberToWords>500,443</PersianTools.NumberToWords>
        <PersianTools.NumberToWords ordinal>500,443</PersianTools.NumberToWords>
        <PersianTools.AddCommas>30000000</PersianTools.AddCommas>
        <PersianTools.RemoveCommas>30,000,000</PersianTools.RemoveCommas>
        <PersianTools.DigitsArToEn>٠١٢٣٤٥٦٧٨٩</PersianTools.DigitsArToEn>
        <PersianTools.DigitsArToFa>٠١٢٣٤٥٦٧٨٩</PersianTools.DigitsArToFa>
        <PersianTools.DigitsEnToFa>123۴۵۶</PersianTools.DigitsEnToFa>
        <PersianTools.DigitsFaToEn>123۴۵۶</PersianTools.DigitsFaToEn>
      </>
    )
  }
}
```

## Contributing

Thank you for your interest in contributing! Please feel free to put up a PR for any issue or feature request.

## License

This project is licensed under the MIT License - see the [LICENSE.md](https://github.com/persian-tools/react-persian-tools/blob/master/LICENSE) file for details.
npm package: @persidius/prettier-config
Description: Persidius shared Prettier config
Author: Persidius Systems
Latest version: 1.1.1

# `@persidius/prettier-config`

> [Persidius](https://persidius.ro) shared [Prettier](https://prettier.io) config.

## Usage

**Install**:

```bash
$ yarn add --dev @persidius/prettier-config
```

**Edit `package.json`**:

```jsonc
{
  // ...
  "prettier": "@persidius/prettier-config"
}
```
npm package: @persio/n8n-nodes-persio
Description: Persio nodes for n8n
Author: Persio
Latest version: 0.0.3

![Banner image](https://user-images.githubusercontent.com/10284570/173569848-c624317f-42b1-45a6-ab09-f0ea3c247648.png)

# n8n-nodes-starter

This repo contains example nodes to help you get started building your own custom integrations for [n8n](n8n.io). It includes the node linter and other dependencies.

To make your custom node available to the community, you must create it as an npm package, and [submit it to the npm registry](https://docs.npmjs.com/packages-and-modules/contributing-packages-to-the-registry).

## Prerequisites

You need the following installed on your development machine:

* [git](https://git-scm.com/downloads)
* Node.js and npm. Minimum version Node 16. You can find instructions on how to install both using nvm (Node Version Manager) for Linux, Mac, and WSL [here](https://github.com/nvm-sh/nvm). For Windows users, refer to Microsoft's guide to [Install NodeJS on Windows](https://docs.microsoft.com/en-us/windows/dev-environment/javascript/nodejs-on-windows).
* Install n8n with:
	```
	npm install n8n -g
	```
* Recommended: follow n8n's guide to [set up your development environment](https://docs.n8n.io/integrations/creating-nodes/build/node-development-environment/).


## Using this starter

These are the basic steps for working with the starter. For detailed guidance on creating and publishing nodes, refer to the [documentation](https://docs.n8n.io/integrations/creating-nodes/).

1. [Generate a new repository](https://github.com/n8n-io/n8n-nodes-starter/generate) from this template repository.
2. Clone your new repo:
    ```
    git clone https://github.com/<your organization>/<your-repo-name>.git
    ```
3. Run `npm i` to install dependencies.
4. Open the project in your editor.
5. Browse the examples in `/nodes` and `/credentials`. Modify the examples, or replace them with your own nodes.
6. Update the `package.json` to match your details.
7. Run `npm run lint` to check for errors or `npm run lintfix` to automatically fix errors when possible.
8. Test your node locally. Refer to [Run your node locally](https://docs.n8n.io/integrations/creating-nodes/test/run-node-locally/) for guidance.
9. Replace this README with documentation for your node. Use the [README_TEMPLATE](README_TEMPLATE.md) to get started.
10. Update the LICENSE file to use your details.
11. [Publish](https://docs.npmjs.com/packages-and-modules/contributing-packages-to-the-registry) your package to npm.

## More information

Refer to our [documentation on creating nodes](https://docs.n8n.io/integrations/creating-nodes/) for detailed information on building your own nodes.

## License

[MIT](https://github.com/n8n-io/n8n-nodes-starter/blob/master/LICENSE.md)
npm package: @persistenceone/persistence-ui-components
Description: A React component library built with TailwindCSS and TypeScript.
Author: Persistence
Latest version: 0.0.4

# persistence-ui-components

[![npm (tag)](https://img.shields.io/npm/v/@persistenceone/persistence-ui-components)](https://www.npmjs.com/package/@persistenceone/persistence-ui-components)
![Libraries.io dependency status for GitHub repo](https://img.shields.io/librariesio/github/persistenceOne/persistence-ui-components)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

UI Components and utility library for pSTAKE App.

#### npm

```shell
npm i @persistenceone/persistence-ui-components
```

### Available Components

```ts
import {
    Button, 
    ButtonLink, // to redirct from button
    Dropdown,
    Input, 
    Modal, 
    Switch,
    Tabs,
    Spinner,
    Radio
} from "@persistenceone/persistence-ui-components";
```

### Available Hooks

```ts
import {
    useLocalStorage, 
    useWindowSize,
    useOnClickOutside,
    useOnlineStatus,
    useSortableTable
} from "@persistenceone/persistence-ui-components";
```

### Available helper functions

```ts
import {
    formatNumber,
    stringTruncate,
    truncateToFixedDecimalPlaces,
    numberFormat,
    getTokenImgFromDenom,
    minifiyTxnHash,
    getActiveSideBarItem,
    getChainSpecificAssets,
    getPercentChange
} from "@persistenceone/persistence-ui-components";
```
### TailwindCSS Config

```tsconst tailwindConf = require("@persistenceone/persistence-ui-components");
module.exports = {
    content: [
    ...
    "./node_modules/@persistenceone/persistence-ui-components/**/*.{js,ts,jsx,tsx,mdx}",
    ],
}
```
npm package: @persistenceone/pstake-ui-components
Description: A React component library built with TailwindCSS and TypeScript.
Author: pSTAKE Finance
Latest version: 0.1.79

# pstake-ui-components

[![npm (tag)](https://img.shields.io/npm/v/@persistenceone/pstake-ui-components)](https://www.npmjs.com/package/@persistenceone/pstake-ui-components)
![Libraries.io dependency status for GitHub repo](https://img.shields.io/librariesio/github/persistenceOne/pstake-ui-components)
[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

UI Components and utility library for pSTAKE App.

#### npm

```shell
npm i @persistenceone/pstake-ui-components
```

### Available Components

```ts
import {
    Button, 
    ButtonLink, // to redirct from button
    Dropdown,
    Input, 
    Modal, 
    Switch,
    Tabs,
    Spinner,
    Radio
} from "@persistenceone/pstake-ui-components";
```

### Available Hooks

```ts
import {
    useLocalStorage, 
    useWindowSize,
    useOnClickOutside,
    useOnlineStatus,
    useSortableTable
} from "@persistenceone/pstake-ui-components";
```

### Available helper functions

```ts
import {
    formatNumber,
    stringTruncate,
    truncateToFixedDecimalPlaces,
    numberFormat,
    getTokenImgFromDenom,
    minifiyTxnHash,
    getActiveSideBarItem,
    getChainSpecificAssets,
    getPercentChange
} from "@persistenceone/pstake-ui-components";
```
### TailwindCSS Config

```tsconst tailwindConf = require("@persistenceone/pstake-ui-components");
module.exports = {
    content: [
    ...
    "./node_modules/@persistenceone/pstake-ui-components/**/*.{js,ts,jsx,tsx,mdx}",
    ],
}
```