open-index/open-npm huggingface dataset:
npm package: @riadh-adrani/array-utils
Description: Javascript arrays utilities
Latest version: 1.0.3

# array-utils [![npm](https://img.shields.io/npm/v/@riadh-adrani/array-utils?array=blue)](https://www.npmjs.com/package/@riadh-adrani/array-utils) [![CI/CD](https://github.com/RiadhAdrani/array-utils/actions/workflows/checks.yml/badge.svg)](https://github.com/RiadhAdrani/array-utils/actions/workflows/checks.yml)

Javascript array utilities.

Check documentation [`here`](https://riadhadrani.github.io/utility-js/arrays.html)
npm package: @riadh-adrani/async-utils
Description: Javascript asynchronous utilities
Latest version: 1.0.2

# async-utils [![npm](https://img.shields.io/npm/v/@riadh-adrani/async-utils?async=blue)](https://www.npmjs.com/package/@riadh-adrani/async-utils) [![CI/CD](https://github.com/RiadhAdrani/async-utils/actions/workflows/checks.yml/badge.svg)](https://github.com/RiadhAdrani/async-utils/actions/workflows/checks.yml)

Javascript asynchronous utilities.

Check documentation [`here`](https://riadhadrani.github.io/utility-js/async.html)
npm package: @riadh-adrani/color-utils
Description: Javascript colors utilities
Latest version: 1.0.2

# color-utils [![npm](https://img.shields.io/npm/v/@riadh-adrani/color-utils?color=blue)](https://www.npmjs.com/package/@riadh-adrani/color-utils) [![CI/CD](https://github.com/RiadhAdrani/color-utils/actions/workflows/checks.yml/badge.svg)](https://github.com/RiadhAdrani/color-utils/actions/workflows/checks.yml)

Javascript color utilities.

Check documentation [`here`](https://riadhadrani.github.io/utility-js/colors.html)
npm package: @riadh-adrani/create-package
Description: creates a starter package with Typescript.
Author: RiadhAdrani
Latest version: 2.0.0

# create-package [![npm](https://img.shields.io/npm/v/@riadh-adrani/create-package?color=blue)](https://www.npmjs.com/package/@riadh-adrani/create-package)

Generate starter Package templates, available template:

- `Package` : a template for creating a `esm` only compatible package using `Typescript`.
npm package: @riadh-adrani/create-recursive-app
Description: Recursive Web project starter template.
Latest version: 1.2.7
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

<h1 align="center">Create Recurisve App</h1>
<p align="center">
<img src="https://raw.githubusercontent.com/RiadhAdrani/recursive/master/logo.png" height="80" width="80">
<br>
<br>
<i>Starter template project for Recursive Web</i>
<p align=center>
<a href="https://www.npmjs.com/package/@riadh-adrani/create-recursive-app"><img src="https://img.shields.io/npm/v/@riadh-adrani/create-recursive-app?color=blue"/></a>
<a href="https://img.shields.io/npm/l/@riadh-adrani/create-recursive-app"><img src="https://img.shields.io/npm/l/@riadh-adrani/create-recursive-app"/></a>
</p>
</p>

---

Provide a template to start devloping with `Recursive Web`.

To get started, run :

```shell
npx @riadh-adrani/create-recursive-app my-app
```

It will create a directory called `my-app` in the current folder.

Open up the project folder:

```shell
cd my-app
```

To start development server:

```shell
npm start
```

In the browser, check http://localhost:8080/

`Hot reloading enabled !`

Thank you for trying Recursive 😀
npm package: @riadh-adrani/dom-utils
Description: Utility functions to create and manipulate elements in the DOM.
Author: riadh-adrani
Latest version: 1.3.2

<h1 align="center">Dom Utils</h1>
<p align="center">
<a href="https://www.npmjs.com/package/@riadh-adrani/dom-utils">
<img src="https://img.shields.io/npm/v/@riadh-adrani/dom-utils?color=blue" />
</a>
<a href="https://github.com/RiadhAdrani/utility-js/actions">
<img src="https://img.shields.io/endpoint.svg?url=https%3A%2F%2Factions-badge.atrox.dev%2FRiadhAdrani%2Fdom-control-js%2Fbadge%3Fref%3Dmaster&style=flat"/>
</a>
<a href="https://riadhadrani.github.io/dom-control-js/">
<img src="https://img.shields.io/badge/docs-documentation-green" />
</a>

<p align="center">Utility functions to create, update and manipulate DOM elements.</p>

<p align="center"> This package is purely esm, read <a href="https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c" target="_blank">this article</a> for more information. </p>
npm package: @riadh-adrani/math-utils
Description: Javascript math utilities
Latest version: 1.0.2

# math-utils [![npm](https://img.shields.io/npm/v/@riadh-adrani/math-utils?color=blue)](https://www.npmjs.com/package/@riadh-adrani/math-utils) [![CI/CD](https://github.com/RiadhAdrani/math-utils/actions/workflows/checks.yml/badge.svg)](https://github.com/RiadhAdrani/math-utils/actions/workflows/checks.yml)

Javascript math utilities.

Check documentation [`here`](https://riadhadrani.github.io/utility-js/math.html)
npm package: @riadh-adrani/postcss-plugin-ignore-file
Description: PostCSS plugin that ignore a file with a comment
Author: RiadhAdrani
Latest version: 0.0.0

# postcss-plugin-ignore-file

[PostCSS] plugin that ignore a file with a comment.

[PostCSS]: https://github.com/postcss/postcss

```css
/* @ignore */

.foo {
  /* Input example */
}
```

```css

```

## Usage

**Step 1:** Install plugin:

```sh
npm install --save-dev postcss postcss-plugin-ignore-file
```

**Step 2:** Check you project for existed PostCSS config: `postcss.config.js`
in the project root, `"postcss"` section in `package.json`
or `postcss` in bundle config.

If you do not use PostCSS, add it according to [official docs]
and set this plugin in settings.

**Step 3:** Add the plugin to plugins list:

```diff
module.exports = {
  plugins: [
+   require('postcss-plugin-ignore-file'),
    require('autoprefixer')
  ]
}
```

[official docs]: https://github.com/postcss/postcss#usage
npm package: @riadh-adrani/recursive
Description: Recursive is a Javascript framework to build beautiful component-based apps.
Latest version: 0.8.1
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

<h1 align="center">Recursive</h1>
<p align="center">
<img src="logo.png" height="80" width="80">
<br>
<br>
<i>Recursive is a JavaScript framework to build beautiful applications.</i>
<p align=center>
<a href="https://www.npmjs.com/package/@riadh-adrani/recursive"><img src="https://img.shields.io/npm/v/@riadh-adrani/recursive?color=blue"/></a>
<a href="https://github.com/RiadhAdrani/recursive/actions"><img src="https://img.shields.io/endpoint.svg?url=https%3A%2F%2Factions-badge.atrox.dev%2FRiadhAdrani%2Frecursive%2Fbadge%3Fref%3Dmaster&style=flat"/></a>
<a href="https://img.shields.io/npm/l/@riadh-adrani/recursive"><img src="https://img.shields.io/npm/l/@riadh-adrani/recursive"/></a>
</p>
</p>

---

As of now, Recursive is available only for [Web](https://github.com/RiadhAdrani/recursive-web).

### Documentation

Get started with Recursive and explore the documentation:

-   [Getting Started](https://riadhadrani.github.io/recursive-docs/get-started)
-   [Core API](https://riadhadrani.github.io/recursive-docs/core)
-   [Web API](https://riadhadrani.github.io/recursive-docs/web)
npm package: @riadh-adrani/recursive-components
Description: The official component kit for Recurisve.js
Latest version: 0.0.4
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# Recursive Components [![Version](https://img.shields.io/npm/v/@riadh-adrani/recursive-components?color=blue)](https://www.npmjs.com/package/@riadh-adrani/recursive-components) [![Licence](https://img.shields.io/npm/l/@riadh-adrani/recursive-components)](https://github.com/RiadhAdrani/recursive-components/blob/master/LICENSE)

`Recursive Components` contains the official standard HTML Elements for the `Recursive` framework, with the addition of tens of other utility components.

### Installtion

```
npm install @riadh-adrani/recursive-components
```

_`Note` if you started a project using `create-recursive-app`, you don't need to install this library._

### Components

-   `Standard` : The standard HTML element as valid component for Recursive.

-   `Utility` : utility component like a `Spacer`, `Column`, `Row`, `LazyColumn` or even an `EasyForm` .

-   `Spinners` : Highly customizable spinners

-   Coming soon :

    -   `Material UI` : The Recursive replica form of material-ui.
    -   `Recursive Kit` : Extensive library of components.

Thank you for using Recursive Components 😀
npm package: @riadh-adrani/recursive-web
Description: Recursive Web is the web implementation of the Recursive Framework.
Latest version: 0.8.0
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

<h1 align="center">Recursive Web</h1>
<p align="center">
<img src="https://raw.githubusercontent.com/RiadhAdrani/recursive/master/logo.png" height="80" width="80">
<br>
<br>
<i>Recursive Web is a JavaScript framework to build singe page web applications.</i>
<p align=center>
<a href="https://www.npmjs.com/package/@riadh-adrani/recursive-web"><img src="https://img.shields.io/npm/v/@riadh-adrani/recursive-web?color=blue"/></a>
<a href="https://github.com/RiadhAdrani/recursive-web/actions"><img src="https://img.shields.io/endpoint.svg?url=https%3A%2F%2Factions-badge.atrox.dev%2FRiadhAdrani%2Frecursive-web%2Fbadge%3Fref%3Dmaster&style=flat"/></a>
<a href="https://img.shields.io/npm/l/@riadh-adrani/recursive-web"><img src="https://img.shields.io/npm/l/@riadh-adrani/recursive-web"/></a>
</p>
</p>

---

This repository hosts the source code of the `Recursive Web` framework.

### Documentation

Get started with Recursive and explore the documentation:

-   [Getting Started](https://riadhadrani.github.io/recursive-docs/get-started)
-   [Core API](https://riadhadrani.github.io/recursive-docs/core)
-   [Web API](https://riadhadrani.github.io/recursive-docs/web)
npm package: @riadh-adrani/ruvy
Description: Ruvy is a lightweight front-end framework inspired by the principles of React, designed specifically for learning purposes. It incorporates familiar concepts such as JSX, function components, and hooks, providing a simplified and synchronous approach to b
Latest version: 0.5.9

# Ruvy &middot; <a href="https://www.npmjs.com/package/@riadh-adrani/ruvy"><img src="https://img.shields.io/npm/v/@riadh-adrani/ruvy?color=blue"/></a> [![CI](https://github.com/RiadhAdrani/ruvy/actions/workflows/ci.yml/badge.svg)](https://github.com/RiadhAdrani/ruvy/actions/workflows/ci.yml) <a href="https://github.com/RiadhAdrani/ruvy/actions/workflows/docs.yml"><img src="https://github.com/RiadhAdrani/ruvy/actions/workflows/docs.yml/badge.svg"/></a> <a href="https://deepscan.io/dashboard#view=project&tid=22283&pid=25619&bid=803315"><img src="https://deepscan.io/api/teams/22283/projects/25619/branches/803315/badge/grade.svg" alt="DeepScan grade"></a>

Ruvy is a lightweight front-end framework inspired by the principles of React, designed specifically for learning purposes. It incorporates familiar concepts such as JSX, function components, and hooks, providing a simplified and synchronous approach to building web applications.

## Features

- JSX syntax for writing expressive and reusable UI components.
- Function components for a modular and composable code structure.
- Hooks for managing state, performing side effects, and custom logic reuse.
- Synchronous rendering for a straightforward and beginner-friendly development experience.
- Intuitive API that closely resembles React's patterns and conventions.

## Getting Started

To get started with Ruvy, you can generate a starter template using our `cli` :

```bash
npx @riadh-adrani/create-ruvy
```

Or you can try it in [`StackBlitz`](https://stackblitz.com/edit/ruvy-dbjavf?file=src%2Fmain.tsx).

## Contributing

Contributions to Ruvy are welcome! If you encounter any issues, have suggestions for improvements, or want to contribute new features, please feel free to submit a pull request. Let's learn and grow together!

## License

Ruvy is released under the MIT License. Feel free to use, modify, and distribute this framework for personal or educational purposes.

## Acknowledgments

We would like to express our gratitude to the React community for their inspiring work, which served as the foundation for Ruvy. Special thanks to all the contributors who have helped shape this framework.

## Contact

If you have any questions, feedback, or just want to say hello, you can reach us at [`riadh_adrani@hotmail.fr`](riadh_adrani@hotmail.fr). We'd love to hear from you!

Happy coding with Ruvy!
npm package: @riadh-adrani/str-utils
Description: Javascript string utilities
Latest version: 1.0.3

# str-utils [![npm](https://img.shields.io/npm/v/@riadh-adrani/str-utils?str=blue)](https://www.npmjs.com/package/@riadh-adrani/str-utils) [![CI/CD](https://github.com/RiadhAdrani/str-utils/actions/workflows/actions.yml/badge.svg)](https://github.com/RiadhAdrani/str-utils/actions/workflows/actions.yml)

Javascript string utilities.

Check documentation [`here`](https://riadhadrani.github.io/utility-js/string.html)
npm package: @riadh-adrani/type-utils
Description: Javascript types library
Latest version: 1.1.0

# type-utils [![npm](https://img.shields.io/npm/v/@riadh-adrani/type-utils?color=blue)](https://www.npmjs.com/package/@riadh-adrani/type-utils) [![CI/CD](https://github.com/RiadhAdrani/type-utils/actions/workflows/checks.yml/badge.svg)](https://github.com/RiadhAdrani/type-utils/actions/workflows/checks.yml)

Javascript utility types.

Check documentation [`here`](https://riadhadrani.github.io/utility-js/types.html)
npm package: @riadh-adrani/utility-js
Description: contains utility functions
Author: riadh-adrani
Latest version: 0.31.0-esm
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

<h1 align="center">Utility-js</h1>
<p align="center">
<i>My Javascript utility functions and types</i>
<p align=center>
<a href="https://www.npmjs.com/package/@riadh-adrani/utility-js"><img src="https://img.shields.io/npm/v/@riadh-adrani/utility-js?color=blue"/></a>
<a href="https://github.com/RiadhAdrani/utility-js/actions"><img src="https://img.shields.io/endpoint.svg?url=https%3A%2F%2Factions-badge.atrox.dev%2FRiadhAdrani%2Futility-js%2Fbadge%3Fref%3Dmaster&style=flat"/></a>
</p>
</p>
npm package: @riadh-adrani/utils
Description: utility functions
Author: riadh-adrani
Latest version: 1.0.0

<h1 align="center">Utils</h1>
<p align="center">
<i>Javascript utility functions and types</i>
<p align=center>
<a href="https://www.npmjs.com/package/@riadh-adrani/utils"><img src="https://img.shields.io/npm/v/@riadh-adrani/utils?color=blue"/></a>
<a href="https://github.com/RiadhAdrani/utils/actions/workflows/node.js.yml"><img src="https://github.com/RiadhAdrani/utils/actions/workflows/node.js.yml/badge.svg" /></a>
<a href="https://riadhadrani.github.io/utils/"><img src="https://img.shields.io/badge/docs-docs-green" /></a>
</p>
</p>
npm package: @riadhossain43/dom-element-picker
Description: Interactively pick elements in the DOM
Author: Harry Marr
Latest version: 0.0.1

# pick-dom-element

## Usage

Create an instance of the `ElementPicker` class, and call its `start()` method to start picking. Provide an `onHover` or `onClick` callback to get the picked element(s). Call `stop()` to stop picking and remove the overlay from the DOM.

```javascript
import { ElementPicker } from "pick-dom-element";

const style = { borderColor: "#0000ff" };
const picker = new ElementPicker({ style });
picker.start({
  onHover: (el) => console.log(`Hover: ${el}`),
  onClick: (el) => {
    picker.stop();
    console.log(`Picked: ${el}`);
  },
});
```

See the [example](example/) directory for a more complete example of how to use the library.
npm package: @riadyounes/eslint-config
Description: ESLint configuration used by Riad Younes and Daniel Nogueira.
Latest version: 1.0.1

# ESLint config

## Setup

### React (with Next.js)

Install dependencies:
```
npm i -D eslint eslint-config-next @riadyounes/eslint-config
```
Inside `.eslintrc.json`
```
{
  "extends": [
    "@riadyounes/eslint-config/next", 
    "next/core-web-vitals"
  ]
}
```

### React (without Next.js)

Install dependencies:
```
npm i -D eslint @riadyounes/eslint-config
```
Inside `.eslintrc.json`
```
{
  "extends": "@riadyounes/eslint-config/react"
}
```

### Node.js

Install dependencies:
```
npm i -D eslint @riadyounes/eslint-config
```
Inside `.eslintrc.json`
```
{
  "extends": "@riadyounes/eslint-config/node"
}
```