open-index/open-npm huggingface dataset:
npm package: @ricardo-tobon/app-config
Description: Cascading configuration for web application
Author: Oleg Orlov
Latest version: 1.3.1

# @nas-user/app-config

> Cascading configuration for web application

## Install

```
npm install --save @nas-user/app-config
```

## Repository

https://github.com/Graf009/app-config.git

## Usage

Loads configuration files from a `config` folder in your project root.

- `default` is always loaded if it exists
- If you specify `NODE_ENV=production` then both `production` and `default` are loaded, with `production` taking precedence.
- Any valid JS extension can be used for config - JS, json, etc.
  - To load another extension, register it before you require this module

```js
import config from '@nas-user/app-config'
```

For working in browser add AppConfigPlugin in webpack config.

```js
import AppConfigPlugin from '@nas-user/app-config/webpack'

var webpackConfig = {
  plugins: [
    new AppConfigPlugin(),
  ]
}
```
npm package: @ricardo-tobon/babel-preset-eagle
Description: Babel preset used by Eagle
Author: Oleg Orlov
Latest version: 1.1.0

# @nas-user/babel-preset-eagle

This package includes the Babel preset used by Eagle

## Usage

If you want to use this Babel preset in a project, you can install it with following steps.

First, [install Babel](https://babeljs.io/docs/setup/).

Then create a file named `.babelrc` with following contents in the root folder of your project:

  ```js
  {
    "presets": ["eagle"]
  }
  ```
## Repository

https://github.com/Graf009/babel-preset-eagle.git
npm package: @ricardo-tobon/eslint-config-eagle
Description: Shared ESLint config
Author: Oleg Orlov
Latest version: 1.4.2

# @nas-user/eslint-config-eagle

Shared ESLint config.

## Usage

Our default export contains all of our ESLint rules, including EcmaScript 6+
and React. It requires `eslint`, `eslint-plugin-react`, `eslint-plugin-jsx-a11y`, and `eslint-plugin-import`.

1. `npm install --save-dev @nas-user/eslint-config-eagle eslint-plugin-react eslint-plugin-import eslint-plugin-jsx-a11y eslint`
2. add `"extends": "@nas-user/eslint-config-eagle"` to your .eslintrc

## Repository

https://github.com/Graf009/eslint-config-eagle.git
npm package: @ricardo-tobon/glob-loader
Description: webpack loader to load files at once with glob
Author: Ryohei Ikegami
Latest version: 0.4.0

# @nas-user/glob-loader

webpack loader to load files at once with glob

## Install

```
npm install --save-dev @nas-user/glob-loader
```

## Repository

Change: export object instead of an array

https://github.com/Graf009/glob-loader.git

## Use

* Create a glob pattern file (example: `dir.pattern`)
* Write the pattern of the files that you want to require
* Require it with `glob-loader`

### `dir.pattern` file

Pattern is relative to the file directory.

```
./dir/**/*.js
```

### Require patterns

```js
var modules = require("glob-loader!./dir.pattern");
```

## TODO

* source map
npm package: @ricardo-tobon/jetpack
Description: Nifty convenience wrappers that speed up your daily work
Author: Oleg Orlov
Latest version: 1.1.0

# @nas-user/jetpack

> Nifty convenience wrappers that speed up your daily work

## Install

```sh
npm install --save @nas-user/jetpack
```

## Repository

https://github.com/Graf009/jetpack.git

## Pack

- `linkState` - A helper function to use LinkedStateMixin for ES6 React Components
- `d3` - for d3.js
- `ExecutionEnvironment` - detect available features
npm package: @ricardo-tobon/jetpack-dom
Description: Nifty convenience wrappers that speed up your daily work
Author: Oleg Orlov
Latest version: 2.0.1

# @nas-user/jetpack-dom

> Nifty convenience wrappers that speed up your daily work

`ExecutionEnvironment` - detect available features

## Install

```sh
npm install --save @nas-user/jetpack-dom
```

## Repository

https://github.com/Graf009/jetpack-dom.git
npm package: @ricardo-tobon/tango
Description: Toolkit for building redux/react applications
Author: Oleg Orlov
Latest version: 1.3.2

# @nas-user/tango

> Toolkit for building redux/react applications

## Install

```js
npm install --save @nas-user/tango react react-dom
```

## Repository

https://github.com/Graf009/tango.git

## Core Ideals

- Everything should be immutable
- Everything should work easily and be simple to understand
- Spend time building applications rather than wiring modules together

## Implementation

- Use ES6
- Central store is completely immutable via Immutable.js
  - And PropTypes include Immutable.js types by default
- Easy to understand objects instead of crazy functional composition
  - Before: `createStore(combineReducers(reducers), {}, compose(applyMiddleware(middleware), devtools))`
  - After: `createStore({middleware: middleware, reducers: reducers, initialState: {}})`
- Bundle groups of middleware, enhancers, and reducers together as "plugins"
  - One line of code to add a router and etc. to your project
  - High quality ecosystem of modules guaranteed to work well with eachother
- Namespaced/nested actions and reducers
  - `todos.create` as an action corresponds to a `todos.create` reducer and `todos` in the store
- Default enhancers
  - redux-batched-subscribe
- Default middleware
  - redux-thunk
  - devtools
- Dead simple Component API
  - Use ES6 classes
  - Bring back sane behavior
    - Bind component functions scope to class (like old react)
  - Never write mapDispatchToProps or mapStateToProps

## Documentation

**Now**, check out the [documentation](https://github.com/Graf009/tango/tree/master/docs) to get started!
npm package: @ricardo-tobon/tango-data-view
Description: Lightweight data view abstraction for managing fetching/loaded/errored states for remote data
Author: Oleg Orlov
Latest version: 1.2.0

# @nas-user/tango-data-view

Simple component for managing asynchronous data dependency states. If you have a view with 3 base states: fetching, loaded, and errored - this will help you clean up a lot of boilerplate.
Works out of the box with `@nas-user/rumba` for doing API stuff.

## Install

```js
npm install --save @nas-user/tango-data-view
```

## Repository

https://github.com/Graf009/tango-data-view.git

## API

You can define three functions:

- `resolveData`
  - Defaults to doing nothing
  - Triggered on mount/update when any `storeProps` (what you give to tango's connect function) are not fulfilled
  - Responsible for dispatching any actions to fetch data
- `renderData`
  - Defaults to displaying nothing
  - Triggered when all storeProps are resolved
  - Receives a data object as an argument
  - Responsible for rendering the data
- `renderLoader`
  - Defaults to displaying nothing
  - Triggered when all storeProps are not resolved
  - Responsible for rendering a loader
- `renderErrors`
  - Defaults to displaying nothing
  - Triggered when any storeProp value has an `error` attribute
  - Receives an errors Map as an argument
    - Key is the storeProp
    - Value is the error object
  - Responsible for rendering any errors that happened while fetching data

## Example

```js
import React from 'react'
import { PropTypes, connect } from '@nas-user/tango'
import DataComponent from '@nas-user/tango-data-view'
import actions from 'core/actions'

@connect({
  users: 'subsets.users'
})
export default class UserList extends DataComponent {
  static propTypes = {
    users: PropTypes.iterable
  }

  resolveData() {
    actions.api.users.find({ subset: 'users' })
  }

  renderData({ users }) {
    return (
      <div>
        <div>Users</div>
        {
          users.map(user =>
            <Media key={user.get('id')} align="center" img={user.get('image')}>
              <Heading level={3}>{user.get('name')}</Heading>
            </Media>
          )
        }
      </div>
    )
  }

  renderErrors(errors) {
    return (
      <div>
        <div>Users</div>
        <div>Failed to Load!</div>
        {
          errors.map((err, field) =>
            <Media key={field} align="center">
              <Heading level={3}>{field}</Heading>
              <Text>{err.message}</Text>
            </Media>
          ).toArray()
        }
      </div>
    )
  }
}
```
npm package: @ricardo-tobon/tango-router
Description: Dead simple router for @nas-user/tango
Author: Oleg Orlov
Latest version: 1.4.0

# @nas-user/tango-router

> Dead simple router for @nas-user/tango

Wraps react-router + react-router-redux and provides the simplest API possible. Built for @nas-user/tango, but will work in any redux application.

## Install

```
npm install --save @nas-user/tango-router
```

## Repository

https://github.com/rtobon/tango-router.git

## Get Started

- Import in the module
- Add it to your store's plugins
- Router state is now under `router` in your store

### Example

```js
import { createStore } from '@nas-user/tango'
import * as router from '@nas-user/tango-router'

// you get the point
let store = createStore({
  plugins: [ router ]
})
```

## API

- history
- actions
- reducers
- middleware
- hook

### Components

These are all re-exported from react-router, the behavior is exactly the same. See the [react-router documentation](https://github.com/reactjs/react-router/tree/master/docs) if you haven't used these before.

- Router
- Route
- Link
- Redirect
- IndexRoute
- IndexLink
- IndexRedirect

#### Auth

   handling authentication

##### Props

- `store` - Redux store
- `options` - Options Object

##### Options Object Keys

- `authSelector(state): authData` \(*Function*): A state selector for the auth data.
- `redirectAction` \(*Function*): action for redirecting the user.
- `[failureRedirectPath]` \(*String*): Optional path to redirect the browser to on a failed check. Defaults to `/login`
- `[predicate(authData): Bool]` \(*Function*): Optional function to be passed the result of the `authSelector` param.
If it evaluates to false the browser will be redirected to `failureRedirectPath`.
- `[allowRedirectBack]` \(*Bool*): Optional bool on whether to pass a `redirect` query parameter to the `failureRedirectPath`
npm package: @ricardo5ro/symbols-pack
Description: A helpful utility for accessing special characters and common symbols as plain text in any project
Author: Ricardo Oliveira
Latest version: 1.0.3

# Symbols & Special Characters Pack

### The Problem

Sometimes our keyboard doesn't have all the keys we need, or the layout is different from what we're accustomed to. This often forces us to search online just to copy a symbol or special character

### The solution

With this package, you can easily access a wide range of symbols and special characters as plain text and use them directly in your project.

### Installation

```
npm install @ricardo5ro/symbols-pack
```

### Usage

```
const { getSymbols } = require('@ricardo5ro/symbols-pack');

const symbols = getSymbols();

console.log(symbols.dollar); // Output: $
console.log(symbols.copyright); // Output: ©
```

### Supported Symbols

You can find the complete list of available symbols [here](./src/symbols.js)

### Contributing

Contributions are welcome to help expand the list of symbols and special characters!

* Fork the repository
* Create a new branch and make your changes
* Submit a pull request with a description

### License

MIT License
npm package: @ricardo_productiv/vuex
Description: state management for Vue.js
Author: Evan You
Latest version: 4.1.5

# Vuex

[![npm](https://img.shields.io/npm/v/vuex.svg)](https://npmjs.com/package/vuex)
[![ci status](https://github.com/vuejs/vuex/actions/workflows/ci.yml/badge.svg)](https://github.com/vuejs/vuex/actions/workflows/ci.yml)

---

**Pinia is now the new default**

The official state management library for Vue has changed to [Pinia](https://pinia.vuejs.org). Pinia has almost the exact same or enhanced API as Vuex 5, described in [Vuex 5 RFC](https://github.com/vuejs/rfcs/pull/271). You could simply consider Pinia as Vuex 5 with a different name. Pinia also works with Vue 2.x as well.

Vuex 3 and 4 will still be maintained. However, it's unlikely to add new functionalities to it. Vuex and Pinia can be installed in the same project. If you're migrating existing Vuex app to Pinia, it might be a suitable option. However, if you're planning to start a new project, we highly recommend using Pinia instead.

---

Vuex is a state management pattern + library for Vue.js applications. It serves as a centralized store for all the components in an application, with rules ensuring that the state can only be mutated in a predictable fashion. It also integrates with Vue's official [devtools extension](https://github.com/vuejs/vue-devtools) to provide advanced features such as zero-config time-travel debugging and state snapshot export / import.

Learn more about Vuex at "[What is Vuex?](https://vuex.vuejs.org/)", or get started by looking into [full documentation](http://vuex.vuejs.org/).

## Documentation

To check out docs, visit [vuex.vuejs.org](https://vuex.vuejs.org/).

## Examples

You may find example applications built with Vuex under the `examples` directory.

Running the examples:

```bash
$ npm install
$ npm run dev # serve examples at localhost:8080
```

## Questions

For questions and support please use the [Discord chat server](https://chat.vuejs.org) or [the official forum](http://forum.vuejs.org). The issue list of this repo is **exclusively** for bug reports and feature requests.

## Issues

Please make sure to read the [Issue Reporting Checklist](https://github.com/vuejs/vuex/blob/main/.github/contributing.md#issue-reporting-guidelines) before opening an issue. Issues not conforming to the guidelines may be closed immediately.

## Changelog

Detailed changes for each release are documented in the [release notes](https://github.com/vuejs/vuex/releases).

## Stay In Touch

For latest releases and announcements, follow on Twitter: [@vuejs](https://twitter.com/vuejs).

## Contribution

Please make sure to read the [Contributing Guide](https://github.com/vuejs/vuex/blob/main/.github/contributing.md) before making a pull request.

## License

[MIT](http://opensource.org/licenses/MIT)

Copyright (c) 2015-present Evan You
npm package: @ricardofuzeto/ws-store
Description: Web service store library
Author: Ricardo Fuzeto
Latest version: 0.0.1-4

# Warning note

This library is still under development. We do **not** recommend using it yet since its features and/or interfaces might change in a nightly basis.

Also, it has not been tested properly yet. Test cases are still being designed as the library evolves, so its stability can't be guaranteed for now.

If you still want to use it, consider checking this library's behavior when debugging your project.

# About

Implementation of the Facebook's Flux architecture for Node.js environments.

This library is supposed to assist you developing cleaner source codes by removing the need of passing data sets around every corner of your system. This is done following Flux's concept of single-direction data flow by using a *store*, which holds all data published to it and cascades newly modified data automatically to wherever you use them.

# How to use

## Setting the store up

To set the store up, just import the library:

```
const { store } = require('@ricardofuzeto/ws-store');
```

Note that you won't have to worry about setting the store manually: the library does this work by itself.

## Writing data to the store

To write data to the store, use the method `notify`:

```
const { store } = require('@ricardofuzeto/ws-store');

const data = { field: 'value' };
store.notify(data);
```

This method just writes `data` to the store, creating the `field` property or replacing its old value by the new one.

## Subscribing to store data sets

To make your entity subscribe to some field changes, use the method `subscribe`:

```
const { store } = require('@ricardofuzeto/ws-store');

const data = store.subscribe('field1', 'field2'/*, field3...*/);

console.log(data.field1);
console.log(data.field2);
```

In the example above, `field1` and `field2` would have the values defined in their last `notify` call. Consider the following example as right after the above:

```
store.notify({
  field1: 'field1 value',
  field2: 'field2 value',
});

console.log(data.field1); // field1 value
console.log(data.field2); // field2 value

store.notify({ field2: 'field1 copy value' });

console.log(data.field1); // field1 value
console.log(data.field2); // field1 copy value
```

# Planned features

We have some suggested features for this library. However, each one must be analyzed in order for the library to remain light and usable across many environments as possible.

Our current list of suggestions:

* Store sanitizing inspired on Garbage Collector (GC) mechanisms;
* Store sanitizing inspired in Time-to-live (TTL) concept;

# Contributors

Ricardo Fuzeto ([email](mailto:ricardofuzeto@gmail.com?subject=About%20ws-boot)): idea conception and initial development stages
npm package: @ricardojrmcom/ace
Description: React tooling collection
Author: Ricardo Mota
Latest version: 2.0.1

<div align="center">

# ♠ `@ricardojrmcom/ace`

<b>React Tooling Collection</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/ace/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/ace?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/ace?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/ace?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```tsx
npm install @ricardojrmcom/ace

yarn add @ricardojrmcom/ace
```

<br />

### <b>Scripts</b>

```tsx
// install deps
yarn install

// run build
yarn build

// run lint
yarn lint

// run unit tests
yarn test

// run storybook
yarn sb
```

<br />

### <b>Project</b>

- [Project Page](https://l1b3r.notion.site/ace-afe5940ab5f94d78b74ab8a4f57a5cfb)
- [Source Code](https://github.com/ricardojrmcom/ace)
- [Releases Page](https://github.com/ricardojrmcom/ace/releases)

<br />

### <b>Project Dependencies</b>

- <b>TS Package Boilerplate: [🟪 @ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)</b>
- <b>React Module Boilerplate: [🟣 @ricardojrmcom/supernova](https://github.com/ricardojrmcom/supernova)</b>
- <b>TS Utility Scripts: [🌙 @ricardojrmcom/dervish](https://github.com/ricardojrmcom/dervish)</b>
- <b>React Utility Hooks: [🌘 @ricardojrmcom/reaper](https://github.com/ricardojrmcom/reaper)</b>
- <b>React MUI Themes: [🔥 @ricardojrmcom/fury](https://github.com/ricardojrmcom/fury)</b>
- <b>React Meta Data Handler: [⚫ @ricardojrmcom/pain](https://github.com/ricardojrmcom/pain)</b>
- <b>React API Client: [🌸 @ricardojrmcom/empathy](https://github.com/ricardojrmcom/empathy)</b>
- <b>React Lightweight Intl: [☁ @ricardojrmcom/echo](https://github.com/ricardojrmcom/echo)</b>

<br />

### <b>Dev Dependencies</b>

- `Yarn`
- `Typescript`
- `React`
- `Material-UI`
- `Next`
- `Prettier`
- `ESLint`
- `Commit Lint`
- `Lint Staged`
- `Husky`
- `Jest`
- `React Testing Library`
- `Storybook`
- `Webpack`
- `Semantic Release`

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/ace/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟣[@ricardojrmcom/supernova](https://github.com/ricardojrmcom/supernova)

<br />
npm package: @ricardojrmcom/color-converter
Description: Convert colors: HEX -> RGB / RGB -> HEX
Author: Ricardo Mota
Latest version: 4.0.0

<div align="center">

# 🌙 `@ricardojrmcom/color-converter`

<b>Convert colors: HEX -> RGB / RGB -> HEX</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/color-converter/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/color-converter?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/color-converter?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/color-converter?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/color-converter?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```ts
npm install @ricardojrmcom/color-converter

yarn add @ricardojrmcom/color-converter
```

<br />

### <b>Usage</b>

```ts
import { hexToRgb, rgbToHex } from '@ricardojrmcom/color-converter'

// Converts a color HEX string to RGB object
hexToRgb('#30a14e');
->  {
      r: 48,
      g: 161,
      b: 78,
    }

// Converts given RGB values into a color HEX string
rgbToHex(48, 161, 78);
-> "#30a14e"
```

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/color-converter/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟪[@ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)

<br />
npm package: @ricardojrmcom/date-format
Description: Format dates
Author: Ricardo Mota
Latest version: 3.0.0

<div align="center">

# 🌙 `@ricardojrmcom/date-format`

<b>Format dates</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/date-format/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/date-format?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/date-format?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/date-format?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/date-format?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```ts
npm install @ricardojrmcom/date-format

yarn add @ricardojrmcom/date-format
```

<br />

### <b>Usage</b>

```ts
import { dateFormat, dateRelative } from '@ricardojrmcom/date-format'

dateFormat(new Date('2022-01-31'))
-> '12:00 AM - 31 Jan, 2022 GMT'

dateRelative(new Date('2022-01-31'))
->  {
      from: '2 months ago',
      fromNow: 'in 2 months',
      to: 'in 2 months',
      toNow: '2 months ago',
    }
```

<br />

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/date-format/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟪[@ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)

<br />
npm package: @ricardojrmcom/dervish
Description: Typescript Utility
Author: Ricardo Mota
Latest version: 3.0.0

<div align="center">

# 🌙 `@ricardojrmcom/dervish`

<b>Typescript Utility</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/dervish/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/dervish?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/dervish?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/dervish?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/dervish?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```ts
npm install @ricardojrmcom/dervish

yarn add @ricardojrmcom/dervish
```

<br />

### <b>Usage</b>

```ts
import {
  dateFormat,
  dateRelative,
  hexToRgb,
  rgbToHex,
  numberFormat,
  stringCapitalize,
  stringTruncate,
} from '@ricardojrmcom/dervish';
```

<br />

### <b>Packages</b>

- [@ricardojrmcom/color-converter](https://github.com/ricardojrmcom/color-converter)
- [@ricardojrmcom/date-format](https://github.com/ricardojrmcom/date-format)
- [@ricardojrmcom/number-format](https://github.com/ricardojrmcom/number-format)
- [@ricardojrmcom/string-capitalize](https://github.com/ricardojrmcom/string-capitalize)
- [@ricardojrmcom/string-truncate](https://github.com/ricardojrmcom/string-truncate)

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/dervish/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟪[@ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)

<br />
npm package: @ricardojrmcom/echo
Description: React lightweight intl
Author: Ricardo Mota
Latest version: 3.0.0

<div align="center">

# ☁ `@ricardojrmcom/echo`

<b>React lightweight intl</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/echo/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/echo?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/echo?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/echo?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/echo?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```ts
npm install @ricardojrmcom/echo

yarn add @ricardojrmcom/echo
```

<br />

### <b>Usage</b>

```ts
// component
import { Echo, EchoProps } from '@ricardojrmcom/echo';

// hook
import { useEcho, EchoRecord, EchoMsgs } from '@ricardojrmcom/echo';

// provider
import { EchoProvider, EchoProviderProps } from '@ricardojrmcom/echo';


// app
const exampleEcho: EchoRecord = {
  en: {
    example: 'example en',
  },
  pt: {
    example: 'exemplo pt',
  },
};

<EchoProvider echo={exampleEcho} echoDefault="en">
  {...}
</EchoProvider>


// component
const Echo = ({ echoid }: EchoProps) => {
  const { echo } = useEcho();
  return <span>{echo(echoid)}</span>;
};

<Echo echoid="example" />
```

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/echo/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟣[@ricardojrmcom/supernova](https://github.com/ricardojrmcom/supernova)

<br />
npm package: @ricardojrmcom/empathy
Description: React API client
Author: Ricardo Mota
Latest version: 2.0.0

<div align="center">

# 🌸 `@ricardojrmcom/empathy`

<b>React API client</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/empathy/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/empathy?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/empathy?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/empathy?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/empathy?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```ts
npm install @ricardojrmcom/empathy

yarn add @ricardojrmcom/empathy
```

<br />

### <b>Usage</b>

```ts
import { useEmpathy } from '@ricardojrmcom/empathy';

const { data, error, loading } = useEmpathy(endpoint);
```

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/empathy/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟣[@ricardojrmcom/supernova](https://github.com/ricardojrmcom/supernova)

<br />
npm package: @ricardojrmcom/fury
Description: React Web UI
Author: Ricardo Mota
Latest version: 5.0.1

<div align="center">

# 🔥 `@ricardojrmcom/fury`

<b>React Web UI</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/fury/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/fury?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardo--jrm)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/fury?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/fury?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```tsx
npm install @ricardojrmcom/fury

yarn add @ricardojrmcom/fury
```

<br />

### <b>Usage</b>

```tsx
import { useFury, FuryProvider, FuryRecord } from '@ricardojrmcom/fury';

// provider
const exampleFury: FuryRecord = {
  fury1: {
    typography: {
      h1: {
        fontSize: '100px',
        color: 'red',
      },
    },
  },
  fury2: {
    typography: {
      h1: {
        fontSize: '75px',
        color: 'green',
      },
    },
  },
};

<FuryProvider fury={exampleFury} furyDefault="fury1">
  {...}
</FuryProvider>


// hook
const { furyActive, furyActiveId, furySetById } = useFury();
```

<br />

### <b>Scripts</b>

```tsx
// install deps
yarn install

// run lint
yarn lint

// run unit tests
yarn test

// run storybook
yarn sb
```

<br />

### <b>Project</b>

- [Project Page](https://l1b3r.notion.site/fury-5acb71cd3a0446a0a520bfa4cf853081)
- [Source Code](https://github.com/ricardojrmcom/fury)
- [Releases Page](https://github.com/ricardojrmcom/fury/releases)

<br />

### <b>Project Dependencies</b>

- <b>TS Package Boilerplate: [🟪 @ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)</b>
- <b>React Module Boilerplate: [🟣 @ricardojrmcom/supernova](https://github.com/ricardojrmcom/supernova)</b>

<br />

### <b>Dev Dependencies</b>

- `Yarn`
- `Typescript`
- `React`
- `Material-UI`
- `Prettier`
- `ESLint`
- `Commit Lint`
- `Lint Staged`
- `Husky`
- `Jest`
- `Semantic Release`

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/fury/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟣[@ricardojrmcom/supernova](https://github.com/ricardojrmcom/supernova)

<br />
npm package: @ricardojrmcom/mesmer
Description: Misc collection
Author: Ricardo Mota
Latest version: 2.0.0

<div align="center">

# 🎭 `@ricardojrmcom/mesmer`

<b>Misc Collection</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/mesmer/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/mesmer?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/mesmer?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/mesmer?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/mesmer?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```tsx
npm install @ricardojrmcom/mesmer

yarn add @ricardojrmcom/mesmer
```

<br />

### <b>Scripts</b>

```tsx
// install deps
yarn install

// run build
yarn build

// run lint
yarn lint

// run unit tests
yarn test
```

<br />

### <b>Project</b>

- [Project Page](https://l1b3r.notion.site/mesmer-85440962eefc4a59842950e4a3e916e2)
- [Source Code](https://github.com/ricardojrmcom/mesmer)
- [Releases Page](https://github.com/ricardojrmcom/mesmer/releases)

<br />

### <b>Project Dependencies</b>

- <b>TS Package Boilerplate: [🟪 @ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)</b>

<br />

### <b>Dev Dependencies</b>

- `Yarn`
- `Typescript`
- `Nodemon`
- `Prettier`
- `ESLint`
- `Commit Lint`
- `Lint Staged`
- `Husky`
- `Jest`
- `Semantic Release`

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/mesmer/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟪[@ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)

<br />
npm package: @ricardojrmcom/nebula
Description: Next Web App Boilerplate
Author: Ricardo Mota
Latest version: 4.2.0

<div align="center">

# 🌌 `@ricardojrmcom/nebula`

<b>Next web app boilerplate</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/nebula/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/nebula?style=for-the-badge)
![lang](https://img.shields.io/github/languages/top/ricardojrmcom/nebula?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

</div>

<br />

---

<br />

### <b>Bootstrap</b>

```tsx
npx @ricardojrmcom/nebula
```

Boilerplate `Next` web app bootstrapped with all necessary configs and workflows

<br />

### <b>Demo</b>

- <b>[Demo](https://nebula-ricardojrmcom.vercel.app/)</b>

<br />

### <b>Scripts</b>

```tsx
// install deps
yarn install

// run dev server
yarn dev

// build app
yarn build

// start app
yarn start

// export app
yarn export

// run lint
yarn lint

// run unit tests
yarn test

// run e2e tests
yarn cy:run

// run storybook
yarn sb
```

<br />

### <b>Project</b>

- [Project Page](https://l1b3r.notion.site/nebula-170cf8da5d77413cbff167bc0ba63444)
- [Source Code](https://github.com/ricardojrmcom/nebula)
- [Releases Page](https://github.com/ricardojrmcom/nebula/releases)

<br />

### <b>Project Dependencies</b>

- <b>TS Package Boilerplate: [🟪 @ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)</b>
- <b>React Module Boilerplate: [🟣 @ricardojrmcom/supernova](https://github.com/ricardojrmcom/supernova)</b>
- <b>Next Web App Boilerplate: [🌌 @ricardojrmcom/nebula](https://github.com/ricardojrmcom/nebula)</b>
- <b>TS Utility Scripts: [🌙 @ricardojrmcom/dervish](https://github.com/ricardojrmcom/dervish)</b>
- <b>React Utility Hooks: [🌘 @ricardojrmcom/reaper](https://github.com/ricardojrmcom/reaper)</b>
- <b>React MUI Themes: [🔥 @ricardojrmcom/fury](https://github.com/ricardojrmcom/fury)</b>
- <b>React Meta Data Handler: [⚫ @ricardojrmcom/pain](https://github.com/ricardojrmcom/pain)</b>
- <b>React API Client: [🌸 @ricardojrmcom/empathy](https://github.com/ricardojrmcom/empathy)</b>
- <b>React Lightweight Intl: [☁ @ricardojrmcom/echo](https://github.com/ricardojrmcom/echo)</b>
- <b>React Tooling Collection: [♠ @ricardojrmcom/ace](https://github.com/ricardojrmcom/ace)</b>

<br />

### <b>Dev Dependencies</b>

- `Yarn`
- `Typescript`
- `React`
- `Material-UI`
- `Next`
- `Prettier`
- `ESLint`
- `Commit Lint`
- `Lint Staged`
- `Husky`
- `Jest`
- `React Testing Library`
- `Cypress`
- `Storybook`
- `Webpack`
- `Semantic Release`

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/nebula/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🌌[@ricardojrmcom/nebula](https://github.com/ricardojrmcom/nebula)

<br />
npm package: @ricardojrmcom/nova
Description: Typescript NPM Package Boilerplate
Author: Ricardo Mota
Latest version: 5.0.0

<div align="center">

# 🟪 `@ricardojrmcom/nova`

<b>Typescript NPM Package Boilerplate</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/nova/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/nova?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/nova?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/nova?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/nova?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Bootstrap</b>

```tsx
npx @ricardojrmcom/nova
```

Boilerplate `TypeScript` project bootstrapped with all necessary configs and workflows

<br />

### <b>Workflows</b>

Quality Assurance

- Will lint code and run tests
- Runs on `pull_request` sync and `push` to `main`

Release

- Will create a GitHub release with auto generated versioning and changelog
- Will publish the package to the public NPM registry
- Runs on `push` to `main` and after the QA job

Publish to GitHub (Public)

- Will publish the package to the public GitHub registry
- Runs on `workflow_dispatch`

<br />

---

<br />

### <b>Install</b>

```tsx
npm install @ricardojrmcom/nova

yarn add @ricardojrmcom/nova
```

<br />

### <b>Usage</b>

```tsx
import { example, exampleType } from '@ricardojrmcom/nova';

example();
```

<br />

### <b>Scripts</b>

```tsx
// install deps
yarn install

// run dev
yarn dev

// run build
yarn build

// run lint
yarn lint

// run unit tests
yarn test
```

<br />

### <b>Project</b>

- [Project Page](https://l1b3r.notion.site/nova-564cb6e6b3c54345934a5cb1a59ebb0f)
- [Source Code](https://github.com/ricardojrmcom/nova)
- [Releases Page](https://github.com/ricardojrmcom/nova/releases)

<br />

### <b>Project Dependencies</b>

- <b>TS Package Boilerplate: [🟪 @ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)</b>

<br />

### <b>Dev Dependencies</b>

- `Yarn`
- `Typescript`
- `Nodemon`
- `Prettier`
- `ESLint`
- `Commit Lint`
- `Lint Staged`
- `Husky`
- `Jest`
- `Semantic Release`

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/nova/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟪[@ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)

<br />
npm package: @ricardojrmcom/number-format
Description: Format numbers
Author: Ricardo Mota
Latest version: 2.1.0

<div align="center">

# 🌙 `@ricardojrmcom/number-format`

<b>Format numbers</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/number-format/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/number-format?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/number-format?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/number-format?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/number-format?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```ts
npm install @ricardojrmcom/number-format

yarn add @ricardojrmcom/number-format
```

<br />

### <b>Usage</b>

```ts
import { numberFormat } from '@ricardojrmcom/number-format'

numberFormat(1337)
-> "1,337"

```

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/number-format/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟪[@ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)

<br />
npm package: @ricardojrmcom/pain
Description: React meta data utility
Author: Ricardo Mota
Latest version: 3.0.0

<div align="center">

# ⚫ `@ricardojrmcom/pain`

<b>React meta data utility</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/pain/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/pain?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/pain?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/pain?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/pain?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```ts
npm install @ricardojrmcom/pain

yarn add @ricardojrmcom/pain
```

<br />

### <b>Usage</b>

```ts
import { usePain, PainProvider, PainRecord } from '@ricardojrmcom/pain';

// app
const examplePain: PainRecord = {
  default: { name: 'Default' },
  pain1: { name: 'pain 1' },
  pain2: { name: 'pain 2' },
};

<PainProvider pain={examplePain} painDefault="default">
  {...}
</PainProvider>


// component
const { painActive, painActiveId, painSetById } = usePain();
```

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/pain/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟣[@ricardojrmcom/supernova](https://github.com/ricardojrmcom/supernova)

<br />
npm package: @ricardojrmcom/phantasma-ts
Description: <div align="center">
Latest version: 1.0.2

<div align="center">

# 🟪 `@ricardojrmcom/phantasma-ts`

<b>Phantasma TS</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/nova/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/nova?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/nova?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/nova?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/nova?style=for-the-badge)

</div>

<br />

---

#### <b>Original package: [phantasma-ts](https://github.com/phantasma-io/phantasma-ts)</b>

<br />

### <b>Install</b>

```tsx
npm install @ricardojrmcom/phantasma-ts

yarn add @ricardojrmcom/phantasma-ts
```

<br />
npm package: @ricardojrmcom/reaper
Description: React utility
Author: Ricardo Mota
Latest version: 2.0.0

<div align="center">

# 🌘 `@ricardojrmcom/reaper`

<b>React utility</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/reaper/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/reaper?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardo--jrm)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/reaper?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/reaper?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/reaper?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```ts
npm install @ricardojrmcom/reaper

yarn add @ricardojrmcom/reaper
```

<br />

### <b>Usage</b>

```ts
import {
  useDateFormat,
  useDateRelative,
  useHexRgb,
  useRgbHex,
  useLocalState,
  useNumberFormat,
  useStringCapitalize,
  useStringTruncate,
} from '@ricardojrmcom/reaper';
```

<br />

### <b>Packages</b>

- [@ricardojrmcom/use-color-converter](https://github.com/ricardojrmcom/use-color-converter)
- [@ricardojrmcom/use-date-format](https://github.com/ricardojrmcom/use-date-format)
- [@ricardojrmcom/use-local-state](https://github.com/ricardojrmcom/use-local-state)
- [@ricardojrmcom/use-number-format](https://github.com/ricardojrmcom/use-number-format)
- [@ricardojrmcom/use-string-capitalize](https://github.com/ricardojrmcom/use-string-capitalize)
- [@ricardojrmcom/use-string-truncate](https://github.com/ricardojrmcom/use-string-truncate)

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/reaper/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟣[@ricardojrmcom/supernova](https://github.com/ricardojrmcom/supernova)

<br />
npm package: @ricardojrmcom/string-capitalize
Description: Capitalize strings
Author: Ricardo Mota
Latest version: 2.1.0

<div align="center">

# 🌙 `@ricardojrmcom/string-capitalize`

<b>Typescript NPM Package Boilerplate</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/string-capitalize/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/string-capitalize?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/string-capitalize?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/string-capitalize?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/string-capitalize?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```ts
npm install @ricardojrmcom/string-capitalize

yarn add @ricardojrmcom/string-capitalize
```

<br />

### <b>Usage</b>

Capitalizes the first character of a given string. Option to capitalize all words.

```ts
import { stringCapitalize } from '@ricardojrmcom/string-capitalize'

stringCapitalize('lorem ipsum dolor sit amet');
-> "Lorem ipsum dolor sit amet"

stringCapitalize('lorem ipsum dolor sit amet', true);
-> "Lorem Ipsum Dolor Sit Amet"
```

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/string-capitalize/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟪[@ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)

<br />
npm package: @ricardojrmcom/string-truncate
Description: Truncate strings
Author: Ricardo Mota
Latest version: 3.0.2

<div align="center">

# 🌙 `@ricardojrmcom/string-truncate`

<b>Truncate strings</b>

![build](https://img.shields.io/github/workflow/status/ricardojrmcom/string-truncate/Continuous%20Integration?style=for-the-badge)
![license](https://img.shields.io/github/license/ricardojrmcom/string-truncate?style=for-the-badge)

![author](<https://img.shields.io/badge/Author-Ricardo%20%3Cl1b3r__--%3E%20Mota%20(%40ricardojrmcom)-orange?style=for-the-badge>)

![lang](https://img.shields.io/github/languages/top/ricardojrmcom/string-truncate?style=for-the-badge)
![version](https://img.shields.io/npm/v/@ricardojrmcom/string-truncate?style=for-the-badge)
![size](https://img.shields.io/bundlephobia/min/@ricardojrmcom/string-truncate?style=for-the-badge)

</div>

<br />

---

<br />

### <b>Install</b>

```ts
npm install @ricardojrmcom/string-truncate

yarn add @ricardojrmcom/string-truncate
```

<br />

### <b>Usage</b>

Truncates string to fit within given length with appended ellipsis. Option to keep last word.

```ts
import { stringTruncate } from '@ricardojrmcom/string-truncate'

stringTruncate('Lorem ipsum dolor sit amet', 20);
-> "Lorem ipsum dolor..."

stringTruncate('Lorem ipsum dolor sit amet', 20, true);
-> "Lorem ipsum ... amet"
```

<br />

---

<br />

### <b>License</b>

[MIT](https://github.com/ricardojrmcom/string-truncate/blob/main/LICENSE) © Ricardo <l1b3r\_-> Mota ([@ricardojrmcom](https://github.com/ricardojrmcom))

Bootstrapped with 🟪[@ricardojrmcom/nova](https://github.com/ricardojrmcom/nova)

<br />