open-index/open-npm huggingface dataset:
npm package: @pedroloch/tuner
Description: A javascript library to create a chromatic tuner that uses the ml5 pitch detection algorithm.
Author: Pedro Loch
Latest version: 1.0.2

# Tuner

A javascript library to create a chromatic tuner that uses the [ml5](https://ml5js.org) pitch detection algorithm.

### Instalation

```
npm install --save @pedroloch/tuner
```

### Usage

```javascript
import createTuner from '@pedroloch/tuner'

// Creating the tuner
const tuner = createTuner()

// Starts to listen to the frequencies captured by the microfone.
tuner.start()

// Turns off the microfone and stops sending data.
tuner.stop()

// Check if the tuner is on or off.
tuner.isOn // return true or false

```

Getting the data:
```javascript
tuner.getData((data) => {
  console.log(data) // => {frequency: 220.47996157982865, pitch: 220, note: "A", diff: 7}
})
```

The data comes in an event format, containing the following information:

| Property      | Description |
| ----------- | ----------- |
| frequency      | The raw frequency captured by the microfone       |
| pitch   | The closest pitch. Ex: (440)        |
| note | The name of the note related to the closest pitch. Ex: (A)|
|diff| How far from the correct pitch is the raw frequency. This is a percentage value and can be negative (flat) or positive (sharp).  |


## The MIT License (MIT)
Copyright © 2021 Pedro Loch

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
npm package: @pedromontanes/motivales-nuxt-module-v2
Description: My new Nuxt module
Latest version: 1.0.34

<!--
Get your module up and running quickly.

Find and replace all on all files (CMD+SHIFT+F):
- Name: My Module
- Package name: my-module
- Description: My new Nuxt module
-->

# My Module

[![npm version][npm-version-src]][npm-version-href]
[![npm downloads][npm-downloads-src]][npm-downloads-href]
[![License][license-src]][license-href]
[![Nuxt][nuxt-src]][nuxt-href]

My new Nuxt module for doing amazing things.

- [✨ &nbsp;Release Notes](/CHANGELOG.md)
<!-- - [🏀 Online playground](https://stackblitz.com/github/your-org/my-module?file=playground%2Fapp.vue) -->
<!-- - [📖 &nbsp;Documentation](https://example.com) -->

## Features

<!-- Highlight some of the features your module provide here -->
- ⛰ &nbsp;Foo
- 🚠 &nbsp;Bar
- 🌲 &nbsp;Baz

## Quick Setup

Install the module to your Nuxt application with one command:

```bash
npx nuxi module add my-module
```

That's it! You can now use My Module in your Nuxt app ✨


## Contribution

<details>
  <summary>Local development</summary>
  
  ```bash
  # Install dependencies
  npm install
  
  # Generate type stubs
  npm run dev:prepare
  
  # Develop with the playground
  npm run dev
  
  # Build the playground
  npm run dev:build
  
  # Run ESLint
  npm run lint
  
  # Run Vitest
  npm run test
  npm run test:watch
  
  # Release new version
  npm run release
  ```

</details>


<!-- Badges -->
[npm-version-src]: https://img.shields.io/npm/v/my-module/latest.svg?style=flat&colorA=020420&colorB=00DC82
[npm-version-href]: https://npmjs.com/package/my-module

[npm-downloads-src]: https://img.shields.io/npm/dm/my-module.svg?style=flat&colorA=020420&colorB=00DC82
[npm-downloads-href]: https://npmjs.com/package/my-module

[license-src]: https://img.shields.io/npm/l/my-module.svg?style=flat&colorA=020420&colorB=00DC82
[license-href]: https://npmjs.com/package/my-module

[nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js
[nuxt-href]: https://nuxt.com
npm package: @pedromontanes/motivales-nuxt2
Description: My new Nuxt module
Latest version: 1.0.11

<!--
Get your module up and running quickly.

Find and replace all on all files (CMD+SHIFT+F):
- Name: My Module
- Package name: my-module
- Description: My new Nuxt module
-->

# My Module

[![npm version][npm-version-src]][npm-version-href]
[![npm downloads][npm-downloads-src]][npm-downloads-href]
[![License][license-src]][license-href]
[![Nuxt][nuxt-src]][nuxt-href]

My new Nuxt module for doing amazing things.

- [✨ &nbsp;Release Notes](/CHANGELOG.md)
<!-- - [🏀 Online playground](https://stackblitz.com/github/your-org/my-module?file=playground%2Fapp.vue) -->
<!-- - [📖 &nbsp;Documentation](https://example.com) -->

## Features

<!-- Highlight some of the features your module provide here -->
- ⛰ &nbsp;Foo
- 🚠 &nbsp;Bar
- 🌲 &nbsp;Baz

## Quick Setup

Install the module to your Nuxt application with one command:

```bash
npx nuxi module add my-module
```

That's it! You can now use My Module in your Nuxt app ✨


## Contribution

<details>
  <summary>Local development</summary>
  
  ```bash
  # Install dependencies
  npm install
  
  # Generate type stubs
  npm run dev:prepare
  
  # Develop with the playground
  npm run dev
  
  # Build the playground
  npm run dev:build
  
  # Run ESLint
  npm run lint
  
  # Run Vitest
  npm run test
  npm run test:watch
  
  # Release new version
  npm run release
  ```

</details>


<!-- Badges -->
[npm-version-src]: https://img.shields.io/npm/v/my-module/latest.svg?style=flat&colorA=020420&colorB=00DC82
[npm-version-href]: https://npmjs.com/package/my-module

[npm-downloads-src]: https://img.shields.io/npm/dm/my-module.svg?style=flat&colorA=020420&colorB=00DC82
[npm-downloads-href]: https://npmjs.com/package/my-module

[license-src]: https://img.shields.io/npm/l/my-module.svg?style=flat&colorA=020420&colorB=00DC82
[license-href]: https://npmjs.com/package/my-module

[nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js
[nuxt-href]: https://nuxt.com
npm package: @pedronauck/gatsby-theme-blog
Description: Base blog theme functionality for Gatsby
Author: John Otander
Latest version: 1.0.4

# Blog base

> :warning: This is experimental and subject to breaking changes.

## Installation

```sh
yarn add gatsby-theme-blog-base
```

## Usage

```js
// gatsby-config.js
module.exports = {
  return {
    __experimentalThemes: [
      {
        resolve: 'gatsby-theme-blog-base',
        options: {
          postsPath: '/writing'
        }
      }
    ]
  }
}
```

### Configuration

Key | Default | Description
--- | --- | ---
`postsPath` | `/blog` | Path for blog posts listings (`/blog`, `/blog/2`, etc.)
`postsPerPage` | `99999` | Number of posts on each page
npm package: @pedropmatt/easy-image-optimization
Description: An image optimizer using semantic html and shadow dom
Author: Pedro M
Latest version: 0.0.17


# Easy image optimization

It's a abstraction of image optimization using semantic html and optimization alghoritms with canvas, just give the source and get a optimized image in your selected resolutions to use as a component in your vue and react projects.
## Features

- Optimize image
- Resize
- Provides a webp image
- Works on javascript-based projects


## Instalation (Vue 3)

Install the project

```bash
  npm i @pedropmatt/easy-image-optimization
```
Import the script that will construct the component
```bash
  import "@pedropmatt/easy-image-optimization"
```
Just use it
```bash
  <opt-image :image-url="imageUrl" :resolutions="[200, 550, 1366]" />
```

## Instalation (React)

I'm trying to improve this instalation

```bash
  npm i @pedropmatt/easy-image-optimization
```

Import the script that will construct the component

```javascript
  useEffect(() => {
      import("@pedropmatt/easy-image-optimization")
  })
```

Just use it
```bash
  <opt-image :image-url="imageUrl" :resolutions="[200, 550, 1366]" />
```

    
## Usage (Vue 3)

```typescript
<script lang="ts" setup>
import "@pedropmatt/easy-image-optimization"

const imageUrl = computed(() => 'https://cdn.pixabay.com/photo/2023/12/14/07/44/dog-8448345_1280.jpg')
const resolutions = computed(() => [200, 550, 1366])
</script>

<template>
    <opt-image :image-url="imageUrl" :resolutions="resolutions" />
</template>
```

## Usage (React)

React will be display an error on your IDE, but the component works, I've be working hard to solve this problem and improve the instalation

```typescript
import { useEffect } from 'react'

const YourComponent = ({ imageUrl: string, resolutions: number[] | string[] }) => {
    useEffect(() => {
        import("@pedropmatt/easy-image-optimization")
    })

    return <opt-image image-url={imageUrl} :resolutions={resolutions} />
}

export default YourComponent
```


## Contributing

It's my first lib, I'm very happy that you want to contribute :)

Welcome! I'm happy to receive contributions to improve this library. Your help is valuable to me and the possible community that we will construct.

See the `contribution.md` to start.


## Roadmap

- Improve load image delay.

- Lazyloads, decoding and dynamic fetchpriority.

- Improve otimization using noise and alpha compose.

- Skeleton image.

- Improve instalation on projects.

- SSR support.

## Autor

- [@pedroMattos](https://github.com/pedroMattos)
npm package: @pedrorfernandes/shared-store-service
Description: A WebdriverIO service to exchange data across processes
Author: Mykola Grybyk
Latest version: 8.6.8

WebdriverIO Shared Store Service
=========================

> Exchange data between main process and workers (specs).

## Installation

The easiest way is to keep `@wdio/shared-store-service` as a dev dependency in your `package.json`, via:

```sh
npm install @wdio/shared-store-service --save-dev
```

Instructions on how to install `WebdriverIO` can be found [here.](https://webdriver.io/docs/gettingstarted)

## Usage

Get/set a value (a plain object) to/from the store by key (string). The key can be any arbitrary string except `*` which is reserved as it allows you to fetch the whole store.

### Set Values

To set values to the store call:

```js
await browser.sharedStore.set('key', 'foobar123')
```

### Get Values

To get values from the store call:

```js
const value = await browser.sharedStore.get('key')
console.log(value) // returns "foobar123"
```

You can also fetch all key values by using the `*` key:

```js
const store = await browser.sharedStore.get('*')
console.log(value) // returns `{ key: "foobar" }`
```

### Access Store in WDIO Hooks

You could also directly access to `setValue` and `getValue` async handlers.
Make sure you properly call them with the `await` keyword.

```js
// wdio.conf.js
import { setValue, getValue } from '@wdio/shared-store-service'

export const config = {
    // ...
    onPrepare: [async function (config, capabilities) {
        await setValue('foo', 'bar')
    }],
    // ...
    after: async () => {
        const value = await getValue('foo')
        // ...
    }
```

IMPORTANT! Every spec file should be atomic and isolated from others' specs.
The idea of the service is to deal with very specific environment setup issues.
Please avoid sharing test execution data!

### Resource Pools

If the worker threads are competing for resources that must be assigned for each worker, you can use Resource Pool API:

```js
// wdio.conf.js
import { setResourcePool, getValueFromPool, addValueToPool } from '@wdio/shared-store-service'

export const config = {
    maxInstances: 2,
    // ...
    onPrepare: async function (config, capabilities) {
        await setResourcePool('availableUrls', ['url01.com', 'url02.com'])
    },
    // ...
    beforeSession: async (conf) => {
        conf.baseUrl = await getValueFromPool('availableUrls');
    },
    // ...
    afterSession: async (conf) => {
        // worker returns the used resource for next workers to use
        await addValueToPool('availableUrls', conf.baseUrl);
    }
```

This example ensures that both workers never use the same `baseUrl`. A unique url is only assigned to one worker until it's released by it.

## Configuration

Add `shared-store` to the services list and the `sharedStore` object will be accessible to you on the [`browser` scope](https://webdriver.io/docs/api/browser) in your test.

```js
// wdio.conf.js
export const config = {
    // ...
    services: ['shared-store'],
    // ...
};
```
npm package: @pedroribeiro89/angular-cep
Description: An Angular CEP(Brazilian ZIP code) input field
Author: pedroribeiro89
Latest version: 1.0.1

# AngularCEP

An Angular CEP(Brazilian ZIP code) input field

## Dependencies

* [Angular](https://angular.io)
* [Material](https://material.angular.io/)

## Features

* Native Input 
* Material Input
* Load Address using [Viacep](https://viacep.com.br/)

## Installation

After install the dependencies, install `angular-cep`:

```shell
npm install @pedroribeiro89/angular-cep --save
```

Once installed, import AngularCepModule in your application module:
```js
import { AngularCepModule } from 'angular-cep';

@NgModule({
  declarations: [AppComponent, ...],
  imports: [AngularCepModule, ...],  
  bootstrap: [AppComponent]
})
export class AppModule {}
```

#### Native Input:
```html
  <angular-cep (onLoadCEP)="loadedCep($event)"></angular-cep>
```

#### Material Input:
```html
  <angular-cep-material label="Digite seu CEP" (onLoadCEP)="loadedCep($event)"></angular-cep-material>
```


## Contributing

I would love for improvements ideas and bug reports (leave in github issues).
npm package: @pedroruiz/flag
Description: Flag class to get countries flags in React
Author: Pedro Ruiz Hidalgo
Latest version: 1.0.0

# Flag.js

Flag js is a class for build to run in React to get countries flag with a simple sintax and effective renter time.

##Dependencies
It has only three dependencies:
* React (obviously)
* prop-types
* flag-icon-css

##Use
Simply do \<Flag flag="string"> when string is the code of the flag you want. As I use 'bg' as 'en' this translate every 'en' in 'gb' flag. You can delete this if not runs well for you.
npm package: @pedroruiz/validator
Description: Simple and effective Validator
Author: Pedro Ruiz Hidalgo
Latest version: 1.0.1

Validator.js
------------
Simple and very effective validator for JavaScript 

Usage
-----

`import Validator from '[your-validator-path]`

or

`var validator = require([here-your-validator-path])`

- [type](#type)
- [isString](#isString)
- [isAlphaNumeric](#isAlphaNumeric)
- [isNumber](#isNumber)
- [isObject](#isObject)
- [isBoolean](#isBoolean)
- [isDate](#isDate)
- [isEmail](#isEmail)
- [length](#length)
- [lengthMoreThan](#lengthMoreThan)
- [lengthLessThan](#lengthLessThan)
- [lengthEqualTo](#lengthEqualTo)
- [passwordMatch](#passwordMatch)
- [regExp](#regExp)

<a name="Type">Type</a>
-

`Validator(your_variable).type();`

<a name="isString">isString</a>
-
`Validator('hello world').isString();`

<a name="isAlphaNumeric">isAlphaNumeric</a>
-
`Validator('helloWorld).isAlphaNumeric();`

<a name="isNumber">isNumber</a>
-
`Validator(3.14).isNumber();`

<a name="isObject">isObject</a>
-
`Validator([1,2,3]).isObject();`

<a name="isBoolean">isBoolean</a>
-
`Validator(true).isBoolean();`

<a name="isDate">isDate</a>
-
`Validator('12/15/2019).isDate('eu');`
`Validator('15/12/2019).isDate('us');`

<a name="isEmail">isEmail</a>
-
`Validator('e@ma.il').isEmail();`

<a name="length">length</a>
-
`Validator('hellow orld').length();`

<a name="lengthMoreThan">lengthMoreThan</a>
-
`Validator('world').lengthMoreThan(3);`

<a name="lengthLessThan">lengthLessThan</a>
-
`Validator('world').lengthLessThan(8);`

<a name="lengthEqualTo">lengthEqualTo</a>
-
`Validator('world').lengthEqualTo(5);`

<a name="passwordMatch">passwordMatch</a>
-
`Validator('password').passwordMatch('password');`

<a name="regExp">regExp</a>
-
`Validator('HelloWorld').regExp(/^[a-z0-9]+$/i)`

Enjoy.
npm package: @pedrosolabs/envars
Description: envars
Author: Pedroso Labs
Latest version: 0.2.0

# Tools for managing Environment Variables

This package implements code for managing environment variables

## Installation

```bash
yarn add @plabs/envars
```

## Example

```ts
import { initEnvars } from '@plabs/envars';

const envars = {
  APP_NAME: '',
};

// load APP_NAME from process.env
initEnvars(envars);
```
npm package: @pedrosolabs/rnbasecomps
Description: Base components for React Native projects
Author: Pedroso Labs
Latest version: 1.5.0

# React Native Base Components

This project includes some components to assit on the development of React Native apps.

Components:

- BaseButton -- Button
- BaseCheckbox -- Check box
- BaseHorizBar -- Horizontal bar
- BaseIcon -- Icon from Material or Ion groups
- BaseImage -- Image
- BaseInfoTextScreen -- Screen to show some info text
- BaseInput -- Text input
- BaseLink -- Link
- BaseModal -- Modal window
- BasePicker -- Selection of items
- BaseSpacer -- Screen spacer
- BaseSpinnerScreen -- Screen showing spinner centered
- BaseSpinner -- Spinner (activity indicator)

HOCs:

- withBanner -- Screen with banner (hero) on top
- withNavTitle -- Set the title of the navigation bar
- withNTSV.tsx -- With Navigation Title and Scroll View
- withScrollView -- Screen with scroll view

## Installation

```bash
yarn add @pedrosolabs/rnbasecomps
```

## Execution

Run (in this order, and in two different terminals):

```bash
yarn start
```

```bash
yarn rn run-android
```

In a third terminal, you can log using:

```bash
yarn rn log-android
```
npm package: @pedrosolabs/translate
Description: Simpler i18n alternative
Latest version: 1.1.1

[![CircleCI](https://circleci.com/gh/pedrosolabs/translate.svg?style=svg)](https://circleci.com/gh/pedrosolabs/translate)


# Translate
Simplest i18n implementation ever.

# Usage
```javascript
const resources = {
  en: {
    home: {
      title: 'Welcome!',
    },
    err: {
      fallback: 'INVALID RESOURCE',
    },
  },
  pt: {
    home: {
      title: 'Bem vindo!',
    },
    err: {
      fallback: 'RECURSO DESCONHECIDO',
    },
  },
};

const { getLanguage, setLanguage, t } = makeTranslator(resources, 'en', 'ERROR');
t('home.title'); // returns 'Welcome!'
t('home.whatever'); // returns 'INVALID RESOURCE'
t('home.whatever', 'default'); // returns 'default'

// Change language
setLanguage('pt');
t('home.title'); // returns 'Bem vindo!'
t('home.whatever'); // returns 'RECURSO DESCONHECIDO'
t('home.whatever', 'default'); // returns 'default'

// Unknown language
setLanguage('zy');
t('home.title'); // returns 'ERROR'
t('home.whatever'); // returns 'ERROR'
t('home.whatever', 'default'); // returns 'default'
```
npm package: @pedrosox/envars
Description: envars
Author: Pedroso Labs
Latest version: 0.1.0

# Tools for managing Environment Variables

This package implements code for managing environment variables

## Installation

```bash
yarn add @pedrosox/envars
```

## Example

```ts
import { initEnvars } from '@pedrosox/envars';

const envars = {
  APP_NAME: '',
};

// load APP_NAME from process.env
initEnvars(envars);
```
npm package: @pedrosox/envars-cli
Description: envars-cli
Author: Pedroso Labs
Latest version: 0.1.0

# envars-cli

envars-cli CLI is a tool to ...

## Example of darabase (envars.json)

```json
{
  "myapp": {
    "dev": {
      "APP_NAME": "my application 😄",
      "EMPTY_VAR": ""
    },
    "prod": {
      "APP_NAME": "my application 😄 [production]",
      "EMPTY_VAR": "<must-not-be-empty>"
    }
  }
}
```

## Dependencies

- chalk — colorizes the output
- clui — draws command-line tables, gauges and spinners
- figlet — creates ASCII art from text
- inquirer — creates interactive command-line user interface
- minimist — parses argument options
- configstore — easily loads and saves config without you having to think about where and how.
npm package: @pedrouid/environment
Description: Environment utilities
Author: Pedro Gomes
Latest version: 1.0.1

# environment [![npm version](https://badge.fury.io/js/%40pedrouid%2Fenvironment.svg)](https://badge.fury.io/js/%40pedrouid%2Fenvironment)

Environment utilities

## Description

This library provides utilties to detect environment for Browser, NodeJS and React-Native

## Usage

```typescript
import * as env from 'environment';

// true for NodeJS
env.isNode();

// true for React-Native
env.isReactNative();

// true for Browser
env.isBrowser();
```

## License

[MIT License](LICENSE.md)
npm package: @pedrouid/iso-store
Description: Isomorphic Key-Value Store
Author: Pedro Gomes
Latest version: 1.1.0
Deprecated: Deprecated in favor of keyvaluestorage

# iso-store [![npm version](https://badge.fury.io/js/%40pedrouid%2Fiso-store.svg)](https://badge.fury.io/js/%40pedrouid%2Fiso-store)

Isomorphic Key-Value Store
npm package: @pedrouid/pino-utils
Description: Standard Pino Utils for Context and PrettyPrint
Author: Pedro Gomes
Latest version: 1.0.1

# pino-utils [![npm version](https://badge.fury.io/js/%40pedrouid%2Fpino-utils.svg)](https://badge.fury.io/js/%40pedrouid%2Fpino-utils)

Standard Pino Utils for Context and PrettyPrint
npm package: @pedroviniv/agm-core
Description: Angular components for Google Maps
Author: Sebastian Holstein
Latest version: 1.0.0-beta.9

Angular Google Maps (AGM) Core - Angular 2+ Google Maps components
=========

@pedroviniv/agm-core contains solutions for the Google Maps JavaScript Core API.

The sources for this package are in the [angular-google-maps](https://github.com/SebastianM/angular-google-maps) repository. Please file issues and pull requests against that repo.

This package contains different sources for different users:

1. The files located in the root dirare ES5 based with ES2015 modules.
1. Files with the name pattern *.umd.js are UMD bundled modules for fast load times during development.

License: See LICENSE file in this folder.
npm package: @pedrovitor48/reverse
Description: Reverses a string
Author: Pedro Vitor
Latest version: 0.0.0

<div align="center">
  <img src="https://avatars2.githubusercontent.com/u/61063724?s=200&v=4" width="100px">
</div>

<br />

<div align="center">
  <h1>@pedrovitor48/reverse</h1>
  <p>Reverses a string</p>
</div>

<br />

<div align="center">

[![typescript-image]][typescript-url] [![jest-image]][jest-url] [![npm-image]][npm-url]

</div>

## Setup

1. Make a shallow clone of this project in the desired folder, renaming it (replace `<MY_LIB_NAME>` in any of the examples below for your project's name):
  - Using SSH: `git clone --depth 1 git@github.com:soufantech/node-ts-lib-boilerplate.git <MY_LIB_NAME>`.
  - Using HTTPS: `git clone --depth 1 https://github.com/soufantech/node-ts-lib-boilerplate.git <MY_LIB_NAME>`.
2. Step into the recently cloned project and erase the .git directory completely.
3. Make the required and optional overrides as described further below.
4. Create a new repository with `git init` and commit your files.

### **Required** overrides:

You **must**...

1. update `author`, `repository`, `homepage`, `bugs`, `name` and `version` fields in `package.json`.
2. delete or replace demo files: `rm src/index.ts src/simple-math.ts src/__tests__/simple-math.test.ts`.
3. rewrite this `README.md` (after reading it);

### **Optional** overrides:

You might want to...

- set the `license` field (default is `UNLICENSED`). You may also include a `LICENSE` file on the root folder.
- set the `publishConfig.access`to `public` if your package is not meant to be published as a private package.
- set the `private` field to `false` in order to publish the package.
- set the `repository` field.
- remove the `test` command along with the `jest` dependency if your project is not meant to include automated tests.
- run `yarn upgrade --latest` to generate a fresh `yarn.lock` and upgrade all dependencies listed in your `package.json`.
- exclude the `.npmrc` file or modify it if you're not using a SouFan NPM registry token (typically `SOUFAN_NPM_TOKEN`)

In addition to `package.json`, you might also want to check...

- the `.npmignore` file for the files that will be ignored on publishing.
- the test runner options on the `jest.config.js` file.
- the linter rules in the `eslintrc.yml` file.
- the general editor configuration on the `.editorconfig` file.

---

<div align="center">
  <sub>Built with ❤︎ by <a href="https://soufan.com.br">SouFan</a>
</div>

[typescript-image]: https://img.shields.io/badge/Typescript-294E80.svg?style=for-the-badge&logo=typescript
[typescript-url]: "typescript"

[npm-image]: https://img.shields.io/npm/v/@pedrovitor48/reverse.svg?style=for-the-badge&logo=npm
[npm-url]: https://npmjs.org/package/@pedrovitor48/reverse "npm"

[jest-image]: https://img.shields.io/badge/tested_with-jest-99424f.svg?style=for-the-badge&logo=jest
[jest-url]: https://github.com/facebook/jest "jest"
npm package: @pedrovs3-test/react-router
Description: This is a simple, lightweight, and flexible routing library for React applications. It provides a set of components and hooks to handle routing in your application, including support for dynamic routes with path parameters.
Author: pedrovs3
Latest version: 0.0.44

# @pedrovs3/react-router

Esta é uma biblioteca de roteamento simples, leve e flexível para aplicações React. Ela fornece um conjunto de
componentes e hooks para lidar com o roteamento em sua aplicação, incluindo suporte para rotas dinâmicas com parâmetros
na URL.

## Recursos

- **API Simples**: Basta envolver sua aplicação com o componente `Router` e usar o componente `Route` para definir suas
  rotas.
- **Rotas Dinâmicas**: Defina facilmente rotas com parâmetros de caminho, como "/user/:id". O componente `Route`
  extrairá automaticamente esses parâmetros e os passará para o seu componente.
- **Query Params**: Acesse os query params de seus componentes com o hook `useRouterContext`.
- **Página 404**: Defina uma página 404 personalizada que será exibida quando nenhuma rota corresponder.
- **Guarded routes**: Defina rotas que só podem ser acessadas se o usuário estiver autenticado.
- **Hooks**: Possui hooks para acessar o histórico de navegação e o contexto do roteador.
- **Metadata**: Defina metadados para suas rotas, como por exemplo, título da página e descrição para melhorar o `SEO`.
- **Lazy loading**: Suporte para carregamento assíncrono de componentes.
- **Suporte ao TypeScript**: Todos os componentes e hooks são totalmente tipados.

## Instalação

Você pode instalar esta biblioteca com npm:

```
npm install @pedrovs3/react-router
```

## Uso

Aqui está um exemplo básico de como usar esta biblioteca:

```typescriptreact
import { Router, Route } from '@pedrovs3/react-router';
import { lazy } from 'react';

// Example with lazy loading
const About = lazy(() => import('./About'));

const App = () => (
  <Router>
    <Route path="/home" component={Home} />
    <Route 
      path="/about" 
      component={About}
      metadata={{ title: "About page" }} 
    />
    <Route path="/user/:id" component={User} />
    <Route path="*" component={NotFound} />
  </Router>
);
```

Neste exemplo, `Home`, `About`, `User` e `NotFound` são seus componentes. O componente `User` receberá uma
prop `pathParams` com o id da URL.

## Por que usar esta biblioteca?

Esta biblioteca foi criada para ser uma alternativa simples e leve ao React Router. Ela não possui muitos recursos,
mas é fácil de usar e tem um tamanho menor do que o React Router.

## Autor

[Pedro Vieira](https://github.com/pedrovs3)

## Contribuindo

Se você quiser contribuir com este projeto, sinta-se à vontade para abrir uma issue ou enviar um pull request.

## Licença

MIT
npm package: @pedrozaalex/colors
Description: Color stuff helper functions
Author: Alexandre Pedroza
Latest version: 1.0.5

# Colors

This is a package providing some color utilities. The brunt of the work was taken from [here](https://github.com/ozh/github-colors), I simply extended it with a random deterministic color for languages not found in GitHub's definition files.

There are also some light functionalities like converting from hex to hsl color formats.