open-index/open-npm huggingface dataset:
npm package: @rj12info/quillimageupload
Description: A module for Quill rich text editor to upload images to be selected from toolbar editor.
Author: @fxmontigny
Latest version: 0.1.3

# Quill ImageUpload Module

A module for Quill rich text editor to upload images to be selected from toolbar editor.

## Usage

### Webpack/ES6

```javascript
import Quill from 'quill';
import { ImageUpload } from 'quill-image-upload';

Quill.register('modules/imageUpload', ImageUpload);

const quill = new Quill(editor, {
	// ...
	modules: {
		// ...
		imageUpload: {
			url: '', // server url. If the url is empty then the base64 returns
			method: 'POST', // change query method, default 'POST'
			name: 'image', // custom form name
			withCredentials: false, // withCredentials
			headers: {}, // add custom headers, example { token: 'your-token'}
			csrf: { token: 'token', hash: '' }, // add custom CSRF
			customUploader: () => {}, // add custom uploader
			// personalize successful callback and call next function to insert new url to the editor
			callbackOK: (serverResponse, next) => {
				next(serverResponse);
			},
			// personalize failed callback
			callbackKO: serverError => {
				alert(serverError);
			},
			// optional
			// add callback when a image have been chosen
			checkBeforeSend: (file, next) => {
				console.log(file);
				next(file); // go back to component and send to the server
			}
		}
	}
});
```

### Script Tag

Copy image-upload.min.js into your web root or include from node_modules

```html
<script src="/node_modules/quill-image-upload/image-upload.min.js"></script>
```

```javascript
var quill = new Quill(editor, {
	// ...
	modules: {
		// ...
		imageUpload: {
			url: '', // server url. If the url is empty then the base64 returns
			method: 'POST', // change query method, default 'POST'
			name: 'image', // custom form name
			withCredentials: false, // withCredentials
			headers: {}, // add custom headers, example { token: 'your-token'}
			// personalize successful callback and call next function to insert new url to the editor
			callbackOK: (serverResponse, next) => {
				next(serverResponse);
			},
			// personalize failed callback
			callbackKO: serverError => {
				alert(serverError);
			}
		}
	}
});
```
npm package: @rjabari/react-native-web-webview
Description: React Native for Web implementation of RN's WebView
Latest version: 1.0.0

# react-native-web-webview

> React Native for Web implementation of RN's WebView

## Getting started
### Fork of react-native-web-webview 

`$ npm install @rjabari/react-native-web-webview --save`

Alias the package in your webpack config:

```
resolve: {
    alias: {
        'react-native': 'react-native-web',
        ...
        'react-native-webview': '@rjabari/react-native-web-webview',
    }
}
```

Add the following rule to your webpack config:

```js
const rule = {
  test: /getMock.html$/,
  use: {
    loader: 'file-loader',
    options: {
      name: '[name].[ext]',
    },
  },
};
```

## Usage

```js
import { WebView } from 'react-native-webview';
```

