open-index/open-npm huggingface dataset:
npm package: @luisgilgb/react-utils
Description: A bunch of utils for ReactJS.
Author: Luis Gil Gutiérrez de la Barreda
Latest version: 0.3.0

# @luisgilgb/react-utils

A bunch of utils for ReactJS.

These module is NOT for React components, but native JavaScript content (such as functions or constants) whose aim is to help ReactJS developers (initializing, avoiding repetitive tasks, optimizing, etc.).

## Getting Started

These instructions will let you use these utils in your application.

### Installing

Install this module as a dependency from npm.

```
npm install @luisgilgb/react-utils
```

## Built With

* [ReactJS](http://reactjs.org/) - The web framework used
* [npm](https://www.npmjs.org/) - Dependency Management
* [Sublime Text 3](https://www.sublimetext.com/) - Text editor for development

## Contributing

TBD

## Versioning

We use [SemVer](http://semver.org/) for versioning. For the versions available, see the [tags on this repository](https://github.com/LuisGilGB/react-utils/tags).

## Authors

* **[Luis Gil Gutiérrez de la Barreda](https://github.com/LuisGilGB)**

See also the list of [contributors](https://github.com/LuisGilGB/react-utils/contributors) who participated in this project.

## License

This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details

## Acknowledgments

* ReactJS community and developers.
npm package: @luisguillen/testnpm
Description: my first npm module
Author: Luis Guillen
Latest version: 0.1.0

# My First NPM Package

Hi, you can use my npm module in your project.

My twitter is [Luis Guillen](https://twitter.com/luisguillen2005). You can follow me.

## Description

Convert a date time in mexican format at time to call `toStringMex` method.

## Hpw to install it

`npm install testnpm`

## How to use it

Just create a `DateTime` object like this:

> `import spanishdate as require('spanishdate')`

> `let date = spanishdate(new Date(2017, 11, 1))`

> `console.log(date)`

It will show in console:

> Viernes 1 de Diciembre de 2017
npm package: @luisgv94/conversor
Description: Conversor de pesos
Author: Luis Gomero
Latest version: 0.1.0

# Conversor

Conversor es un programa desarrollado para el curso de JS
y permite convertir pesos de Kg. a Lib. y viceversa

##Descripción del programa
- Al ingresar pesos en Kg. lo convierte e Libras
- Al ingresar pesos en Lib. lo convierte a Jg.

## Instalacion
```
npm install conversor
```

##

```
import conversor from 'conversor'
conversor()


```
##Créditos
-[Luis Gomero](https://twitter.com/luisgv94)

##Licencia
[MIT](https://opensource.org/licenses/MIT)
npm package: @luisgv94/platzom
Description: Traductor de idioma platzon
Author: Luis Gomero
Latest version: 0.1.0

# Platzom

Platzom es un idioma inventado para el [Curso de Fundamentos de JavaScript](https://platzi.com/js) de [Platzi](https://platzi.com), el mejor lugar de educación online

## Descripción del idioma

- Si la palabra termina con "ar", se le quitan esas dos letras
- Si la palabra inicia con Z, se le añade "pe" al final
- Si la palabra traducida tiene 10 o más letras, se debe partir en dos por la mitad y unir con un guión medio
- Por último, si la palabra original es un palíndromo, ninguna regla anterior cuenta y se devuelve la misma palabra pero intercalando letras mayúsculas y minúsculas

## Instalación

```
npm install platzom
```

## Uso

```
import platzom from 'platzom'

platzom("Programar") // Program
platzom("Zorro") // Zorrope
platzom("Zarpar") // Zarppe
platzom("abecedario") // abece-dario
platzom("sometemos") // SoMeTeMoS
```

## Créditos
- [Sacha Lifszyc](https://twitter.com/@slifszyc)

## Licencia

[MIT](https://opensource.org/licenses/MIT)
npm package: @luisiacc/react-use-modal
Description: > A react library for managing the state of your modals
Author: luisiacc
Latest version: 0.1.3

# react-use-modal

> A react library for managing the state of your modals

## Install

```bash
npm install --save react-use-modal
```

## Quick notes

The library doesn't care how you render your modal, it just handles the state to render it, and optionally pass data
to it if required, sort of like `react-query` does on queries.

## Usage

This is just a showcase, please refer to the docs to see how to cover most use cases

```tsx
import React from "react"

import SomeModal from "some-modal"; // I'm just making this up, imagine is a real modal
import { useModal, ModalController } from "react-use-modal"

function Example(props: any) {
  const modals = useModal()

  const doSomething = (data: any) => {
    // ...
  }

  return (
    <>
      <button onClick={() => modals.push("some-modal")}>Show something</button>
      <ModalController name="some-modal" render={modal => (
        <SomeModal visible onCancel={modal.cancel} onSave={(someData: any) => {
          doSomething(someData)
          modal.submit();
        }}>
      )} />
    </>
  )
}
```

- If you are using the `<ModalController />` inside a router, and your modal does some kind of redirection,
you should import `ModalController` from `@luisiacc/use-react-modal/router` like:

```ts
import {ModalController} from "@luisiacc/use-react-modal/router"
```
npm package: @luiskhernandez/demo-chakra-ui
Description: Made with create-react-library
Author: luiskhernandez
Latest version: 0.0.1

# demo-chakra-ui

> Made with create-react-library

[![NPM](https://img.shields.io/npm/v/demo-chakra-ui.svg)](https://www.npmjs.com/package/demo-chakra-ui) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)

## Install

```bash
npm install --save demo-chakra-ui
```

## Usage

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

import MyComponent from 'demo-chakra-ui'
import 'demo-chakra-ui/dist/index.css'

class Example extends Component {
  render() {
    return <MyComponent />
  }
}
```

## License

MIT © [luiskhernandez](https://github.com/luiskhernandez)
npm package: @luiskunz/gatsby-theme-podcast
Description: Podcast gatsby theme.
Author: @harry830622
Latest version: 1.0.1

# Gatsby Theme Podcast

## Usage

1. Install the theme

   ```
   npm install --save @luiskunz/gatsby-theme-podcast
   ```

1. Add the theme to your `gatsby-config.js`:

   ```
   module.exports = {
     plugins: [
       {
         resolve: '@luiskunz/gatsby-theme-podcast',
         options: {
           rssUrl: PODCAST_RSS_URL,
         },
       },
     ],
   }
   ```

1. Start your site

   ```
   gatsby develop
   ```

1. Customize

   See [Shadowing in Gatsby Themes](https://www.gatsbyjs.org/docs/themes/shadowing/) for details.

This theme was created originally from @vojtaholik

https://github.com/vojtaholik/gatsby-theme-simplecast
npm package: @luislard/admin
Description: Automatic administration interface for Hydra-enabled APIs.
Author: Kévin Dunglas
Latest version: 0.6.8

# API Platform Admin

[![Build Status](https://travis-ci.org/api-platform/admin.svg?branch=master)](https://travis-ci.org/api-platform/admin)
[![npm version](https://badge.fury.io/js/%40api-platform%2Fadmin.svg)](https://badge.fury.io/js/%40api-platform%2Fadmin)
[![MIT Licence](https://badges.frapsoft.com/os/mit/mit.svg?v=103)](https://opensource.org/licenses/mit-license.php)

API Platform Admin is a tool to automatically create a beautiful (Material Design) and fully-featured administration interface
for any API supporting [the Hydra Core Vocabulary](http://www.hydra-cg.com/), including but not limited to all APIs created
using [the API Platform framework](https://api-platform.com).

The generated administration is a 100% standalone Single-Page-Application with no coupling to the server part, according
to the API-first paradigm.

API Platform Admin parses Hydra or OpenAPI documentations, then uses the awesome [React-admin](https://marmelab.com/react-admin/)
library (and [React](https://facebook.github.io/react/)) to expose a nice, responsive, management interface (Create-Retrieve-Update-Delete)
for all available resources.

You can also customize all screens by using React-admin components and even raw JavaScript/React code.

## Installation

    yarn add @api-platform/admin

## Usage

```javascript
import React, { Component } from 'react';
import { HydraAdmin } from '@api-platform/admin';

class App extends Component {
  render() {
    return <HydraAdmin entrypoint="https://demo.api-platform.com"/> // Replace with your own API entrypoint
  }
}

export default App;
```

## Features

* Automatically generate an admin interface for all the resources of the API thanks to hypermedia features of Hydra
* Generate list, create, show, edit screens as well as a delete button
* Generate suitable inputs and fields according to the API doc (e.g. number HTML input for numbers, checkbox for booleans, selectbox for relationships...)
* Generate suitable inputs and fields according to Schema.org types if available (e.g. email field for http://schema.org/email)
* Handle relationships
* Pagination support
* Automatically validate if a field is mandatory client-side according to the API description
* Send proper HTTP requests to the API and decode them using Hydra and JSON-LD formats
* Nicely display server-side errors (e.g. advanced validation)
* **100% customizable**

## Documentation

The documentation of API Platform Admin can be browsed [on the official website](https://api-platform.com/docs/admin/).

## Credits

Created by [Kévin Dunglas](https://dunglas.fr). Sponsored by [Les-Tilleuls.coop](https://les-tilleuls.coop).
Commercial support available upon request.
npm package: @luisliuchao/react-slick
Description:  React port of slick carousel
Author: Kiran Abburi
Latest version: 0.28.3

### react-slick

[![Backers on Open Collective](https://opencollective.com/react-slick/backers/badge.svg)](#backers) [![Sponsors on Open Collective](https://opencollective.com/react-slick/sponsors/badge.svg)](#sponsors) [![Join the chat at https://gitter.im/akiran/react-slick](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/akiran/react-slick?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)

##### Carousel component built with React. It is a react port of [slick carousel](http://kenwheeler.github.io/slick/)

## [Documentation](http://react-slick.neostack.com)

### :warning: Alert

:construction: react-slick@0.27.* releases are experimental.  
:white_check_mark: **Use react-slick@0.26 in production** until we make our next stable release (react-slick@0.28)  
:pray: We invite you to test react-slick@0.27.* in dev environment and report any breaking changes.

### Installation

**npm**

```bash
npm install react-slick --save
```

**yarn**

```bash
yarn add react-slick
```

**Also install slick-carousel for css and font**

```bash
npm install slick-carousel

// Import css files
import "slick-carousel/slick/slick.css";
import "slick-carousel/slick/slick-theme.css";
```

or add cdn link in your html

```html
<link
  rel="stylesheet"
  type="text/css"
  charset="UTF-8"
  href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css"
/>
<link
  rel="stylesheet"
  type="text/css"
  href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css"
/>
```

### [PlayGround](https://codesandbox.io/s/ppwkk5l6xx)

### Example

```js
import React from "react";
import Slider from "react-slick";

class SimpleSlider extends React.Component {
  render() {
    var settings = {
      dots: true,
      infinite: true,
      speed: 500,
      slidesToShow: 1,
      slidesToScroll: 1
    };
    return (
      <Slider {...settings}>
        <div>
          <h3>1</h3>
        </div>
        <div>
          <h3>2</h3>
        </div>
        <div>
          <h3>3</h3>
        </div>
        <div>
          <h3>4</h3>
        </div>
        <div>
          <h3>5</h3>
        </div>
        <div>
          <h3>6</h3>
        </div>
      </Slider>
    );
  }
}
```

### Props

For all available props, go [here](https://react-slick.neostack.com/docs/api/).

### Methods

For all available methods, go [here](https://react-slick.neostack.com/docs/api#methods)

### Development

Want to run demos locally

```bash
git clone https://github.com/akiran/react-slick
cd react-slick
npm install
npm start
open http://localhost:8080
```

## Contributing

Please see the [contributing guidelines](./CONTRIBUTING.md)
npm package: @luism/result-ts
Description: Typescript implementation of the Result type pattern
Author: Luis Middleton
Latest version: 0.1.0

# Result

Typescript implementation of the [Result](https://en.wikipedia.org/wiki/Result_type) type pattern.

## Authors

- [@luismiddleton](https://www.github.com/luismiddleton)

## License

[MIT](https://choosealicense.com/licenses/mit/)
npm package: @luism/task-ts
Description: Library for managing deferred asynchronous operations
Author: Luis Middleton
Latest version: 0.1.1

# Task

A lightweight TypeScript library for managing deferred asynchronous operations.

## Overview

The library provides a `Task` class for managing deferred asynchronous computations. It wraps a `Promise` to represent an operation whose result is computed asynchronously, while allowing synchronous access to its current status (`pending`, `succeeded`, or `failed`).

Instead of managing loading, success, and error states separately, you can encapsulate them all within a single `Task` object.

## Key Features

- **Synchronous Status:** Immediately check if a task is `pending`, `succeeded`, or `failed`.
- **Type-Safe:** Full TypeScript support for result and error types.
- **Promise-Based:** Built on top of native `Promise`, so you can still use `then` and `catch`.
- **Lightweight:** No external dependencies.

## Motivation

The primary motivation for this library is to provide a richer interface for managing asynchronous operations. While native `Promise`s are excellent for handling a "future" value, they don't offer a way to synchronously inspect the state of the underlying computation. `Task` fills this gap by encapsulating the entire lifecycle of an async operation, making it easy to handle loading, success, and error states without boilerplate.

## Basic Usage

Creating a `Task` is similar to creating a `Promise`:

```typescript
import { Task } from '@luism/task';

const myTask = new Task<string, Error>((resolve, reject) => {
  setTimeout(() => {
    if (Math.random() > 0.5) {
      resolve("Hello, world!");
    } else {
      reject(new Error("Something went wrong!"));
    }
  }, 1000);
});

console.log(myTask.getStatus()); // "pending"

myTask.run(
  (result) => {
    console.log(myTask.getStatus()); // "succeeded"
    console.log(result); // "Hello, world!"
  },
  (error) => {
    console.log(myTask.getStatus()); // "failed"
    console.error(error.message); // "Something went wrong!"
  }
);
```

## Author
[@luismiddleton](https://www.github.com/luismiddleton)

## License
[MIT](https://choosealicense.com/licenses/mit)
npm package: @luismayo/schinquirer
Description: Schema inquirer
Author: LuisMayo
Latest version: 0.4.1

# schinquirer

[![NPM version](https://badge.fury.io/js/schinquirer.svg)](http://badge.fury.io/js/schinquirer)

> [JSON-Schema](http://json-schema.org/) Prompt Inquirer

## What's up?

<img align="right" width="250" alt="JSON Schema Octopus" src="/assets/jsocto.png" title="JSON Schema"/>

Hey there! This is a simple json-schema inquirer ([json]<b>sch</b>[ema]<b>inquirer</b>), based on famous prompt [inquirer](https://github.com/SBoudrias/Inquirer.js) and [is-my-json-valid](https://github.com/mafintosh/is-my-json-valid) validator.

## Getting started

```shell
npm install --save schinquirer
```

## Usage

```js
var schinquirer = require("schinquirer");

schinquirer.prompt(
    {
        name: {
            type: "string",
            pattern: "\\d-\\d"
        },
        car: {
            type: "string",
            enum: ["audi", "bmw", "mercedes", "volkswagen"],
            message: "Which car?",
            default: "mercedes"
        }
    
    },
    function(err, answers) {
        console.log(answers.name, "drives", answers.car);
    }
);

```

## API

#### prompt(schema: Object [, callback: Function(answers: Object)]): Promise

Asks questions by given schema, validates the answers and then invoke callback with them.

Returns native `Promise` (in node < 0.12 - user tiny Promise/A+ compatible library **promiscuous**).

> Note, that `schema` object is a value of `schema.properties` property.

## Extensions to schema

You could use these fields additionally to your schema object:
 
 + message `string` - message (question) to show, if not present property name will printed;
 + default `*` - default value;
 + when `Object{key: string, equal: *}` - ask question, when some answer with `key` equal to `equal`;
 + formatter `string["number"]` - determine which formatter to apply for the input (available is: `number`);
 + formatter `Function -> *` - formatter, applying to the value, returning formatted value.