open-index/open-npm huggingface dataset:
npm package: @ricciodev/create-scaffolding-vue
Description: A simple scaffolding for VueJS
Author: Donnie Rich
Latest version: 1.0.5

## Scaffolding Vue

A simple scaffolding package to boost Vue 3 project creation!

### How to use this package

Just run `npm create @ricciodev/scaffolding-vue` to have your new project ready to run!

### What's inside?

Inside your new project you will find the following packages:
- VueJS 3
- VueRouter
- Vitest
- Bootstrap
- Sass
- Make JS Component

And a `store.js` state manager!
npm package: @riccoski/react-use-form
Description: A hook for using forms in React
Author: Ricco Sobers
Latest version: 0.0.2

# react-use-form

## Install

```bash
yarn add --save @riccoski/react-use-form
```

## Usage

```javascript
import React from "react";
import useForm from "react-use-form";
import * as yup from "yup";

function App() {
  const { handleChange, handleSubmit } = useForm({
    onSubmit(values) {
      console.log("values", values);
    },
    validationSchema: yup.object().shape({
      password: yup.string().required(),
      email: yup
        .string()
        .email()
        .required()
    })
  });

  return (
    <form onSubmit={handleSubmit}>
      <label>Email address</label>
      <input
        onChange={handleChange}
        name="email"
        type="email"
        placeholder="Enter email"
      />
      <label>Password</label>
      <input
        onChange={handleChange}
        type="password"
        name="password"
        placeholder="Password"
      />
      <button type="submit">Log in</button>
    </form>
  );
}

export default App;
```

## License

MIT © [riccoski](https://github.com/riccoski)
npm package: @riccox/colorify
Description: A type-safe, simple color tool javascript util lib
Author: Ricco Xie
Latest version: 0.3.0

# @riccox/colorify

![GitHub Workflow Status](https://img.shields.io/github/actions/workflow/status/riccox/colorify-js/release-please.yml?branch=main)
![release](https://img.shields.io/github/v/release/riccox/colorify-js?display_name=release)
![stars](https://img.shields.io/github/stars/riccox/colorify-js)
![issues](https://img.shields.io/github/issues/riccox/colorify-js)
![last-commit](https://img.shields.io/github/last-commit/riccox/colorify-js)
![license](https://img.shields.io/github/license/riccox/colorify-js)

#### A type-safe, simple color tool javascript util lib

> [IMPORTANT] The main branch may be unstable or unavailable during development.
>
> Please use release instead of main branch to obtain a stable version app

## Demo

There is a live usage demo 👉 [colorify](https://codesandbox.io/s/riccox-colorify-rnysxv), deploy on Codesandbox.

## Usage

```sh
npm i @riccox/colorify --save
```

```typescript
import { singleColorPalette, foregroundColor } from '@riccox/colorify';

// returns a new hex color string array by given primary color.
console.log(singleColorPalette('#0f0',12))

// return a new hex color string (#000 or #FFF) by given background color.
console.log(foregroundColor('#0f0'))
```

## Development

```sh
git clone git@github.com:riccox/colorify-js.git

cd colorify-js

pnpm install
```
npm package: @ricdotnet/cli
Description: A cli framework to create cli tools.
Author: ricdotnet
Latest version: 0.2.0

## This is still WIP

### Configuration
```text
Create a file in your project root and name it clitool.config.ts. You can use the template below.
```

```ts
import { IConfig } from "...";

export const config: IConfig = {
  command: 'CLIFramework', // this might be removed
  dir: 'commands', // where you store your commands
};
```

### Sample command
```ts
import { Command } from '...';
import { ICommand } from '...';
import { Spinner } from '...';
import { Prompt } from '...';

@Command('test') // command name
export class TestCommand implements ICommand {
  description: string = 'this command does something'; // description to show on help
  private spinner: Spinner;
  
  async run(): Promise<void> {
    
    this.spinner = new Spinner({ spinner: 'braile' });
    const name = await Prompt.ask('What is your name?');

    this.spinner.start(); // start the spinner
    await new Promise((res) => setTimeout(res, 5000)); // a long running task
    this.spinner.stop(); // stop the spinner

    const surname = await Prompt.ask('What is your surname?');

    this.spinner.changeSpinner('circleNumbers'); // the user can change the spinner
    this.spinner.start(); // start the spinner
    await new Promise((res) => setTimeout(res, 5000)); // a long running task
    this.spinner.stop(); // stop the spinner

    console.log(`Hello ${name} ${surname}!`);
  }
}
```
npm package: @ricdotnet/upfile
Description: two simple ways to use: - plain - promise - on event
Author: Ricardo Rocha
Latest version: 1.0.0

#### How to use (only with expressjs)

two simple ways to use:
- plain
- promise
- on event

```typescript
import { Request, Response, NextFunction } from 'express';
import { Upfile } from '@ricdotnet/upfile';

// plain
// this version will use call the next() function when we finish parsing the incoming body
function upload(req: Request, res: Response, next: NextFunction) {
  const upfile = new Upfile('uploads path');

  upfile.parseIncomingBody(req, res, next);
}

// event
// we have an 'uploaded' event that gets fired when we finish parsing the incoming body
function upload(req: Request, res: Response, next: NextFunction) {
  const upfile = new Upfile('uploads path');

  upfile.parseIncomingBody(req, res);

  upfile.on('uploaded', () => next());
}

// promise
// this just allows us to await until we finish parsing the incoming body
async function upload(req: Request, res: Response, next: NextFunction) {
  const upfile = new Upfile('uploads path');

  await upfile.parseIncomingBody(req, res);

  next();
}

route.post('/upload', upload, (req: Request, res: Response) => {
  // data available on
  console.log(req.files); // files
  console.log(req.body); // other data
});
```