See [RN's doc](https://github.com/react-native-community/react-native-webview).

Supported props are:

- `source`
- `onMessage`
- `scrollEnabled`
- `injectedJavaScript`
- `style`

Additional, web-specific props are:

- `newWindow`: (_boolean_|_{ name: string, features: string}_)
  This will open the source in a new window, optionally giving it an [internal name and custom features](https://developer.mozilla.org/en-US/docs/Web/API/Window/open).
  By default, the name is `webview` and there are no features set.
  This is useful when your target has X-Frame-Options or a no-CORS policy.
  It currently only supports a `source` prop with a `method` set to `POST`.
  Please feel free to do a PR to support more request types!
- `title`: (_string_) This prop will set the `webview` title.

## Examples

See the [storybook](https://react-native-web-community.github.io/react-native-web-webview/storybook).

## Contributing

PRs are welcome!
npm package: @rjammart/pixi-viewport
Description: A highly configurable viewport/2D camera designed to work with pixi.js. Features include dragging, pinch-to-zoom, mouse wheel zooming, decelerated dragging, follow target, snap to point, snap to zoom, clamping, bouncing on edges, and move on mouse edges.
Author: David Figatner
Latest version: 3.7.5

# pixi-viewport
A highly configurable viewport/2D camera designed to work with pixi.js.

Features include dragging, pinch-to-zoom, mouse wheel zooming, decelerated dragging, follow target, snap to point, snap to zoom, clamping, bouncing on edges, and move on mouse edges. See live example to try out all of these features.

All features are configurable and removable, so set up the viewport to be exactly what you need.

## Rationale
I kept rewriting 2d cameras for the games I developed with pixi.js, so I decided to package up a generic one. I included options that I need in my games, including edges that bounce, deceleration, and lots of options to tweak the feel of the viewport. 

## Simple Example
```js
var PIXI = require('pixi.js');
var Viewport = require('pixi-viewport');

// create viewport
var viewport = new Viewport({
    screenWidth: window.innerWidth,
    screenHeight: window.innerHeight,
    worldWidth: 1000,
    worldHeight: 1000,

    interaction: app.renderer.interaction // the interaction module is important for wheel() to work properly when renderer.view is placed or scaled
});

// add the viewport to the stage
var app = new PIXI.Application();
document.body.appendChild(app.view);
app.stage.addChild(viewport);

// activate plugins
viewport
    .drag()
    .pinch()
    .wheel()
    .decelerate();

// add a red box
var sprite = viewport.addChild(new PIXI.Sprite(PIXI.Texture.WHITE));
sprite.tint = 0xff0000;
sprite.width = sprite.height = 100
sprite.position.set(100, 100);
```

## Live Example
[https://davidfig.github.io/pixi-viewport/](https://davidfig.github.io/pixi-viewport/)

## API Documentation
[https://davidfig.github.io/pixi-viewport/jsdoc/](https://davidfig.github.io/pixi-viewport/jsdoc/)

## Installation

    npm i pixi-viewport

or [grab the latest release](https://github.com/davidfig/pixi-viewport/releases/) and use it like:

```html
<script src="/directory-to-file/pixi.js"></script>
<script src="/directory-to-file/pixi-viewport.js"></script>
<script>
    var Viewport = new PIXI.extras.Viewport(options);
</script>
```

## license  
MIT License  
(c) 2018 [YOPEY YOPEY LLC](https://yopeyopey.com/) by [David Figatner](https://twitter.com/yopey_yopey/)
npm package: @rjbaj/knex-repo-manager
Description: _description_
Author: Rajib Bajracharya
Latest version: 0.1.7

# pkg-placeholder

[![npm version][npm-version-src]][npm-version-href]
[![npm downloads][npm-downloads-src]][npm-downloads-href]
[![bundle][bundle-src]][bundle-href]
[![JSDocs][jsdocs-src]][jsdocs-href]
[![License][license-src]][license-href]

_description_

## Sponsors

<p align="center">
  <a href="https://cdn.jsdelivr.net/gh/antfu/static/sponsors.svg">
    <img src='https://cdn.jsdelivr.net/gh/antfu/static/sponsors.svg'/>
  </a>
</p>

## License

[MIT](./LICENSE) License © [Anthony Fu](https://github.com/antfu)

<!-- Badges -->

[npm-version-src]: https://img.shields.io/npm/v/pkg-placeholder?style=flat&colorA=080f12&colorB=1fa669
[npm-version-href]: https://npmjs.com/package/pkg-placeholder
[npm-downloads-src]: https://img.shields.io/npm/dm/pkg-placeholder?style=flat&colorA=080f12&colorB=1fa669
[npm-downloads-href]: https://npmjs.com/package/pkg-placeholder
[bundle-src]: https://img.shields.io/bundlephobia/minzip/pkg-placeholder?style=flat&colorA=080f12&colorB=1fa669&label=minzip
[bundle-href]: https://bundlephobia.com/result?p=pkg-placeholder
[license-src]: https://img.shields.io/github/license/antfu/pkg-placeholder.svg?style=flat&colorA=080f12&colorB=1fa669
[license-href]: https://github.com/antfu/pkg-placeholder/blob/main/LICENSE
[jsdocs-src]: https://img.shields.io/badge/jsdocs-reference-080f12?style=flat&colorA=080f12&colorB=1fa669
[jsdocs-href]: https://www.jsdocs.io/package/pkg-placeholder
npm package: @rjcarvalho/react-flipcard
Description: React flip card component
Author: Matt Zabriskie
Latest version: 0.2.4

#react-flipcard

React flip card component

## Installing

```bash
$ npm install react-flipcard
# or
$ bower install react-flipcard
```

## Demo

[http://mzabriskie.github.io/react-flipcard/basic](http://mzabriskie.github.io/react-flipcard/basic)

## Example

```js
import React from 'react';
import FlipCard from 'react-flipcard';

var App = React.createClass({
  getInitialState() {
    return {
      isFlipped: false
    };
  },

  showBack() {
    this.setState({
      isFlipped: true
    });
  },

  showFront() {
    this.setState({
      isFlipped: false
    });
  },

  handleOnFlip(flipped) {
    if (flipped) {
      this.refs.backButton.getDOMNode().focus();
    }
  },

  handleKeyDown(e) {
    if (this.state.isFlipped && e.keyCode === 27) {
      this.showFront();
    }
  },

  render() {
    return (
      <div>
        {/* Default behavior is horizontal flip on hover, or focus */}
        <FlipCard>
          {/* The first child is used as the front of the card */}
          <div>
            <div>Front</div>
            <div><small>(horizontal flip)</small></div>
          </div>
          {/* The second child is used as the back of the card */}
          <div>Back</div>
        </FlipCard>

        {/* The `type` attribute allows using a vertical flip */}
        <FlipCard type="vertical">
          <div>
            <div>Front</div>
            <div><small>(vertical flip)</small></div>
          </div>
          <div>Back</div>
        </FlipCard>

        {/*
          The `disabled` attribute allows turning off the auto-flip
          on hover, or focus. This allows manual control over flipping.

          The `flipped` attribute indicates whether to show the front,
          or the back, with `true` meaning show the back.
        */}
        <FlipCard
          disabled={true}
          flipped={this.state.isFlipped}
          onFlip={this.handleOnFlip}
          onKeyDown={this.handleKeyDown}
        >
          <div>
            <div>Front</div>
            <button type="button" onClick={this.showBack}>Show back</button>
            <div><small>(manual flip)</small></div>
          </div>
          <div>
            <div>Back</div>
            <button type="button" ref="backButton" onClick={this.showFront}>Show front</button>
          </div>
        </FlipCard>
      </div>
    );
  }
});

React.render(<App/>, document.getElementById('container'));
```

## Credits

This component is largely a React wrapper for CSS created by [David Walsh](http://davidwalsh.name/css-flip).

## License

MIT
npm package: @rjchow/nod
Description: My node module
Author: Diego Haz
Latest version: 1.10.6

# nod

NodeJS module generator/boilerplate.

## Features

*   [**Babel**](https://babeljs.io/) - Write next generation JavaScript today.
*   [**Debug**](https://github.com/visionmedia/debug) - JS debugging utility that works both in node.js and browsers.
*   [**Jest**](https://facebook.github.io/jest) - JavaScript testing framework used by Facebook.
*   [**ESLint**](http://eslint.org/) - Make sure you are writing a quality code.
*   [**Prettier**](https://prettier.io/) - Enforces a consistent style by parsing your code and re-printing it.
*   [**Typescript**](https://www.typescriptlang.org/) - A static type checker for JavaScript by Microsoft.
*   [**Circle CI**](https://circleci.com/) - Automate tests, linting and releases for every push or pull request.
*   [**Documentation**](http://documentation.js.org/) - A documentation system so good, you'll actually write documentation.
*   [**Semantic Release**](https://github.com/semantic-release/semantic-release) - Fully automated version management and package publishing.

## Install

`git clone` this repo

```sh
$ git clone https://github.com/rjchow/nod my-module
$ cd my-module
$ rm -rf .git
$ npm install # or yarn
```

Just make sure to edit `package.json`, `README.md` and `LICENSE` files accordingly with your module's info.

## Commands

```sh
$ npm test # run tests with Jest
$ npm run coverage # run tests with coverage and open it on browser
$ npm run lint # lint code
$ npm run docs # generate docs
$ npm run build # generate docs and transpile code
```

## Setting up CI with automatic semantic-release versioning

*   Obtain CircleCI API token
*   Modify package.json with:
    *   package name
    *   package repository

Run `npx semantic-release-cli setup --ask-for-passwords`

## Logging

Turn on debugging by using the DEBUG environment variable for Node.js and using localStorage.debug in the browser.

E.g:

```bash
DEBUG="PLACEHOLDER_PROJECT_NAME:*" npm run dev
```

## Commit message format

This boiler plate uses the **semantic-release** package to manage versioning. Once it has been set up, version numbers and Github release changelogs will be automatically managed. **semantic-release** uses the commit messages to determine the type of changes in the codebase. Following formalized conventions for commit messages, **semantic-release** automatically determines the next [semantic version](https://semver.org) number, generates a changelog and publishes the release.

Use `npm run commit` instead of `git commit` in order to invoke Commitizen commit helper that helps with writing properly formatted commit messages.

## API

<!-- Generated by documentation.js. Update this documentation by updating the source code. -->

### Table of Contents

## License

MIT © [Diego Haz](https://github.com/diegohaz)
npm package: @rjdellecese/fp-ts-routing
Description: A type-safe routing library for TypeScript
Author: RJ Dellecese
Latest version: 0.6.0

⚠️ This is a fork of [gcanti/fp-ts-routing](https://github.com/gcanti/fp-ts-routing). ⚠️

# Installation

To install the stable version:

```sh
npm install @rjdellecese/fp-ts-routing
```

# Usage

```ts
//
// locations
//

interface Home {
  readonly _tag: 'Home'
}

interface User {
  readonly _tag: 'User'
  readonly id: number
}

interface Invoice {
  readonly _tag: 'Invoice'
  readonly userId: number
  readonly invoiceId: number
}

interface NotFound {
  readonly _tag: 'NotFound'
}

type Location = Home | User | Invoice | NotFound

const home: Location = { _tag: 'Home' }

const user = (id: number): Location => ({ _tag: 'User', id })

const invoice = (userId: number, invoiceId: number): Location => ({ _tag: 'Invoice', userId, invoiceId })

const notFound: Location = { _tag: 'NotFound' }

// matches
const defaults = end
const homeMatch = lit('home').then(end)
const userIdMatch = lit('users').then(int('userId'))
const userMatch = userIdMatch.then(end)
const invoiceMatch = userIdMatch
  .then(lit('invoice'))
  .then(int('invoiceId'))
  .then(end)

// router
const router = zero<Location>()
  .alt(defaults.parser.map(() => home))
  .alt(homeMatch.parser.map(() => home))
  .alt(userMatch.parser.map(({ userId }) => user(userId)))
  .alt(invoiceMatch.parser.map(({ userId, invoiceId }) => invoice(userId, invoiceId)))

// helper
const parseLocation = (s: string): Location => parse(router, Route.parse(s), notFound)

import * as assert from 'assert'

//
// parsers
//

assert.strictEqual(parseLocation('/'), home)
assert.strictEqual(parseLocation('/home'), home)
assert.deepEqual(parseLocation('/users/1'), user(1))
assert.deepEqual(parseLocation('/users/1/invoice/2'), invoice(1, 2))
assert.strictEqual(parseLocation('/foo'), notFound)

//
// formatters
//

assert.strictEqual(format(userMatch.formatter, { userId: 1 }), '/users/1')
assert.strictEqual(format(invoiceMatch.formatter, { userId: 1, invoiceId: 2 }), '/users/1/invoice/2')
```

# Documentation

- [API Reference](https://rjdellcese.github.io/fp-ts-routing)
npm package: @rjdev/selection
Description: Lightweight and efficient content selection utility for web applications
Author: Russell Xio
Latest version: 0.0.0-alpha.1.3

# Selection

> Content Selection DOM Utility

## Usage

### Initialize Content Selection

```js
const ts = contentSelection({
  onSelect: (data) => {
    const { text, isSingleLine, isBackward } = data
    // Handle selection
  },
  onDeselect: (data) => {
    // Handle deselection
  }
})
```

### Activate In Vue3 Component

```js
onMounted(() => {
  ts.on()
})

onBeforeUnmount(() => {
  ts.off()
})
```

### Activate in React Component

```js
useEffect(() => {
  ts.on()
  return () => ts.off()
}, [])
```

### API Reference

| Method | Description |
|--------|-------------|
| `ts.on()` | Activates the content selection listener |
| `ts.off()` | Deactivates the content selection listener |

### Selection Data

The `onSelect` callback receives a data object with the following properties:

| Property | Type | Description |
|----------|------|-------------|
| `text` | string | The selected text content |
| `isSingleLine` | boolean | Whether the selection is on a single line |
| `isBackward` | boolean | Whether the selection was made backwards |
| `startRect` | DOMRect | The bounding rectangle of the start of the selection |
| `endRect` | DOMRect | The bounding rectangle of the end of the selection |
| `locateRect` | DOMRect | The bounding rectangle of the current selection location, perform like `endRect` |

### Example

```js
const ts = contentSelection({
  onSelect: ({ text, isSingleLine, isBackward }) => {
    console.log('Selected text:', text)
    console.log('Is single line:', isSingleLine)
    console.log('Is backward selection:', isBackward)
  },
  onDeselect: () => {
    console.log('Selection cleared')
  }
})

// Activate the selection listener
ts.on()

// Later, when you want to stop listening
ts.off()
```

### License

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


### Support

If you encounter any problems or have questions about using this library, please open an issue on the GitHub repository. I'll do my best to assist you.